button {
  /* Safari button has 2px margin */
  margin: 0;
  padding: 0;
  font: inherit;
  color: inherit;
  cursor: pointer;
  background: none;
  border: none;
  outline: none;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
}

body,
p,
pre {
  margin: 0;
}

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

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

li {
  list-style-type: none;
}

a {
  color: inherit;
  text-decoration: none;
}
/**
 * NOTE:
 *   Hover 时使用统一的模式使按钮变暗：
 *   填充型，在原有颜色基础上降低亮度（lightness）5%，如：color-mod(cc(GBL05A) l(-5%))
 */
.Button {
  display: inline-block;
  padding: 0 16px;
  font-size: 14px;
  line-height: 32px;
  color: #8590A6;
  text-align: center;
  cursor: pointer;
  background: none;
  /* 默认使用 currentColor，防止使用方不必要的重置 */
  border: 1px solid;
  border-radius: 3px;
}
/* Firefox button padding, border compatible */
.Button::-moz-focus-inner {
    padding: 0;
    border: 0;
  }
.Button:focus {
    outline: none;
  }
.Button:disabled {
    cursor: default;
    opacity: 0.5;
  }
html[data-theme="dark"] .Button {
  color: #606A80;
}

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

.Button--grey:hover:not(:disabled) {
    background-color: rgba(133, 144, 166, 0.06);
  }

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

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

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

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

.Button--blue:hover:not(:disabled) {
    background-color: rgba(0, 132, 255, 0.06);
  }

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

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

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

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

.Button--green:hover:not(:disabled) {
    /* 尽管绿色不再被使用，但为了保持组件为 API 完整还留着这个  */
    background-color: rgba(17, 166, 104, 0.06);
  }

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

.Button--red:hover:not(:disabled) {
    background-color: rgba(255, 51, 102, 0.06);
  }

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

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

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

/* 填充型的按钮 */
.Button--primary.Button--blue {
    color: #FFFFFF;
    background-color: #0084FF;
  }
.Button--primary.Button--blue:hover:not(:disabled) {
      border-color: hsl(208.94117647058823, 100%, 45%);
      background-color: hsl(208.94117647058823, 100%, 45%);
    }
html[data-theme="dark"] .Button--primary.Button--blue:hover:not(:disabled) {
      border-color: hsl(216, 61.4754098361%, 47.1568627451%);
}
html[data-theme="dark"] .Button--primary.Button--blue:hover:not(:disabled) {
      background-color: hsl(216, 61.4754098361%, 47.1568627451%);
}
html[data-theme="dark"] .Button--primary.Button--blue {
    color: #EBEBEB;
}
html[data-theme="dark"] .Button--primary.Button--blue {
    background-color: #3A76D0;
}
.Button--primary.Button--green {
    color: #FFFFFF;
    background-color: #12b370;
  }
.Button--primary.Button--green:hover:not(:disabled) {
      /* 尽管绿色不再被使用，但为了保持组件为 API 完整还留着这个  */
      border-color: hsl(155.0310559006211, 81.7258883249%, 33.6274509804%);
      background-color: hsl(155.0310559006211, 81.7258883249%, 33.6274509804%) !important;
    }
html[data-theme="dark"] .Button--primary.Button--green {
    color: #EBEBEB;
}
.Button--primary.Button--red {
    color: #FFFFFF;
    background-color: #FF3366;
  }
.Button--primary.Button--red:hover:not(:disabled) {
      border-color: hsl(345, 100%, 55%);
      background-color: hsl(345, 100%, 55%);
    }
html[data-theme="dark"] .Button--primary.Button--red:hover:not(:disabled) {
      border-color: hsl(343.04347826086956, 73.6%, 44.0196078431%);
}
html[data-theme="dark"] .Button--primary.Button--red:hover:not(:disabled) {
      background-color: hsl(343.04347826086956, 73.6%, 44.0196078431%);
}
html[data-theme="dark"] .Button--primary.Button--red {
    color: #EBEBEB;
}
html[data-theme="dark"] .Button--primary.Button--red {
    background-color: #D92155;
}
.Button--primary.Button--grey {
    color: #FFFFFF;
    background-color: #8590A6;
  }
.Button--primary.Button--grey:hover:not(:disabled) {
      border-color: hsl(220.00000000000003, 15.6398104265%, 53.6274509804%);
      background-color: hsl(220.00000000000003, 15.6398104265%, 53.6274509804%);
    }
html[data-theme="dark"] .Button--primary.Button--grey:hover:not(:disabled) {
      border-color: hsl(221.25, 14.2857142857%, 38.9215686275%);
}
html[data-theme="dark"] .Button--primary.Button--grey:hover:not(:disabled) {
      background-color: hsl(221.25, 14.2857142857%, 38.9215686275%);
}
html[data-theme="dark"] .Button--primary.Button--grey {
    color: #EBEBEB;
}
html[data-theme="dark"] .Button--primary.Button--grey {
    background-color: #606A80;
}

.Button--spread {
  width: 100%;
}

.Button-icon {
  margin-right: 7px;
}

.Button--plain .Button-icon {
    margin-right: 6px;
  }

.Button--red .Button-icon,
  .Button--blue .Button-icon,
  .Button--green .Button-icon {
    fill: currentColor;
  }

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

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

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

.Button--plain:hover {
    background-color: transparent;
    background-color: initial;
    color: hsl(220.00000000000003, 15.6398104265%, 53.6274509804%);
  }

html[data-theme="dark"] .Button--plain:hover {
    color: hsl(221.25, 14.2857142857%, 38.9215686275%);
}

.Button--link {
  color: #175199;
}

.Button--link:hover {
    background-color: transparent;
    background-color: initial;
    color: hsl(213.23076923076923, 73.8636363636%, 29.5098039216%);
  }

html[data-theme="dark"] .Button--link:hover {
    color: hsl(213.23076923076923, 73.8636363636%, 29.5098039216%);
}

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

/* 仅有图标的按钮，默认正方形（34x34 与默认高度一致，保持合适触摸区域）*/

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

.Button--withIcon.Button--plain,
  .Button--withIcon.Button--link {
    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: flex;
    flex-direction: row;
    margin-top: 48px;
  }
  .ModalButtonGroup--horizontal .Button {
      flex: 1;
    }
  /* only single Button */
  .ModalButtonGroup--horizontal .Button:last-child:first-child {
        width: 220px;
        margin-right: auto;
        margin-left: auto;
        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: flex;
  flex-direction: column;
  justify-content: center;
  overflow-x: hidden;
  overflow-y: auto;
  transition: opacity 300ms ease-out;
}

  .Modal-wrapper.Modal-enter {
      opacity: 0.01;
    }

  .Modal-wrapper.Modal-enter-active {
      opacity: 1;
    }

  .Modal-wrapper.Modal-leave {
      opacity: 1;
    }

  .Modal-wrapper.Modal-leave-active {
      opacity: 0.01;
    }

.Modal-backdrop {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 0;
  background-color: rgba(26, 26, 26, 0.65);
  transition: background-color 300ms ease-out;
}

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

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

.Modal {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  width: 400px;
  max-height: calc(100vh - 24px * 2);
  margin-right: auto;
  margin-left: auto;
  outline: 0;
  box-shadow: 0 5px 20px rgba(26, 26, 26, 0.1);
  box-sizing: border-box;
  transition: max-height 800ms ease;
}

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

.Modal--large {
    width: 536px;
  }

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

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

.Modal-enter-active .Modal {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    transition: opacity 300ms ease-out, -webkit-transform 300ms ease-out;
    transition: transform 300ms ease-out, opacity 300ms ease-out;
    transition: transform 300ms ease-out, opacity 300ms ease-out, -webkit-transform 300ms ease-out;
  }

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

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

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

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

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

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

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

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

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

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

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

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

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

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

.Modal-content {
  flex: 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;
    transition: opacity 300ms ease-out;
  }

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

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

html[data-theme="dark"] .Modal-footer {
  color: #606A80;
}

html[data-theme="dark"] .Modal-footer {
  background: #2E2E2E;
}

html[data-theme="dark"] .Modal-footer {
  border-top: 1px solid #444444;
}
.Card {
  margin-bottom: 10px;
  background: #FFFFFF;
  overflow: hidden;
  border-radius: 2px;
  box-shadow: 0 1px 3px rgba(26, 26, 26, 0.1);
  box-sizing: border-box;
}
  html[data-theme='dark'] .Card {
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
  }
  .Card:last-child {
    margin-bottom: 0;
  }
  html[data-theme="dark"] .Card {
  background: #1A1A1A;
}

.Card-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 50px;
  padding: 0 20px;
  border-bottom: 1px solid #F6F6F6;
  box-sizing: border-box;
}

.Card-header:last-child {
    border-bottom: none;
  }

html[data-theme="dark"] .Card-header {
  border-bottom: 1px solid #2E2E2E;
}

.Card-headerText {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
}

html[data-ios] .Card-headerText {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .Card-headerText {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

.Card-section {
  padding: 16px 20px;
  position: relative;
}

.Card-section + .Card-section::after {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    margin: 0 20px;
    display: block;
    border-bottom: 1px solid #F6F6F6;
    content: '';
  }

html[data-theme="dark"] .Card-section + .Card-section::after {
    border-bottom: 1px solid #2E2E2E;
}
.Input-wrapper {
  position: relative;
  display: flex;
  width: 180px;
  height: 34px;
  padding: 4px 10px;
  font-size: 14px;
  background: #FFFFFF;
  border: 1px solid #EBEBEB;
  border-radius: 3px;
  box-sizing: border-box;
  transition: background 200ms, border 200ms;
}

  .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,
  .Input-wrapper .DraftEditor-root {
    height: auto;
    padding: 6px 12px;
  }

  .Input-wrapper .Editable-toolbar {
    /* 工具栏的按钮有 所以上下 padding 少 1 */
    /* 左右 13 是 16 - 1 按钮 border - 2 按钮 margin */
    height: auto;
    padding: 5px 13px;
  }

  .Input-wrapper .Dropzone-overlay {
    margin: 6px 12px;
  }

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

  .Input-wrapper.is-focus {
    background: #FFFFFF;
    border: 1px solid #8590A6;
  }

  html[data-theme="dark"] .Input-wrapper.is-focus {
    background: #1A1A1A;
}

  html[data-theme="dark"] .Input-wrapper.is-focus {
    border: 1px solid #606A80;
}

  html[data-theme="dark"] .Input-wrapper {
  background: #1A1A1A;
}

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

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

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

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

textarea.Input {
    color: #1A1A1A;
  }

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

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

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

.Input::-webkit-input-placeholder,
  .Input .public-DraftEditorPlaceholder-root {
    color: #8590A6;
  }

.Input:-ms-input-placeholder,
  .Input .public-DraftEditorPlaceholder-root {
    color: #8590A6;
  }

.Input::-ms-input-placeholder,
  .Input .public-DraftEditorPlaceholder-root {
    color: #8590A6;
  }

.Input::placeholder,
  .Input .public-DraftEditorPlaceholder-root {
    color: #8590A6;
  }

html[data-theme="dark"] .Input::-webkit-input-placeholder, html[data-theme="dark"] .Input .public-DraftEditorPlaceholder-root {
    color: #606A80;
}

html[data-theme="dark"] .Input:-ms-input-placeholder, html[data-theme="dark"] .Input .public-DraftEditorPlaceholder-root {
    color: #606A80;
}

html[data-theme="dark"] .Input::-ms-input-placeholder, html[data-theme="dark"] .Input .public-DraftEditorPlaceholder-root {
    color: #606A80;
}

html[data-theme="dark"] .Input::placeholder, html[data-theme="dark"] .Input .public-DraftEditorPlaceholder-root {
    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 {
    /* textarea 不能应用 overflow: hidden，会导致多行文本内容超过时失去任何提示 */
    overflow: auto;
  }

.Input-after {
  position: absolute;
  top: 50%;
  right: 10px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  margin: auto;
  -webkit-transform: translate3d(0, -50%, 0);
          transform: translate3d(0, -50%, 0);
}
.SignFlowInput {
  position: relative;
}

  .SignFlowInput .Input-wrapper {
    width: 100%;
    height: 48px;
    padding: 0;
    color: #8590A6;
  }

  html[data-theme="dark"] .SignFlowInput .Input-wrapper {
    color: #606A80;
}

  .SignFlowInput input.Input {
    height: 48px;
  }

.SignFlowInput-errorMask {
  position: absolute;
  right: 0;
  height: 90%;
  padding: 12px 0 0 20px;
  margin-top: -47px;
  font-size: 14px;
  color: #F1403C;
  text-align: right;
  cursor: text;
  background: #FFFFFF;
  opacity: 1;
  box-sizing: border-box;
  transition: opacity 250ms ease;
}

.SignFlowInput-errorMask::before {
    position: absolute;
    top: 0;
    left: -16px;
    width: 16px;
    height: 46px;
    background: linear-gradient(
      to right,
      rgba(255, 255, 255, 0),
      #FFFFFF
    );
    content: '';
  }

html[data-theme="dark"] .SignFlowInput-errorMask::before {
    background: linear-gradient(
      to right,
      rgba(26, 26, 26, 0),
      #1A1A1A
    );
}

html[data-theme="dark"] .SignFlowInput-errorMask {
  color: #B7302D;
}

html[data-theme="dark"] .SignFlowInput-errorMask {
  background: #1A1A1A;
}

.SignFlowInput-errorMask--hidden {
  width: 0;
  height: 0;
  padding: 0;
  margin: 0;
  opacity: 0;
}

.SignFlowInput-errorMask--hidden::before {
    width: 0;
    height: 0;
    overflow: hidden;
    opacity: 0;
  }

.SignFlowInput-requiredErrorMask {
  right: auto !important;
  right: initial !important;
  width: 100%;
  padding-left: 0;
  text-align: left;
}

.SignFlowInput-requiredErrorMask::before {
    width: 0;
    height: 0;
    overflow: hidden;
    opacity: 0;
  }
.Icon {
  vertical-align: text-bottom;
  fill: currentColor;
}

.Icon--grey {
  color: #8590A6;
}

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

.Icon--left {
  margin-right: 6px;
}
.Captcha {
  position: relative;
  opacity: 1;
  transition: opacity 300ms ease;
}

.Captcha-chineseContainer {
  position: relative;
  width: 100%;
  padding: 0 60px;
  margin-top: 12px;
  box-sizing: border-box;
}

.Captcha-englishContainer {
  position: absolute;
  top: 24px;
  right: 0;
  display: inline-block;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}

.Captcha-chineseImg {
  display: block;
  margin: 0 auto;
  box-sizing: border-box;
  width: 100%;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}

.Captcha-englishImg {
  display: block;
  height: 30px;
  cursor: pointer;
}

.Captcha-chineseOperator {
  width: 100%;
  padding-top: 4px;
  margin-top: 0;
}

.Captcha-info {
  font-size: 14px;
  color: #8590A6;
}

html[data-theme="dark"] .Captcha-info {
  color: #606A80;
}

.Captcha-error {
  color: #F1403C;
}

html[data-theme="dark"] .Captcha-error {
  color: #B7302D;
}

.Captcha-chineseRefreshButton {
  float: right;
  width: 20px;
  height: 20px;
}

.Captcha-errorMessage {
  right: 76px;
}

.Captcha-requiredErrorMessage {
  right: 0;
}

.ChineseCaptchaPoint {
  position: absolute;
}

.ChineseCaptchaPoint-backIcon {
  fill-opacity: 0.75;
}

/**
   * 之所以不使用:hover 在于保证当第一次点击，icon 显示时使之处于 hover 状态
   * 下同
   */

.ChineseCaptchaPoint-backIcon--hovered {
    fill-opacity: 0.8;
  }

.ChineseCaptchaPoint-frontIcon {
  position: absolute;
  top: 4px;
  left: 4px;
}

.ChineseCaptchaPoint-frontIcon--hovered {
    top: 6px;
    left: 6px;
  }
.Popover {
  position: relative;
  display: inline-block;
}

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

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

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

html[data-theme="dark"] .Popover-arrow::after {
    background: #1A1A1A;
}

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

.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: translate(0, -50%);
          transform: translate(0, -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: #FFFFFF;
  border: 1px solid #EBEBEB;
  border-radius: 4px;
  box-shadow: 0 5px 20px rgba(26, 26, 26, 0.1);
  z-index: 203;
}

html[data-theme='dark'] .Popover-content {
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
  }

.Popover-content-enter {
    opacity: 0.01;
  }

.Popover-content-enter-active {
    opacity: 1;
    -webkit-transform: translateY(0);
            transform: translateY(0);
    transition: opacity 200ms ease-out, -webkit-transform 200ms ease-out;
    transition: transform 200ms ease-out, opacity 200ms ease-out;
    transition: transform 200ms ease-out, opacity 200ms ease-out, -webkit-transform 200ms ease-out;
  }

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

.Popover-content-leave-active {
    opacity: 0.01;
    transition: opacity 200ms ease-out, -webkit-transform 200ms ease-out;
    transition: transform 200ms ease-out, opacity 200ms ease-out;
    transition: transform 200ms ease-out, opacity 200ms ease-out, -webkit-transform 200ms ease-out;
  }

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

html[data-theme="dark"] .Popover-content {
  background: #1A1A1A;
}

html[data-theme="dark"] .Popover-content {
  border: 1px solid #2E2E2E;
}

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

.Popover-content--top.Popover-content--arrowed {
    margin-top: calc(-8px - 8px);
  }

.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: calc(8px + 8px);
  }

.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: calc((8px + 8px) / -1);
  }

.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: calc(8px + 8px);
  }

.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: #0084FF;
  color: white;
  padding: 9px 14px;
  border-radius: 8px;
  border: none;
}

.AttentionPopover .Popover-arrow {
    border: none;
  }

.AttentionPopover .Popover-arrow::after {
      border-color: #0084FF;
      background: #0084FF;
    }

html[data-theme="dark"] .AttentionPopover .Popover-arrow::after {
      border-color: #3A76D0;
}

html[data-theme="dark"] .AttentionPopover .Popover-arrow::after {
      background: #3A76D0;
}

.AttentionPopover .Popover-arrow--top::after {
    border-top-color: #0084FF;
  }

html[data-theme="dark"] .AttentionPopover .Popover-arrow--top::after {
    border-top-color: #3A76D0;
}

.AttentionPopover .Popover-arrow--bottom::after {
    border-bottom-color: #0084FF;
  }

html[data-theme="dark"] .AttentionPopover .Popover-arrow--bottom::after {
    border-bottom-color: #3A76D0;
}

.AttentionPopover .Popover-arrow--left::after {
    border-left-color: #0084FF;
  }

html[data-theme="dark"] .AttentionPopover .Popover-arrow--left::after {
    border-left-color: #3A76D0;
}

.AttentionPopover .Popover-arrow--right::after {
    border-right-color: #0084FF;
  }

html[data-theme="dark"] .AttentionPopover .Popover-arrow--right::after {
    border-right-color: #3A76D0;
}

html[data-theme="dark"] .AttentionPopover {
  background-color: #3A76D0;
}
.Select-button {
  height: 40px;
  padding: 0 20px;
  line-height: 38px;
  text-align: left;
  box-sizing: border-box;
  background: none;
  outline: none;
}

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

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

.Select-list {
  position: relative;
  overflow: auto;
  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;
  outline: none;
  border: none;
  outline: none;
}

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

.Select-option:focus {
  background: #F6F6F6;
}

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

.Select-popoverTarget {
  margin-top: 0;
  transition: opacity 200ms ease-out;
}
.MobileContriesSelect {
  height: 40px;
  display: flex;
  align-items: center;
}

.MobileContriesSelect-content {
  width: 50px;
  display: inline-block;
  position: relative;
}

.MobileContriesSelect-content div,
  .MobileContriesSelect-content select {
    position: absolute;
    right: 0;
    left: 0;
    top: 50%;
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
    width: 100%;
  }

.MobileContriesSelect-content select {
    opacity: 0;
  }
.SignFlow-accountInputContainer {
  overflow: hidden;
}

.SignFlow-account {
  margin-top: 16px;
  border-bottom: 1px solid #EBEBEB;
  border-radius: 0;
}

html[data-theme="dark"] .SignFlow-account {
  border-bottom: 1px solid #444444;
}

.SignFlow-supportedCountriesSelectContainer {
  display: inline-block;
  float: left;
  min-width: 72px;
  -webkit-transform: translateY(4px);
          transform: translateY(4px);
}

.SignFlow-supportedCountriesSelectContainer .Select-button {
    color: #8590A6;
  }

html[data-theme="dark"] .SignFlow-supportedCountriesSelectContainer .Select-button {
    color: #606A80;
}

.SignFlow-supportedCountriesList .Select-option {
  color: #8590A6;
}

html[data-theme="dark"] .SignFlow-supportedCountriesList .Select-option {
  color: #606A80;
}

.SignFlow-accountSeperator {
  float: left;
  width: 1px;
  height: 22px;
  margin: 24px 12px 0;
  background: #EBEBEB;
  -webkit-transform: translateY(-11px);
          transform: translateY(-11px);
}

html[data-theme="dark"] .SignFlow-accountSeperator {
  background: #444444;
}
.CountingDownButton {
  color: #175199;
}
  html[data-theme="dark"] .CountingDownButton {
  color: #175199;
}

.CountingDownButton.is-counting {
  color: #8590A6;
  cursor: auto;
  cursor: initial;
}

html[data-theme="dark"] .CountingDownButton.is-counting {
  color: #606A80;
}
.SignFlow-smsInputContainer {
  position: relative;
  margin-top: 12px;
}

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

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

.SignFlow-smsInputErrorMessage {
  display: flex;
  align-items: center;
  top: 24px;
  right: 130px;
  width: 40%;
  padding: 0;
  padding-left: 4px;
  margin: 0;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}

.SignFlow-smsInputRequiredErrorMask {
  right: 0;
  padding-left: 0;
}
.SignFlow-passwordErrorMask {
  z-index: 10;
}

.SignFlow-passwordInput {
  font-size: 24px;
}

.SignFlow-passwordInput input {
    letter-spacing: 1.8px;
  }

.SignFlow-requiredPasswordErrorMask {
  right: auto;
  right: initial;
  width: 80%;
}

.SignFlow-password {
  position: relative;
  margin-top: 12px;
}

/* 搜狗浏览器密码输入框末尾有虚拟键盘，加此样式消除 */

.SignFlow-password input::-webkit-input-safebox-button {
    display: none;
  }

.SignFlow-switchPassword {
  position: absolute;
  top: 24px;
  right: 0;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}

.SignFlow-switchPasswordIcon:hover {
  fill: #999999;
}

html[data-theme="dark"] .SignFlow-switchPasswordIcon:hover {
  fill: #646464;
}
.SignFlow-username {
  position: relative;
  margin-top: 12px;
}
.Register-content {
  padding: 0 40px 36px;
  font-size: 14px;
}

  .Register-content .SignFlow-smsInputErrorMessage {
    width: auto;
    min-width: 40%;
  }

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

.Register-footer {
  font-size: 13px;
  display: flex;
  justify-content: space-between;
  margin-top: 16px;
  line-height: 25px;
}

.Register-org {
  color: #175199;
}

html[data-theme="dark"] .Register-org {
  color: #175199;
}

.Register-declaration {
  color: #8590A6;
}

.Register-declaration a {
    color: #8590A6;
  }

html[data-theme="dark"] .Register-declaration a {
    color: #606A80;
}

.Register-declaration a:hover {
    color: #808080;
  }

html[data-theme="dark"] .Register-declaration a:hover {
    color: #808080;
}

html[data-theme="dark"] .Register-declaration {
  color: #606A80;
}

.Register-padName {
  padding: 40px 30px;
}

.Register-padNameHeader {
  display: flex;
  align-items: center;
  position: relative;
  padding-bottom: 18px;
  font-size: 24px;
  line-height: 32px;
  color: #444444;
  font-weight: 500;
}

.Register-padNameHeader .Button {
    position: absolute;
    border: none;
    display: flex;
  }

.Register-padNameHeader .Button:hover {
    background-color: #FFFFFF;
  }

html[data-theme="dark"] .Register-padNameHeader .Button:hover {
    background-color: #1A1A1A;
}

html[data-theme="dark"] .Register-padNameHeader {
  color: #808080;
}

.Register-padNameTitle {
  margin: 0 auto;
}

.Register-smsBackUp {
  padding-top: 12px;
  height: 20px;
  color: #8590A6;
  text-align: right;
  transition: height 0.5s, padding 0.5s;
}

.Register-smsBackUp span {
    display: inline-block;
    cursor: pointer;
  }

html[data-theme="dark"] .Register-smsBackUp {
  color: #606A80;
}

.Register-hiddenSmsBackUp {
  height: 0;
  padding: 0;
  margin: 0;
  overflow: hidden;
}

.Register-socialHeader {
  text-align: center;
  padding: 36px 0 8px;
}

.Register-socialTitle {
  position: relative;
  font-size: 24px;
  line-height: 32px;
  color: #444444;
  margin-bottom: 2px;
}

.Register-socialTitle .Button {
    position: absolute;
    border: none;
    display: flex;
    left: 0;
    padding: 0;
  }

.Register-socialTitle .Button:hover {
    background: #FFFFFF;
  }

html[data-theme="dark"] .Register-socialTitle .Button:hover {
    background: #1A1A1A;
}

html[data-theme="dark"] .Register-socialTitle {
  color: #808080;
}

.Register-socialSubTitle {
  font-size: 14px;
  color: #8590A6;
}

html[data-theme="dark"] .Register-socialSubTitle {
  color: #606A80;
}

.Register-socialName {
  overflow: hidden;
  height: 48px;
  transition: height 0.5s, visibility 0.5s;
}

.Register-hiddenSocialName {
  height: 0;
  visibility: hidden;
}
.ZhihuLogo {
  fill: #0084FF;
}

  .ZhihuLogo--grey {
    fill: #999999;
  }

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

  .ZhihuLogo--red {
    fill: #F1403C;
  }

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

  .ZhihuLogo--green {
    fill: #67C23A;
  }

  html[data-theme="dark"] .ZhihuLogo--green {
    fill: #67C23A;
}

  html[data-theme="dark"] .ZhihuLogo {
  fill: #3A76D0;
}
.SignFlowHeader {
  padding-top: 30px;
}

.SignFlowHeader-slogen {
  margin-top: 15px;
  color: #0084FF;
  font-size: 22px;
}

html[data-theme="dark"] .SignFlowHeader-slogen {
  color: #3A76D0;
}
.SignContainer-content {
  width: 432px;
  margin: 0 auto;
  text-align: center;
}

  .SignContainer-content .Input-wrapper {
    width: 100%;
    height: 48px;
    padding: 0;
    color: #8590A6;
    border: none;
    border-bottom: 1px solid #EBEBEB;
    border-radius: 0;
  }

  html[data-theme="dark"] .SignContainer-content .Input-wrapper {
    color: #606A80;
}

  html[data-theme="dark"] .SignContainer-content .Input-wrapper {
    border-bottom: 1px solid #444444;
}

  .SignContainer-content .Input-wrapper.is-focus {
    border: none;
    border-bottom: 1px solid #EBEBEB;
  }

  html[data-theme="dark"] .SignContainer-content .Input-wrapper.is-focus {
    border-bottom: 1px solid #444444;
}

  .SignContainer-content .SignFlow-accountInput.Input-wrapper,
  .SignContainer-content .SignFlow-accountInput.Input-wrapper.is-focus {
    border: none;
  }

  .SignContainer-content input:-webkit-autofill {
    /* https://stackoverflow.com/questions/2781549/removing-input-background-colour-for-chrome-autocomplete?page=1&tab=votes#tab-top
     * clear chrome autofill background-color(yellow) */

    -webkit-box-shadow: 0 0 0 30px white inset;
  }

  .SignContainer-content .SignFlow-username,
  .SignContainer-content .SignFlow-captchaContainer:not(.Captcha-chinese),
  .SignContainer-content .SignFlow-password {
    border-bottom: 1px solid #EBEBEB;
  }

  .SignContainer-content .SignFlow-username .Input-wrapper, .SignContainer-content .SignFlow-captchaContainer:not(.Captcha-chinese) .Input-wrapper, .SignContainer-content .SignFlow-password .Input-wrapper {
      border-bottom: none !important;
    }

  html[data-theme="dark"] .SignContainer-content .SignFlow-username, html[data-theme="dark"] .SignContainer-content .SignFlow-captchaContainer:not(.Captcha-chinese), html[data-theme="dark"] .SignContainer-content .SignFlow-password {
    border-bottom: 1px solid #444444;
}

.SignContainer-inner {
  position: relative;
}

.SignContainer-switch {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  background-color: #F6F6F6;
  height: 58px;
  border-top: 1px solid #EBEBEB;
  font-size: 16px;
}

.SignContainer-switch span {
    color: #175199;
    cursor: pointer;
  }

html[data-theme="dark"] .SignContainer-switch span {
    color: #175199;
}

html[data-theme="dark"] .SignContainer-switch {
  background-color: #2E2E2E;
}

html[data-theme="dark"] .SignContainer-switch {
  border-top: 1px solid #444444;
}

.Captcha-chineseRefreshButton {
  margin-right: 10px;
}

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

.SignFlow-captchaContainer.Captcha-chinese {
  height: 87px;
  background-color: #f9f9f9; /* 与二维码背景颜色保持一致 */
  overflow: hidden;
}

.Captcha-chineseOperator {
  display: flex;
  justify-content: space-between;
}

.Captcha-chineseImg {
  width: 200px;
  height: 44px;
}

.signFlowModal {
  width: auto;
}

.signFlowModal .Modal-content {
    padding: 0;
    margin: 0;
  }
.EmailRegister {
  width: 432px;
  padding: 30px;
  background-color: #FFFFFF;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}
  html[data-theme="dark"] .EmailRegister {
  background-color: #1A1A1A;
}

.EmailRegister-submitButton {
  width: 100%;
  margin-top: 30px;
}
.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%,
  100% {
    -webkit-transform: translateY(-100%);
            transform: translateY(-100%);
  }

  50% {
    -webkit-transform: translateY(100%);
            transform: translateY(100%);
  }
}

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

  50% {
    -webkit-transform: translateY(100%);
            transform: translateY(100%);
  }
}
.Login-options {
  margin-top: 12px;
  height: 20px;
  display: flex;
  justify-content: space-between;
  background: #FFFFFF;
}
  html[data-theme="dark"] .Login-options {
  background: #1A1A1A;
}

.Login-content {
  padding: 0 40px 36px;
}

.Login-content .Login-footer {
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 25px;
  }

.Login-switchType {
  color: #175199;
}

html[data-theme="dark"] .Login-switchType {
  color: #175199;
}

.Login-cannotLogin {
  float: right;
}

.Login-cannotLogin:hover {
    color: #808080;
  }

html[data-theme="dark"] .Login-cannotLogin:hover {
    color: #808080;
}

.Login-footer {
  margin-top: 16px;
  text-align: center;
}

.Login-aboardPhone,
.Login-qrcode {
  display: inline-block;
  color: #8590A6;
  vertical-align: middle;
}

.Login-aboardPhone button:hover, .Login-qrcode button:hover {
    color: #808080;
  }

html[data-theme="dark"] .Login-aboardPhone button:hover, html[data-theme="dark"] .Login-qrcode button:hover {
    color: #808080;
}

html[data-theme="dark"] .Login-aboardPhone, html[data-theme="dark"] .Login-qrcode {
  color: #606A80;
}

.Login-footerSeparate {
  display: inline-block;
  width: 6%;
  color: #8590A6;
  text-align: center;
  box-sizing: border-box;
}

html[data-theme="dark"] .Login-footerSeparate {
  color: #606A80;
}

.Login-socialLogin {
  max-width: 106px;
  display: inline-block;
  vertical-align: middle;
}

.Login-socialButtonGroup {
  margin-left: 2px;
  transition: opacity 300ms ease;
}

.Login-socialButtonGroup--hidden {
    display: inline-block;
    width: 0;
    height: 0;
    overflow: hidden;
    opacity: 0;
  }

.Login-socialButtonGroup--hidden button {
      width: 0;
      height: 0;
      overflow: hidden;
    }

.Login-socialButtonEntrance {
  width: 103px;
  text-align: left;
}

.Login-socialButtonEntrance--hidden {
    width: 0;
    height: 0;
    overflow: hidden;
    opacity: 0;
    display: none;
  }

.Login-socialButtonEntrance:hover {
    color: #808080;
  }

html[data-theme="dark"] .Login-socialButtonEntrance:hover {
    color: #808080;
}

.Login-socialButton {
  height: 24px;
}

.Login-socialButton svg {
    vertical-align: middle;
  }

.Login-socialButton:not(:first-child) {
  margin-left: 22px;
}

.Login-accountBlockEmphasis {
  color: #F1403C;
}

html[data-theme="dark"] .Login-accountBlockEmphasis {
  color: #B7302D;
}

.Login-socialIcon:hover {
  fill: #999999;
}

html[data-theme="dark"] .Login-socialIcon:hover {
  fill: #646464;
}

.SignInQrcode {
  margin: 35px 0 -32px;
}

.Qrcode-container {
  text-align: center;
}

.Qrcode-container p {
    font-size: 14px;
    line-height: 22px;
  }

.Qrcode-container p a {
      color: #175199;
    }

html[data-theme="dark"] .Qrcode-container p a {
      color: #175199;
}

.Qrcode-container p.Qrcode-scanResultTips {
      margin: 12px 0;
      font-size: 16px;
      color: #1A1A1A;
      /* 与设计一致，不支持设备将回退为 700 */
      font-weight: 600;
      /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
      font-synthesis: style;
    }

html[data-ios] .Qrcode-container p.Qrcode-scanResultTips {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .Qrcode-container p.Qrcode-scanResultTips {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

html[data-theme="dark"] .Qrcode-container p.Qrcode-scanResultTips {
      color: #999999;
}

.Qrcode-content {
  height: 210px;
  margin-bottom: 30px;
}

.Qrcode-failure div {
    padding: 40px 0 8px;
  }

.Qrcode-failure p {
    width: 270px;
    margin: 0 auto;
  }

.Qrcode-img {
  margin: 0 auto 15px;
  line-height: 0;
  height: 150px;
  width: 150px;
  justify-content: center;
  align-items: center;
  display: flex;
}

.Qrcode-cutButton {
  border-top: 1px solid #EBEBEB;
  padding: 14px 0;
  font-size: 14px;
  color: #175199;
}

.Qrcode-cutButton span {
    cursor: pointer;
  }

html[data-theme="dark"] .Qrcode-cutButton {
  border-top: 1px solid #444444;
}

html[data-theme="dark"] .Qrcode-cutButton {
  color: #175199;
}

.Qrcode-scanResultStaus {
  padding-top: 36px;
}
.Notification {
  position: fixed;
  top: 75px;
  left: 50%;
  z-index: 499;
  padding: 14px 24px;
  display: flex;
  justify-content: space-between;
  -webkit-transform: translate(-50%, 0);
          transform: translate(-50%, 0);
  font-size: 14px;
  color: #1A1A1A;
  pointer-events: all;
  border-radius: 4px;
  box-shadow: 0 5px 20px rgba(26, 26, 26, 0.1);
  box-sizing: border-box;
}
  html[data-theme='dark'] .Notification {
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
  }
  @media (max-width: 768px) {.Notification {
    width: calc(100vw - 2 * 16px)
}
  }
  @media (min-width: 769px) {.Notification {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    max-width: 600px;
    min-width: 520px
}
  }
  html[data-theme="dark"] .Notification {
  color: #999999;
}

.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: #FFFFFF;
}

html[data-theme="dark"] .Notification-white {
  color: #999999;
}

html[data-theme="dark"] .Notification-white {
  background: #1A1A1A;
}

.Notification-red {
  color: #FFFFFF;
  background: #F1403C;
}

html[data-theme="dark"] .Notification-red {
  color: #1A1A1A;
}

html[data-theme="dark"] .Notification-red {
  background: #B7302D;
}

.Notification-red-ghost {
  color: #F1403C;
  background: #FFFFFF;
}

html[data-theme="dark"] .Notification-red-ghost {
  color: #B7302D;
}

html[data-theme="dark"] .Notification-red-ghost {
  background: #1A1A1A;
}

@-webkit-keyframes spring-in {
  from {
    -webkit-transform: translate(-50%, -20px);
            transform: translate(-50%, -20px);
    opacity: 0.01;
  }

  to {
    -webkit-transform: translate(-50%, 0);
            transform: translate(-50%, 0);
    opacity: 1;
  }
}

@keyframes spring-in {
  from {
    -webkit-transform: translate(-50%, -20px);
            transform: translate(-50%, -20px);
    opacity: 0.01;
  }

  to {
    -webkit-transform: translate(-50%, 0);
            transform: translate(-50%, 0);
    opacity: 1;
  }
}

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

  to {
    -webkit-transform: translate(-50%, -20px);
            transform: translate(-50%, -20px);
    opacity: 0;
  }
}

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

  to {
    -webkit-transform: translate(-50%, -20px);
            transform: translate(-50%, -20px);
    opacity: 0;
  }
}

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

.Notification-leave {
  -webkit-animation: spring-out 0.3s;
          animation: spring-out 0.3s;
  -webkit-animation-fill-mode: both;
          animation-fill-mode: both;
}
.MobileModal-wrapper {
  position: relative;
}

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

.MobileModal {
  background: #FFFFFF;
}

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

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

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

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

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

.MobileModal-title {
  font-weight: 700;
}

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

html[data-theme="dark"] .MobileModal-title--default {
  border-bottom: 1px solid #444444;
}

html[data-theme="dark"] .MobileModal-title--default {
  box-shadow: 0 1px 3px rgba(153, 153, 153, 0.05);
}

html[data-theme="dark"] .MobileModal-title--default {
  background: #1A1A1A;
}

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

html[data-theme="dark"] .MobileModal-backdrop {
  background: rgba(153, 153, 153, 0.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%;
  box-shadow: 0 5px 20px 0 rgba(23, 81, 153, 0.5);
  border-radius: 2px;
  overflow: hidden;
}

.MobileModal--plain .MobileModal-closeIcon {
    fill: #8590A6;
  }

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

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

.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;
}
.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;
}
.SignFlowActive-account {
  width: 100%;
  height: 48px;
  line-height: 48px;
}

.SignFlowActive-editEmail {
  float: right;
  color: #175199;
}

html[data-theme="dark"] .SignFlowActive-editEmail {
  color: #175199;
}

.SignFlowActive-sendEmail,
.SignFlowActive-sendDigits {
  display: block;
  width: 220px;
  margin: 0 auto;
}

.SignFlowActive-sendEmail {
  margin-top: 48px;
}

.SignFlowActive-sendDigits {
  margin-top: 55px;
}

.SignFlowActive-button {
  display: inline-block;
  border: none;
}

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

.VerificationDialogModal-cutSmsType:hover {
    color: #808080;
  }

html[data-theme="dark"] .VerificationDialogModal-cutSmsType:hover {
    color: #808080;
}
.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: #999999;
}

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

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

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

.VerificationDialogModal-select {
  height: 48px;
  background: #FFFFFF;
  border: none;
  border-bottom: 1px solid #EBEBEB;
  width: 100%;
  color: #444444;
}

.VerificationDialogModal-select .Select-plainButton {
    width: 100%;
  }

.VerificationDialogModal-select .Select-arrow {
    position: absolute;
    right: 0;
    top: 27%;
  }

html[data-theme="dark"] .VerificationDialogModal-select {
  background: #1A1A1A;
}

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

html[data-theme="dark"] .VerificationDialogModal-select {
  color: #808080;
}

.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 #444444 !important;
}

.VerificationDialogModal-checkout {
  text-align: center;
}

.VerificationDialogModal-button {
  color: #FFFFFF;
  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;
}

html[data-theme="dark"] .VerificationDialogModal-button {
  background: #3A76D0;
}

html[data-theme="dark"] .VerificationDialogModal-button {
  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;
  box-shadow: 0 -1px 0 0 #EBEBEB;
  margin: 30px -24px -32px -24px;
  padding: 16px;
  font-size: 13px;
  line-height: 21px;
  color: #8590A6;
}

html[data-theme="dark"] .VerificationDialogModal-tips {
  background: #2E2E2E;
}

html[data-theme="dark"] .VerificationDialogModal-tips {
  box-shadow: 0 -1px 0 0 #444444;
}

html[data-theme="dark"] .VerificationDialogModal-tips {
  color: #606A80;
}

.VerificationDialogModal-blue {
  color: #0084FF;
}

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

.Popover-targetContainer-verification {
  width: 376px;
}

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

.VerificationDialogModal-cutSmsType:hover {
    color: #808080;
  }

html[data-theme="dark"] .VerificationDialogModal-cutSmsType:hover {
    color: #808080;
}

.VerificationDialogModal-HelpWrapper {
  width: 100%;
  display: flex;
  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;
}
.SignFlow-smsBindPhoneInputContainer {
  position: relative;
  margin-top: 12px;
}

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

html[data-theme="dark"] .SignFlow-smsBindPhoneInputButton {
  color: #175199;
}

.SignFlow-smsBindPhoneInputErrorMessage {
  top: 24px;
  right: 108px;
  width: 40%;
  height: 47px;
  padding: 0;
  padding-left: 4px;
  margin: 0;
  line-height: 47px;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}

.SignFlow-smsBindPhoneInputErrorMask {
  right: 20px;
}

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

html[data-theme="dark"] .SignFlow-smsBindPhoneInputButton {
  color: #175199;
}

.SignFlow-smsBindPhoneInput {
  width: calc(100% - 100px);
}
.BindPhone-buttonSection {
    display: flex;
    margin-top: 40px;
  }
  .BindPhone-button {
    flex: 1;
  }
  .BindPhone-button:first-child {
      margin-right: 10px;
    }
  .BindPhone-subtitle {
    color: #8590A6;
    margin-top: 2px;
    margin-bottom: 24px;
    padding: 0 24px;
    text-align: center;
  }
  html[data-theme="dark"] .BindPhone-subtitle {
    color: #606A80;
}
  .BindPhone-helpWrapper {
    width: 100%;
    display: flex;
    justify-content: flex-end;
    margin-top: 12px;
  }
  .BindPhone-helpText {
    color: #8590A6;
  }
  html[data-theme="dark"] .BindPhone-helpText {
    color: #606A80;
}
  .BindPhone-remindLoginWithPhoneButton {
    display: block;
    width: 220px;
    margin: 48px auto 0;
  }

.MobileModal .SignFlowActive.SignFlow {
    padding: 0 16px;
    margin-top: 16px;
  }

.MobileModal .MobileBindPhoneTip {
    color: #8590A6;
    font-size: 14px;
  }

html[data-theme="dark"] .MobileModal .MobileBindPhoneTip {
    color: #606A80;
}

.MobileModal .BindPhone-buttonSection {
    margin-top: 16px;
  }

.MobileModal.VerificationModal {
    padding: 0 16px;
  }

.MobileModal .SignFlow-smsInputButton {
    top: 23px;
  }

.MobileModal .BindPhone-remindLoginWithPhoneButton {
    margin-top: 16px;
  }

.MobileModal.BindPhoneMobileModal .MobileModal-content, .MobileModal.LoginWithPhoneMobileModal .MobileModal-content, .MobileModal.ConfirmUnbindMobileModal .MobileModal-content, .MobileModal.NeedUnbindMobileModal .MobileModal-content {
      padding-top: 0;
    }

.BindPhoneForm .Input-wrapper {
    width: 100%;
    height: 48px;
    padding: 0;
    color: #8590A6;
    border: none;
    border-bottom: 1px solid #EBEBEB;
    border-radius: 0;
  }

html[data-theme="dark"] .BindPhoneForm .Input-wrapper {
    color: #606A80;
}

html[data-theme="dark"] .BindPhoneForm .Input-wrapper {
    border-bottom: 1px solid #444444;
}

.BindPhoneForm .Input-wrapper.is-focus {
    border: none;
    border-bottom: 1px solid #EBEBEB;
  }

html[data-theme="dark"] .BindPhoneForm .Input-wrapper.is-focus {
    border-bottom: 1px solid #444444;
}

.BindPhoneForm .SignFlow-accountInput.Input-wrapper,
  .BindPhoneForm .SignFlow-accountInput.Input-wrapper.is-focus {
    border: none;
  }

.BindPhoneForm .SignFlow-smsBindPhoneInput {
    width: 100%;
    border-bottom: 1px solid #EBEBEB;
  }

.BindPhoneForm .SignFlow-smsBindPhoneInput .Input-wrapper,
    .BindPhoneForm .SignFlow-smsBindPhoneInput .Input-wrapper.is-focus {
      border: none;
    }

html[data-theme="dark"] .BindPhoneForm .SignFlow-smsBindPhoneInput {
    border-bottom: 1px solid #444444;
}
.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 white 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;
  transition: height 300ms ease;
}

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

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

.SignFlow-snackBarLink {
  color: #175199;
}

html[data-theme="dark"] .SignFlow-snackBarLink {
  color: #175199;
}
.UnknownError {
  display: flex;
  height: 100%;
  justify-content: center;
  align-items: center;
  font-size: 18px;
  padding: 48px;
}
.CornerButtons {
  position: fixed;
  bottom: 0;
  right: 12px;
  display: flex;
  flex-direction: column;
  transition: -webkit-transform 0.2s ease;
  transition: transform 0.2s ease;
  transition: transform 0.2s ease, -webkit-transform 0.2s ease;
  will-change: transfrom;
}
.CornerAnimayedFlex {
  width: 40px;
  height: calc(40px + 12px);
  transition: height 0.2s ease;
}

  .CornerAnimayedFlex--hidden {
    height: 0;
  }
.CornerButton {
  background: #FFFFFF;
  border-radius: 4px;
  width: 40px;
  height: 40px;
  box-shadow: 0 1px 3px rgba(26, 26, 26, 0.1);
}
  html[data-theme='dark'] .CornerButton {
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
  }
  .CornerButton:hover {
    background: #D3D3D3;
  }
  html[data-theme="dark"] .CornerButton:hover {
    background: #2E2E2E;
}
  .CornerButton .Zi {
    fill: #8590A6;
  }
  .CornerButton .Zi:hover {
      fill: #8590A6;
    }
  html[data-theme="dark"] .CornerButton .Zi:hover {
      fill: #606A80;
}
  html[data-theme="dark"] .CornerButton .Zi {
    fill: #606A80;
}
  html[data-theme="dark"] .CornerButton {
  background: #1A1A1A;
}
.GlobalError {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
}

.GlobalError-main {
  min-width: 540px;
  min-height: 300px;
  color: #999999;
  font-size: 18px;
  background: url(https://static.zhihu.com/heifetz/error_kanshan.eb5a42cdcd9d06f4695b.png);
  background-size: 202px 111px;
  background-repeat: no-repeat;
  background-position: right bottom;
}

html[data-theme="dark"] .GlobalError-main {
  color: #646464;
}

.GlobalError-detail {
  margin-top: 80px;
}

.GlobalError-detailTitle {
  margin-bottom: 30px;
  font-size: 40px;
}
.RetryError {
  background: #fff;
  min-height: 160px;
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}

.RetryError-title {
  color: #8590A6;
  font-size: 22px;
  margin-bottom: 16px;
}

html[data-theme="dark"] .RetryError-title {
  color: #606A80;
}
html:not([data-focus-method='pointer']) .Button:focus {
  box-shadow: 0 0 0 2px #FFFFFF, 0 0 0 4px rgba(0, 132, 255, 0.3);
}
  html[data-theme="dark"] html:not([data-focus-method='pointer']) .Button:focus {
  box-shadow: 0 0 0 2px #1A1A1A, 0 0 0 4px rgba(58, 118, 208, 0.3);
}
.Tooltip {
  position: absolute;
  width: 0;
  height: 0;
}

.Tooltip-enter,
.Tooltip-leave {
  transition: opacity 300ms;
}

.Tooltip-enter {
  opacity: 0;
}

.Tooltip-enter-active {
  opacity: 1;
}

.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: #FFFFFF;
  white-space: nowrap;
  background-color: rgba(26, 26, 26, 0.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;
}

html[data-theme="dark"] .TooltipContent {
  background-color: rgba(153, 153, 153, 0.8);
}

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

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

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

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

.TooltipContent::before {
  position: absolute;
  z-index: -1;
  border-color: rgba(26, 26, 26, 0.8) transparent transparent
    rgba(26, 26, 26, 0.8);
  border-style: solid;
  border-width: 4px;
  content: '';
  -webkit-transform: translate(-50%, -50%) rotate(45deg);
          transform: translate(-50%, -50%) rotate(45deg);
}

html[data-theme="dark"] .TooltipContent::before {
  border-color: rgba(153, 153, 153, 0.8) transparent transparent
    rgba(153, 153, 153, 0.8);
}

.TooltipContent--top::before {
  top: 100%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%) rotate(-135deg);
          transform: translate(-50%, -50%) rotate(-135deg);
}

.TooltipContent--bottom::before {
  top: 0;
  left: 50%;
}

.TooltipContent--left::before {
  top: 50%;
  left: 100%;
  -webkit-transform: translate(-50%, -50%) rotate(135deg);
          transform: translate(-50%, -50%) rotate(135deg);
}

.TooltipContent--right::before {
  top: 50%;
  left: 0;
  -webkit-transform: translate(-50%, -50%) rotate(-45deg);
          transform: translate(-50%, -50%) rotate(-45deg);
}

.TooltipContent a {
  color: inherit;
  text-decoration: underline;
}
.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;
}

  .StaticCacheBanner a {
    color: #175199;
    transition: border-bottom 200ms ease-in;
  }

  .StaticCacheBanner a:hover {
      border-bottom: 1px solid rgba(23, 81, 153, 0.72);
    }

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

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

  html[data-theme="dark"] .StaticCacheBanner {
  color: #606A80;
}

  html[data-theme="dark"] .StaticCacheBanner {
  background-color: #444444;
}
.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%);
}

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

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

@-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);
  }

  100% {
    -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);
  }

  100% {
    -webkit-transform: translateX(100%);
            transform: translateX(100%);
  }
}
.Sticky.is-fixed {
    position: fixed;
    z-index: 2;
    box-sizing: border-box;

    /* https://stackoverflow.com/questions/21278020/font-weight-turns-lighter-on-mac-safari */
    -webkit-font-smoothing: subpixel-antialiased;
  }
  .Sticky.is-absolute {
    position: absolute;
    top: auto;
    bottom: 0;
    z-index: 1;
    margin-bottom: 0;
    box-sizing: border-box;
  }
  .Sticky.is-absolute.is-bottom {
      top: 0;
      bottom: auto;
      margin-top: 0;
    }
  .Sticky.Sticky--CSSSticky {
    position: -webkit-sticky;
    position: sticky;
  }

.Sticky--holder {
  visibility: hidden;
}
.OrgZhihuLogo {
  display: flex;
  flex-direction: row;
  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: #FFFFFF;
  box-shadow: 0 1px 3px rgba(26, 26, 26, 0.1);
  background-clip: content-box;
}
  html[data-theme='dark'] .OrgAppHeader {
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
  }
  .OrgAppHeader.is-fixed {
    z-index: 100;
  }
  .OrgAppHeader-inner {
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: relative;
    margin: 0 auto;
    padding: 0 16px;
    width: 1000px;
    height: 52px;
    transition: -webkit-transform 0.3s;
    transition: transform 0.3s;
    transition: transform 0.3s, -webkit-transform 0.3s;
  }
  .OrgAppHeader.is-hidden .OrgAppHeader-inner {
    -webkit-transform: translateY(-100%);
            transform: translateY(-100%);
  }
  .OrgAppHeader-userInfo {
    color: #444;
  }
  .OrgAppHeader-userInfo .Button {
      margin-left: 16px;
    }
  html[data-theme="dark"] .OrgAppHeader {
  background: #1A1A1A;
}
.InfiLoader--bounceShown {
  display: flex;
  min-height: 100px;
  align-items: center;
  justify-content: center;
}
.PlaceHolder-inner {
  position: relative;
  overflow: hidden;
  background: #F6F6F6;
  color: #FFFFFF;
} /* svg fill */ html[data-theme="dark"] .PlaceHolder-inner {
  background: #2E2E2E;
} html[data-theme="dark"] .PlaceHolder-inner {
  color: #1A1A1A;
}

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

.PlaceHolder-bg {
  position: absolute;
  width: 200%;
  height: 100%;
  background: linear-gradient(
    to right,
    #F6F6F6 0%,
    #EBEBEB 20%,
    #F6F6F6 40%,
    #F6F6F6 100%
  );
  -webkit-animation: linear-double 1s linear 1ms infinite forwards;
          animation: linear-double 1s linear 1ms infinite forwards;
}

html[data-theme="dark"] .PlaceHolder-bg {
  background: linear-gradient(
    to right,
    #2E2E2E 0%,
    #444444 20%,
    #2E2E2E 40%,
    #2E2E2E 100%
  );
}

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

  100% {
    -webkit-transform: translateX(56%);
            transform: translateX(56%);
  }
}

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

  100% {
    -webkit-transform: translateX(56%);
            transform: translateX(56%);
  }
}
.Menu {
  padding: 6px 0;
}

.Menu-item {
  display: block;
  width: 100%;
  padding: 0 20px;
  text-align: left;
  cursor: pointer;
  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 #444444;
}
.OpenInAppButton {
  position: fixed;
  top: auto;
  bottom: 0;
  left: 50%;
  z-index: 100;
  width: 105px;
  font-size: 15px;
  font-weight: 500;
  line-height: 36px;
  color: #FFFFFF;
  text-align: center;
  background: #0084FF;
  border-radius: 18px;
  -webkit-transform: translate(-50%, 200%);
          transform: translate(-50%, 200%);
  box-shadow: 0 2px 5px rgba(26, 26, 26, 0.25);
  transition: -webkit-transform 0.3s 0.3s;
  transition: transform 0.3s 0.3s;
  transition: transform 0.3s 0.3s, -webkit-transform 0.3s 0.3s;
}
  html[data-theme="dark"] .OpenInAppButton {
  color: #1A1A1A;
}
  html[data-theme="dark"] .OpenInAppButton {
  background: #3A76D0;
}
  html[data-theme="dark"] .OpenInAppButton {
  box-shadow: 0 2px 5px rgba(153, 153, 153, 0.25);
}

.OpenInAppButton.is-shown {
  -webkit-transform: translate(-50%, -25px);
          transform: translate(-50%, -25px);
}
.Pagination {
  padding: 16px 20px;
  text-align: center;
  margin: 0 auto;
}

.PaginationButton {
  color: #1A1A1A;
  transition: color 200ms;
  padding: 0 15px;
}

.PaginationButton:not(:disabled):hover {
    color: #175199;
  }

html[data-theme="dark"] .PaginationButton:not(:disabled):hover {
    color: #175199;
}

html[data-theme="dark"] .PaginationButton {
  color: #999999;
}

.PaginationButton--current {
  color: #8590A6;
}

html[data-theme="dark"] .PaginationButton--current {
  color: #606A80;
}
.MaxLength {
  font-size: 14px;
  color: #8590A6;
}

  .MaxLength.is-error {
    color: #F1403C;
  }

  html[data-theme="dark"] .MaxLength.is-error {
    color: #B7302D;
}

  html[data-theme="dark"] .MaxLength {
  color: #606A80;
}
.Holder {
  height: 14px;
  margin-bottom: 16px;
  background: #F6F6F6;
  border-radius: 2px;
}

  .Holder:last-child {
    margin-bottom: 0;
  }

  html[data-theme="dark"] .Holder {
  background: #2E2E2E;
}

.Holder--inline,
.Holder--icon,
.Holder--button,
.Holder--avatar {
  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;
}
.Favlists-items {
  max-height: 335px;
  min-height: 140px;
  margin-bottom: 40px;
  overflow-x: hidden;
  overflow-y: auto;
}

.Favlists-item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 8px 0;
  border-bottom: 1px solid #EBEBEB;
}

html[data-theme="dark"] .Favlists-item {
  border-bottom: 1px solid #444444;
}

.Favlists-itemInner {
  overflow: hidden;
  margin-right: 20px;
}

.Favlists-itemName {
  display: flex;
  overflow: hidden;
  text-overflow: ellipsis;
}

.Favlists-itemNameText {
  overflow: hidden;
  font-weight: 700;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.Favlists-itemIcon {
  margin-left: 6px;
}

.Favlists-itemIcon .Zi {
    fill: #8590A6;
    vertical-align: baseline;
  }

html[data-theme="dark"] .Favlists-itemIcon .Zi {
    fill: #606A80;
}

.Favlists-itemContent {
  font-size: 14px;
  color: #8590A6;
  margin-top: 4px;
}

html[data-theme="dark"] .Favlists-itemContent {
  color: #606A80;
}

.Favlists-updateButton {
  padding-left: 0;
  padding-right: 0;
  width: 76px;
  flex-shrink: 0;
}

.Favlists-actions {
  display: flex;
  justify-content: center;
  padding: 16px 20px;
  box-sizing: border-box;
}

.Favlists-mobileActions {
  position: fixed;
  bottom: 0;
  width: 100%;
  display: flex;
  justify-content: center;
  padding: calc(16px - 4) 20px;
  box-sizing: border-box;
  border-top: 1px solid #EBEBEB;
  background: #FFFFFF;
}

.Favlists-mobileActions .Favlists-addButton:last-child:first-child {
    width: 100%;
  }

.Favlists-mobileActions .Button {
    flex: 1;
  }

.Favlists-mobileActions .Button:first-child:not(:last-child) {
      margin-right: 8px;
    }

html[data-theme="dark"] .Favlists-mobileActions {
  border-top: 1px solid #444444;
}

html[data-theme="dark"] .Favlists-mobileActions {
  background: #1A1A1A;
}

.Favlist-empty {
  position: fixed;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
}

.Favlist-emptyContent {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  height: 100%;
}

.Favlist-emptyTip {
  margin-top: 30px;
  font-size: 15px;
  color: #8590A6;
}

html[data-theme="dark"] .Favlist-emptyTip {
  color: #606A80;
}

.Favlists-addButton {
  width: 220px;
}

.Favlists-addItem {
  margin-bottom: 8px;
}

.Favlists-titleInput,
.Favlists-descritionInput {
  width: 100%;
  height: auto;
  padding: 8px 12px;
}

.Favlists-privacyOption {
  display: block;
  margin-bottom: 6px;
  overflow: auto;
  font-size: 14px;
}

.Favlists-privacyOptionTips {
  margin-left: 4px;
  color: #8590A6;
}

html[data-theme="dark"] .Favlists-privacyOptionTips {
  color: #606A80;
}

.Favlists-privacyOptionRadio {
  display: inline-block;
  width: 14px;
  height: 14px;
  padding: 2px;
  margin: 0 4px 0 0;
  vertical-align: middle;
  border: 2px solid #EBEBEB;
  border-radius: 50%;
  transition: background-color, border-color 300ms;
  background-clip: content-box;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
}

.Favlists-privacyOptionRadio:checked {
    background-color: #0084FF;
    border-color: #0084FF;
  }

html[data-theme="dark"] .Favlists-privacyOptionRadio:checked {
    background-color: #3A76D0;
}

html[data-theme="dark"] .Favlists-privacyOptionRadio:checked {
    border-color: #3A76D0;
}

.Favlists-privacyOptionRadio:focus {
    outline: none;
  }

html[data-theme="dark"] .Favlists-privacyOptionRadio {
  border: 2px solid #444444;
}

.Favlists-inputTips {
  padding-top: 8px;
  text-align: right;
}

.Favlists-favButton {
  width: 72px;
}
.FavlistItem-title {
  display: flex;
  align-items: center;
}

.FavlistItem-lockIcon {
  margin-left: 8px;
}

.FavlistItem-follow {
  width: 90px;
}
.EmptyState {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 1;
  height: 100%;
}

.EmptyState-inner {
  font-size: 15px;
  color: #8590A6;
  text-align: center;
}

html[data-theme="dark"] .EmptyState-inner {
  color: #606A80;
}

.EmptyState-image {
  display: block;
  margin: 0 auto;
}

.EmptyState-action:not(.Button) {
    color: #175199;
  }

.EmptyState-action:not(.Button):hover {
    border-bottom: 1px solid #175199;
  }

html[data-theme="dark"] .EmptyState-action:not(.Button):hover {
    border-bottom: 1px solid #175199;
}

html[data-theme="dark"] .EmptyState-action:not(.Button) {
    color: #175199;
}

.EmptyState-action.Button:hover {
    color: #808080;
  }

.EmptyState-action.Button:hover .Icon {
      fill: #999999;
    }

html[data-theme="dark"] .EmptyState-action.Button:hover .Icon {
      fill: #646464;
}

html[data-theme="dark"] .EmptyState-action.Button:hover {
    color: #808080;
}
.Formula {
  display: inline-block;
  vertical-align: middle;
  background: no-repeat center;
  background-size: contain; /* 防止两端被截断 */
  font-size: 0;
}

  .Formula.isEditable {
    cursor: pointer;
  }

.Formula-image {
  max-width: 100%;
  opacity: 0; /* will see element on Edge even `visibility: hidden` set, don't know why */
  visibility: hidden;
}

.Formula-placeholder {
  opacity: 0;
}
.MathToolbar {
  display: block;
  padding: 4px 12px;
  border-radius: inherit inherit 0 0;
  background: #F6F6F6;
  border-bottom: 1px solid #EBEBEB;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}
  html[data-theme="dark"] .MathToolbar {
  background: #2E2E2E;
}
  html[data-theme="dark"] .MathToolbar {
  border-bottom: 1px solid #444444;
}

.MathToolbar-button {
  height: 28px;
  padding: 2px 4px;
  box-sizing: border-box;
  border: 1px solid transparent;
  vertical-align: middle;
}

.MathToolbar-button + .MathToolbar-button {
    margin-left: 16px;
  }

.MathToolbar-button:hover {
    background: #F6F6F6;
    border-color: #EBEBEB;
  }

html[data-theme="dark"] .MathToolbar-button:hover {
    background: #2E2E2E;
}

html[data-theme="dark"] .MathToolbar-button:hover {
    border-color: #444444;
}

.MathToolbar-palettes {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  margin: -4px;
  padding: 16px;
  max-width: 384px;
}

.MathToolbar-palettesButton {
  display: flex;
  flex-direction: row;
  margin: 4px;
  padding: 0;
  width: 24px;
  height: 24px;
  justify-content: center;
  align-items: center;
  font-size: 16px;
  color: #8590A6;
  border-radius: 4px;
}

.MathToolbar-palettesButton:hover {
    background-color: #F6F6F6;
  }

html[data-theme="dark"] .MathToolbar-palettesButton:hover {
    background-color: #2E2E2E;
}

html[data-theme="dark"] .MathToolbar-palettesButton {
  color: #606A80;
}

.MathToolbar-paletteIcon {
  max-width: calc(100% - 2px);
}

.MathToolbar-palettes--math {
  max-width: 380px;
}

.MathToolbar-palettes--math .MathToolbar-palettesButton {
    padding: 0 3px;
    width: 30px;
    height: 60px;
  }

.MathToolbar-palettes--arrow .MathToolbar-palettesButton {
    height: 35px;
  }
.FormulaModal {
  width: 550px;
}

.FormulaModal-input {
  flex-direction: column;
  margin-bottom: 30px;
}

.FormulaModal-input .Input {
    padding: 6px 12px;
    min-height: 100px;
    box-sizing: border-box;
  }

.FormulaModal-formula {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 3px;
  background: #FFFFFF;
  border: 2px dashed #EBEBEB;
  border-radius: 3px;
  min-height: 106px;
  overflow-x: auto;
}

.FormulaModal-formula img {
    max-width: 100%;
  }

html[data-theme="dark"] .FormulaModal-formula {
  background: #1A1A1A;
}

html[data-theme="dark"] .FormulaModal-formula {
  border: 2px dashed #444444;
}

.FormulaModal-buttonGroup {
  margin-top: 32px;
}

.FormulaModal-previewText {
  color: #8590A6;
  font-size: 14px;
}

html[data-theme="dark"] .FormulaModal-previewText {
  color: #606A80;
}
.FocusPlugin--unfocused:hover {
  cursor: default;
  box-shadow: 0 0 0 2px rgba(0, 132, 255, 0.3);
}
  html[data-theme="dark"] .FocusPlugin--unfocused:hover {
  box-shadow: 0 0 0 2px rgba(58, 118, 208, 0.3);
}

.FocusPlugin--focused {
  cursor: default;
  box-shadow: 0 0 0 2px #0084FF;
}

html[data-theme="dark"] .FocusPlugin--focused {
  box-shadow: 0 0 0 2px #3A76D0;
}
.Image {
  max-width: 100%;
  margin: 0 auto;
}

  .Image[data-size='small'] {
    max-width: 40%;
  }

.Image--isBlock {
  display: block;
}
.Editable-imageUploader {
  text-align: center;
}

.Editable-imageUploader-layout {
  position: relative;
  display: inline-block;
  max-width: 100%;
  vertical-align: top;
}

.Editable-imageUploader-layout.is-fullWidth {
    width: 100%;
  }

.Editable-imageUploader-image {
  display: block;
  max-width: 100%;
  opacity: 0.3;
}

.Editable-imageUploader-placeholder {
  height: 192px;
  background-color: #EBEBEB;
}

html[data-theme="dark"] .Editable-imageUploader-placeholder {
  background-color: #444444;
}

.Editable-imageUploader-status {
  position: absolute;
  left: 0;
  top: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
}

.Editable-imageUploader-statusText {
  font-size: 28px;
  line-height: 40px;
  color: #8590A6;
}

html[data-theme="dark"] .Editable-imageUploader-statusText {
  color: #606A80;
}

.Editable-imageUploader-status.is-error .Editable-imageUploader-statusText {
  color: #FF3366;
}

html[data-theme="dark"] .Editable-imageUploader-status.is-error .Editable-imageUploader-statusText {
  color: #D92155;
}

.Editable-imageUploader-retry {
  margin-top: 4px;
  font-size: 16px;
  line-height: 32px;
}

.Editable-imageUploader-retry .Button {
    font-size: inherit;
  }

.Editable-imageUploader-progress {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 4px;
  background-color: #0084FF;
}

.Editable-imageUploader-progress.is-error {
    background-color: #FF3366;
  }

html[data-theme="dark"] .Editable-imageUploader-progress.is-error {
    background-color: #D92155;
}

.Editable-imageUploader-progress .LoadingBar {
    position: relative;
    height: 100%;
    background-color: rgba(255, 255, 255, 0.3);
  }

html[data-theme="dark"] .Editable-imageUploader-progress .LoadingBar {
    background-color: rgba(26, 26, 26, 0.3);
}

html[data-theme="dark"] .Editable-imageUploader-progress {
  background-color: #3A76D0;
}
.Image-caption.is-placeholder {
    color: #BFBFBF;
  }
    html[data-theme="dark"] .Image-caption.is-placeholder {
    color: #808080;
}
  .Image-caption.is-editing {
    opacity: 0;
  }

/* 应与 ztext figcaption 一致 */
.Image-captionInput {
  position: absolute;
  z-index: 203;
}
.Image-captionInput textarea {
    display: block;
    overflow: hidden;
    width: 100%;
    height: 100%;
    padding: 0;
    border: none;
    font: inherit;
    font-size: 0.9em;
    line-height: 1.5;
    text-align: center;
    color: #8590A6;
    background: none;
    resize: none;
  }
.Image-captionInput textarea::-webkit-input-placeholder {
      color: #BFBFBF;
    }
.Image-captionInput textarea:-ms-input-placeholder {
      color: #BFBFBF;
    }
.Image-captionInput textarea::-ms-input-placeholder {
      color: #BFBFBF;
    }
.Image-captionInput textarea::placeholder {
      color: #BFBFBF;
    }
html[data-theme="dark"] .Image-captionInput textarea::-webkit-input-placeholder {
      color: #808080;
}
html[data-theme="dark"] .Image-captionInput textarea:-ms-input-placeholder {
      color: #808080;
}
html[data-theme="dark"] .Image-captionInput textarea::-ms-input-placeholder {
      color: #808080;
}
html[data-theme="dark"] .Image-captionInput textarea::placeholder {
      color: #808080;
}
.Image-captionInput textarea:focus {
      outline: none;
    }
html[data-theme="dark"] .Image-captionInput textarea {
    color: #606A80;
}
.Image-resizer {
  padding: 8px;
}

.Image-resizerButton {
  padding: 0 8px;
  vertical-align: middle;
}

.Image-resizerButton .Zi {
    display: block;
  }

.Image-resizerButton.is-active {
    color: #0084FF;
  }

html[data-theme="dark"] .Image-resizerButton.is-active {
    color: #3A76D0;
}
.Editable-VideoTitleInput-container {
  align-self: stretch;
  background: #FFFFFF;
  display: flex;
  flex-direction: column;
  width: 100%;
}
  html[data-theme="dark"] .Editable-VideoTitleInput-container {
  background: #1A1A1A;
}

.Editable-VideoTitleInput-innerContainer {
  cursor: text;
  display: flex;
  padding: 0 16px;
}

.Editable-VideoTitleInput-innerContainer--isBeforeIconShown {
    padding: 0 10px;
  }

.Editable-VideoTitleInput-beforeIcon {
  color: #808080;
}

html[data-theme="dark"] .Editable-VideoTitleInput-beforeIcon {
  color: #808080;
}

.Editable-VideoTitleInput-value {
  font-size: 15px;
  line-height: 48px;
}

.Editable-VideoTitleInput-value--noContent {
    color: #808080;
  }

html[data-theme="dark"] .Editable-VideoTitleInput-value--noContent {
    color: #808080;
}

.Editable-VideoTitleInput {
  border: none;
  box-sizing: border-box;
  font-size: 15px;
  height: 48px;
  outline: none;
  padding: 0;
  width: 100%;
}

.Editable-VideoTitleInput::-webkit-input-placeholder {
    color: #808080;
  }

.Editable-VideoTitleInput:-ms-input-placeholder {
    color: #808080;
  }

.Editable-VideoTitleInput::-ms-input-placeholder {
    color: #808080;
  }

.Editable-VideoTitleInput::placeholder {
    color: #808080;
  }

html[data-theme="dark"] .Editable-VideoTitleInput::-webkit-input-placeholder {
    color: #808080;
}

html[data-theme="dark"] .Editable-VideoTitleInput:-ms-input-placeholder {
    color: #808080;
}

html[data-theme="dark"] .Editable-VideoTitleInput::-ms-input-placeholder {
    color: #808080;
}

html[data-theme="dark"] .Editable-VideoTitleInput::placeholder {
    color: #808080;
}
.VideoCard {
  position: relative;
  overflow: hidden;
  border: solid 1px #EBEBEB;
  border-radius: 4px;
  box-shadow: 0 1px 3px rgba(26, 26, 26, 0.1);
}
  html[data-theme='dark'] .VideoCard {
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
  }
  html[data-theme="dark"] .VideoCard {
  border: solid 1px #444444;
}

.VideoCard--converting .VideoCard-thumbnail {
    -webkit-filter: blur(8px);
            filter: blur(8px);
    -webkit-transform: scale(1.1);
            transform: scale(1.1);
  }

.VideoCard--converting::after {
    content: '\89C6\9891\6B63\5728\8F6C\7801\4E2D';
    color: #FFFFFF;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
  }

html[data-theme="dark"] .VideoCard--converting::after {
    color: #1A1A1A;
}

.VideoCard-link {
  display: block;
}

.VideoCard-layout {
  display: flex;
  flex-wrap: wrap;
}

.VideoCard-poster {
  width: 120px;
  height: 90px;
  background-color: #EBEBEB;
}

.VideoCard-poster img {
    display: block;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
  }

html[data-theme="dark"] .VideoCard-poster {
  background-color: #444444;
}

.VideoCard-video {
  position: relative;
  width: 100%;
}

.VideoCard-video::before {
    display: block;
    padding-top: calc(100% * 9 / 16);
    content: '';
  }

.VideoCard-video-content {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.VideoCard-thumbnail {
  position: relative;
  width: 100%;
  height: 100%;
  background-color: #EBEBEB;
}

.VideoCard-thumbnail img {
    display: block;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
  }

html[data-theme="dark"] .VideoCard-thumbnail {
  background-color: #444444;
}

.VideoCard-play-button {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 56px;
  height: 56px;
  margin: auto;
  transition: -webkit-transform 0.3s;
  transition: transform 0.3s;
  transition: transform 0.3s, -webkit-transform 0.3s;
}

.VideoCard-playIcon {
  display: block;
  box-shadow: 0 0 4px 0 rgba(26, 26, 26, 0.16);
  border-radius: 50%;
}

html[data-theme='dark'] .VideoCard-playIcon {
    -webkit-filter: brightness(0.7);
            filter: brightness(0.7);
  }

html[data-theme="dark"] .VideoCard-playIcon {
  box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.16);
}

.VideoCard--interactive .VideoCard-video:hover .VideoCard-play-button {
  -webkit-transform: scale(1.1);
          transform: scale(1.1);
}

.VideoCard-content {
  flex: 1;
  padding: 10px 16px;
  overflow: hidden;
  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 {
  color: #175199;
}

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;
}

html[data-theme="dark"] .VideoCard-badge {
  background-color: #2E2E2E;
}

.VideoCard-player {
  width: 100%;
  height: 100%;
  background-color: #1A1A1A;
}

.VideoCard-player iframe,
  .VideoCard-player .Embed {
    display: block;
    width: 100%;
    height: 100%;
  }

html[data-theme="dark"] .VideoCard-player {
  background-color: #999999;
}

.VideoCard-overlay {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
  background-color: #FFFFFF;
}

.VideoCard-overlay.is-loading {
    opacity: 0;
  }

html[data-theme="dark"] .VideoCard-overlay {
  background-color: #1A1A1A;
}

.VideoCard-mask {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
  background-color: #1A1A1A;
  transition: opacity 0.3s, visibility 0.3s;
}

.VideoCard-mask:not(.is-shown) {
    opacity: 0;
    visibility: hidden;
  }

html[data-theme="dark"] .VideoCard-mask {
  background-color: #999999;
}

.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;
  }
.Editable-videoCensorList {
  background: rgba(241, 64, 60, 0.1);
  border-radius: 4px;
  color: #F1403C;
  font-size: 15px;
  margin-top: 10px;
  padding: 10px 18px 10px 13px;
}
  html[data-theme="dark"] .Editable-videoCensorList {
  background: rgba(183, 48, 45, 0.1);
}
  html[data-theme="dark"] .Editable-videoCensorList {
  color: #B7302D;
}

.Editable-videoCensorItem {
  line-height: 19px;
  margin-bottom: 5px;
}

.Editable-videoCensorItem:last-child {
    margin-bottom: 0;
  }

.Editable-videoCensorItem::before {
    content: '\2022';
  }

.Editable-videoCensorItem span {
    font-weight: bold;
  }
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;
  }

  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;
}
.Mask {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1;
  transition: opacity 200ms ease-in;
}

.Mask-hidden {
  pointer-events: none;
  opacity: 0;
}

.Mask-mask {
  position: absolute;
  z-index: -1;
  width: 100%;
  height: 100%;
  opacity: 0.4;
  box-sizing: border-box;
}

.Mask-mask--black {
  background: #1A1A1A;
}

html[data-theme="dark"] .Mask-mask--black {
  background: #999999;
}

.Mask-mask--white {
  background: rgba(255, 255, 255, 0.95);
}

html[data-theme="dark"] .Mask-mask--white {
  background: rgba(26, 26, 26, 0.95);
}

.Mask-content {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 5;
  color: #FFFFFF;
  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%;
}
.VideoCoverEditor-Modal .Modal-inner {
  width: 400px;
  height: 480px;
  overflow: hidden;
}

.VideoCoverEditor-title {
  font-size: 20px;
  font-weight: 500;
  color: #1A1A1A;
}

html[data-theme="dark"] .VideoCoverEditor-title {
  color: #999999;
}

.VideoCoverEditor-tabs {
  display: flex;
  width: calc(100% - 80px);
  margin: 0 auto;
}

.VideoCoverEditor-tabItem {
  flex: 1;
  font-weight: 500;
  font-size: 20px;
  color: #444444;
  cursor: pointer;
}

.VideoCoverEditor-tabItem.active {
    color: #0084FF;
  }

html[data-theme="dark"] .VideoCoverEditor-tabItem.active {
    color: #3A76D0;
}

.VideoCoverEditor-tabItem:not(:last-child):after {
    content: ' |';
    float: right;
    font-weight: 100;
    color: #EBEBEB;
  }

html[data-theme="dark"] .VideoCoverEditor-tabItem:not(:last-child):after {
    color: #444444;
}

html[data-theme="dark"] .VideoCoverEditor-tabItem {
  color: #808080;
}

.VideoCoverEditor-tabItem.active {
  color: #0084FF;
}

html[data-theme="dark"] .VideoCoverEditor-tabItem.active {
  color: #3A76D0;
}

.VideoCoverPicker-coverSelect {
  text-align: center;
}

.VideoCoverPicker-coverList {
  position: relative;
  width: 100%;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  margin-top: 36px;
}

.VideoCoverPicker-coverItem {
  position: relative;
  width: 112px;
  height: 63.5px;
  margin: 0 8px 8px 0;
  box-sizing: border-box;
  background: rgba(26, 26, 26, 0.03);
  cursor: pointer;
  border: solid 3px #FFFFFF;
}

.VideoCoverPicker-coverItem.actived {
    border-color: #0084FF;
  }

html[data-theme="dark"] .VideoCoverPicker-coverItem.actived {
    border-color: #3A76D0;
}

html[data-theme="dark"] .VideoCoverPicker-coverItem {
  background: rgba(153, 153, 153, 0.03);
}

html[data-theme="dark"] .VideoCoverPicker-coverItem {
  border: solid 3px #1A1A1A;
}

.VideoCoverPicker-coverItem img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

.VideoCoverPicker-coverItem:nth-child(3n + 0) {
  margin-right: 0;
}

.VideoCoverPicker-coverSelect .BounceLoading {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -120%);
          transform: translate(-50%, -120%);
}

.VideoCoverPicker-coverSelectBtn {
  width: 220px;
  height: 34px;
  margin: 62px auto 0;
}

.VideoCoverPicker-coverSelectBtn.disabled {
    opacity: 0.5;
  }

.VideoCoverFileInput {
  margin-top: 40px;
}

.VideoCoverFile-uploader {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  box-sizing: border-box;
  height: 220px;
  border: 2px dashed #EBEBEB;
  border-radius: 10px;
  cursor: pointer;
}

.VideoCoverFile-uploader:hover {
    border-color: #8590A6;
  }

.VideoCoverFile-uploader:hover .Zi {
      fill: #999999;
    }

html[data-theme="dark"] .VideoCoverFile-uploader:hover .Zi {
      fill: #646464;
}

html[data-theme="dark"] .VideoCoverFile-uploader:hover {
    border-color: #606A80;
}

.VideoCoverFile-uploader input {
    opacity: 0;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    width: 100%;
    height: 100%;
    cursor: pointer;
  }

html[data-theme="dark"] .VideoCoverFile-uploader {
  border: 2px dashed #444444;
}

.VideoCoverFile-uploader-icon {
  text-align: center;
  display: block;
}

.VideoCoverFile-uploader-icon .Zi {
    vertical-align: middle;
    fill: #EBEBEB;
  }

html[data-theme="dark"] .VideoCoverFile-uploader-icon .Zi {
    fill: #444444;
}

.VideoCoverFileInput-uplaodImg .Zi {
  fill: #999999;
}

html[data-theme="dark"] .VideoCoverFileInput-uplaodImg .Zi {
  fill: #646464;
}

.VideoCoverFile-uploader-text {
  margin-top: 10px;
  font-size: 18px;
  line-height: 30px;
  text-align: center;
  color: #444444;
}

html[data-theme="dark"] .VideoCoverFile-uploader-text {
  color: #808080;
}

.VideoCoverFile-uploader-tip {
  font-size: 14px;
  line-height: 30px;
  text-align: center;
  color: #999999;
}

html[data-theme="dark"] .VideoCoverFile-uploader-tip {
  color: #646464;
}

.VideoCoverCrop-range {
  display: flex;
  flex-direction: row;
  margin: 22px auto 30px;
  align-items: center;
}

.VideoCoverCrop .RangeInput {
  margin-top: 4px;
}

.VideoCoverCrop-uplaodImgFooter {
  width: 100%;
  display: flex;
  flex-direction: row;
}

.VideoCoverCrop-uplaodImgFooter button {
  flex: 1;
}

.VideoCoverCrop-uplaodImgFooter button:not(:last-child) {
    margin-right: 20px;
  }

.VideoCoverPickerPending {
  margin-top: 100px;
  text-align: center;
}

.VideoCoverPickerPending p {
  font-size: 18px;
  line-height: 1.78;
  color: #999999;
}

html[data-theme="dark"] .VideoCoverPickerPending p {
  color: #646464;
}

.VideoCoverPickerPending-nowUpdate {
  margin-top: 135px;
}

.VideoCoverPicker-coverItem .Mask-mask {
  opacity: 0.03;
}
.Editable-video {
  margin: 16px 0;
  border-radius: 4px;
}

.Video-uploadPosterButton {
  background: rgba(26, 26, 26, 0.5);
  border: 1px solid rgba(255, 255, 255, 0.3);
  border-radius: 3px;
  height: 32px;
  width: 109px;
  position: absolute;
  bottom: 16px;
  right: 16px;
  text-align: center;
  line-height: 32px;
  cursor: pointer;
}

.Video-uploadPosterButton p {
    color: #FFFFFF;
    font-size: 14px;
    margin: 0 !important;
  }

html[data-theme="dark"] .Video-uploadPosterButton p {
    color: #1A1A1A;
}

html[data-theme="dark"] .Video-uploadPosterButton {
  background: rgba(153, 153, 153, 0.5);
}

html[data-theme="dark"] .Video-uploadPosterButton {
  border: 1px solid rgba(26, 26, 26, 0.3);
}

.Editable-video--titleError .Editable-VideoTitleInput-afterIcon {
    color: #F1403C;
  }

html[data-theme="dark"] .Editable-video--titleError .Editable-VideoTitleInput-afterIcon {
    color: #B7302D;
}

.Editable-video--posterError .Video-uploadPosterButton {
    background: #F1403C;
    border: none;
  }

html[data-theme="dark"] .Editable-video--posterError .Video-uploadPosterButton {
    background: #B7302D;
}
.Editable-videoUploader {
  margin: 16px 0;
  border-radius: 4px;
}

.Editable-videoUploader-thumbnail {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  width: 100%;
  height: 100%;
}

.Editable-videoUploader-text {
  text-align: center;
  position: relative;
  color: #8590A6;
}

html[data-theme="dark"] .Editable-videoUploader-text {
  color: #606A80;
}

.Editable-videoUploader-status {
  font-size: 28px;
  line-height: 40px;
}

.Editable-videoUploader-size {
  margin-top: 10px;
  font-size: 14px;
  line-height: 20px;
}

.Editable-videoUploader-retry {
  margin-top: 4px;
  font-size: 16px;
  line-height: 32px;
}

.Editable-videoUploader-retry .Button {
    font-size: inherit;
  }

.Editable-videoUploader-retry .Button:hover {
      background-color: transparent !important;
      background-color: initial !important;
    }

.Editable-videoUploader-progress {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  overflow: hidden;
  height: 4px;
  background-color: rgba(26, 26, 26, 0.05);
}

html[data-theme="dark"] .Editable-videoUploader-progress {
  background-color: rgba(153, 153, 153, 0.05);
}

.Editable-videoUploader-progress-bar {
  position: absolute;
  left: 0;
  top: 0;
  height: 100%;
  background-color: #0084FF;
}

.Editable-videoUploader-progress-bar.is-error {
    background-color: #FF3366;
  }

html[data-theme="dark"] .Editable-videoUploader-progress-bar.is-error {
    background-color: #D92155;
}

html[data-theme="dark"] .Editable-videoUploader-progress-bar {
  background-color: #3A76D0;
}

.Editable-videoUploader-progress .LoadingBar {
  position: absolute;
  left: 0;
  top: 0;
  height: 100%;
  background-color: rgba(255, 255, 255, 0.3);
}

html[data-theme="dark"] .Editable-videoUploader-progress .LoadingBar {
  background-color: rgba(26, 26, 26, 0.3);
}

.Editable-videoUploader-image {
  position: absolute;
}

.Editable-videoUploader-uploadPosterButton {
  background: rgba(26, 26, 26, 0.5);
  border: 1px solid rgba(255, 255, 255, 0.3);
  border-radius: 3px;
  height: 32px;
  width: 109px;
  position: absolute;
  bottom: 16px;
  right: 16px;
  text-align: center;
  line-height: 32px;
  cursor: pointer;
}

.Editable-videoUploader-uploadPosterButton p {
    color: #FFFFFF;
    font-size: 14px;
    margin: 0 !important;
  }

html[data-theme="dark"] .Editable-videoUploader-uploadPosterButton p {
    color: #1A1A1A;
}

html[data-theme="dark"] .Editable-videoUploader-uploadPosterButton {
  background: rgba(153, 153, 153, 0.5);
}

html[data-theme="dark"] .Editable-videoUploader-uploadPosterButton {
  border: 1px solid rgba(26, 26, 26, 0.3);
}

.Editable-videoUploader-imageMask {
  width: 100%;
  height: 100%;
  position: absolute;
  background: rgba(235, 235, 235, 0.9);
}

html[data-theme="dark"] .Editable-videoUploader-imageMask {
  background: rgba(68, 68, 68, 0.9);
}
.VideoErrorCard-thumbnail {
  display: flex;
  flex-direction: column;
  justify-content: 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;
}
.Editable-videoError {
  margin: 16px 0;
  border-radius: 4px;
}

.Editable-videoError--titleError .Editable-VideoTitleInput-afterIcon {
    color: #F1403C;
  }

html[data-theme="dark"] .Editable-videoError--titleError .Editable-VideoTitleInput-afterIcon {
    color: #B7302D;
}
.Editable-divider {
  overflow: hidden;
}
.Link + .Link {
  margin-left: 2px;
}

.Link[data-editable] {
  cursor: text !important;
}
.LinkCard {
  position: relative;
  display: block;
  margin: 1em auto;

  width: 390px;
  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: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px;
  border-radius: inherit;
  background-color: rgba(246, 246, 246, 0.88);
}

.LinkCard--noImage .LinkCard-content {
    background-color: #F6F6F6;
  }

html[data-theme="dark"] .LinkCard--noImage .LinkCard-content {
    background-color: #2E2E2E;
}

@supports ((-webkit-backdrop-filter: blur(20px)) or (backdrop-filter: blur(20px))) {

.LinkCard-content {
    -webkit-backdrop-filter: blur(20px);
            backdrop-filter: blur(20px)
}
  }

html[data-theme="dark"] .LinkCard-content {
  background-color: rgba(46, 46, 46, 0.88);
}

.LinkCard-text {
  overflow: hidden;
}

.LinkCard-title {
  /* 2 行截断（Chrome/Safari），注意卡片是自适应宽度的 */
  display: -webkit-box;
  -webkit-line-clamp: 2;
  overflow: hidden;
  text-overflow: ellipsis;
  /* 2 行截断 fallback */
  max-height: calc(16px * 1.25 * 2);
  font-size: 16px;
  font-weight: 500;
  line-height: 1.25;
  color: #1A1A1A;
}

html[data-theme="dark"] .LinkCard-title {
  color: #999999;
}

.LinkCard-meta {
  display: flex;
  margin-top: 4px;
  font-size: 14px;
  line-height: 20px;
  color: #999999;
  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: #FFFFFF;
  border-radius: 5px;
  color: #C2A469;
  display: inline-block;
  margin-left: 8px;
  min-width: 50px;
  padding: 0 4px;
  text-align: center;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
}

html[data-ios] .LinkCard-badge {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .LinkCard-badge {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

html[data-theme="dark"] .LinkCard-badge {
  background: #1A1A1A;
}

html[data-theme="dark"] .LinkCard-badge {
  color: #806E46;
}

.LinkCard-image {
  display: block;
  width: 60px;
  height: 60px;
  border-radius: inherit;
}

/* 3:2, 180x120 */

.LinkCard-image.LinkCard-image--horizontal {
    width: 90px;
  }

/* 3:4, 120x160 */

.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(0.7);
            filter: brightness(0.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: center;
}

@supports ((-webkit-backdrop-filter: blur(20px)) or (backdrop-filter: blur(20px))) {

.LinkCard-backdrop {
    -webkit-filter: none;
            filter: none
}
  }

.LinkCard-image--default {
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #EBEBEB;
  color: #D3D3D3;
}

html[data-theme="dark"] .LinkCard-image--default {
  background-color: #444444;
}

html[data-theme="dark"] .LinkCard-image--default {
  color: #2E2E2E;
}
.LinkModal-input {
  display: flex;
  flex-direction: row;
  align-items: center;
}

.LinkModal-input + .LinkModal-input {
  margin-top: 10px;
}

.LinkModal-input .Input {
  margin-left: 8px;
}
/* Popover 缺陷，不支持定制到目标元素距离 */
.LinkBubble.Popover-content--top.Popover-content--arrowed {
  margin-top: -10px;
}

.LinkBubble.Popover-content--bottom.Popover-content--arrowed {
  margin-top: 10px;
}

.LinkBubble-content {
  display: block;
  padding: 7px 10px 7px 16px;
}

.LinkBubble-previewLink,
.LinkBubble-button {
  vertical-align: middle;
}

.LinkBubble-previewLink {
  display: inline-block;
  margin-right: 8px;
  max-width: 233px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  text-decoration: none;
  font-size: 14px;
  line-height: 1.3;
  border-bottom: 1px solid transparent;
}

.LinkBubble-previewLink:hover {
    color: #175199;
    border-bottom-color: rgba(0, 132, 255, 0.72);
  }

html[data-theme="dark"] .LinkBubble-previewLink:hover {
    color: #175199;
}

html[data-theme="dark"] .LinkBubble-previewLink:hover {
    border-bottom-color: rgba(58, 118, 208, 0.72);
}

.LinkBubble-button {
  padding: 0 6px;
}
.Avatar {
  background: #FFFFFF;
  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%;
}
.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: center;
  background-repeat: no-repeat;
  transition: opacity 300ms ease-in;
}

.VagueImage-mask.is-active {
    opacity: 1;
  }

.VagueImage-mask,
  .VagueImage-mask::before,
  .VagueImage-mask::after {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
  }

.VagueImage-mask::after,
  .VagueImage-mask::before {
    display: block;
    content: '';
  }

.VagueImage-mask::before {
    background-color: #FFFFFF;
    opacity: 0.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: center;
  }

.VagueImage-innerLarge {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100%;
  -webkit-transform: translate3d(-50%, -50%, 0);
          transform: translate3d(-50%, -50%, 0);
}
/**
 * 富文本样式
 */

/* TODO：删除这个，应由外部传入 ztext 专有的 mention class */

.RichText a.UserLink-link {
    color: #175199;
  }

.RichText a.UserLink-link:hover {
    border-bottom: 1px solid #175199;
  }

html[data-theme="dark"] .RichText a.UserLink-link:hover {
    border-bottom: 1px solid #175199;
}

html[data-theme="dark"] .RichText a.UserLink-link {
    color: #175199;
}
/**
 * 内容排版规范
 * http://wiki.in.zhihu.com/pages/viewpage.action?pageId=41363888
 *
 * 注意：
 * - 此样式表主要包含原生标签样式
 * - 文档（wiki）按 rem 标记，但样式需要跨多项目、多页面使用，不适合使用 rem，所以部分样式存在 rem/em 转换
 */
.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,
  .ztext h3,
  .ztext h4,
  .ztext h5,
  .ztext h6 {
    margin-top: calc(2em / 1.2);
    margin-bottom: calc(1em / 1.2);
    font-size: 1.2em;
    line-height: 1.5;
    /* 与设计一致，不支持设备将回退为 700 */
    font-weight: 600;
    /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
    font-synthesis: style;
  }
html[data-ios] .ztext h1, html[data-ios] .ztext h2, html[data-ios] .ztext h3, html[data-ios] .ztext h4, html[data-ios] .ztext h5, html[data-ios] .ztext h6 {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }
html[data-android] .ztext h1, html[data-android] .ztext h2, html[data-android] .ztext h3, html[data-android] .ztext h4, html[data-android] .ztext h5, html[data-android] .ztext h6 {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }
/* 下划线 */
.ztext u {
    text-decoration: none;
    border-bottom: 1px dashed #808080;
  }
html[data-theme="dark"] .ztext u {
    border-bottom: 1px dashed #808080;
}
/* 粗体 */
.ztext b {
    /* 与设计一致，不支持设备将回退为 700 */
    font-weight: 600;
    /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
    font-synthesis: style;
  }
html[data-ios] .ztext b {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }
html[data-android] .ztext b {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }
/* 链接 */
.ztext a.ztext-link,
  .ztext a.internal,
  .ztext a.external {
    text-decoration: none;
    cursor: pointer;
    border-bottom: 1px solid #808080;
  }
.ztext a.ztext-link:hover, .ztext a.internal:hover, .ztext a.external:hover {
      color: #175199;
      border-bottom: 1px solid #175199;
    }
html[data-theme="dark"] .ztext a.ztext-link:hover, html[data-theme="dark"] .ztext a.internal:hover, html[data-theme="dark"] .ztext a.external:hover {
      color: #175199;
}
html[data-theme="dark"] .ztext a.ztext-link:hover, html[data-theme="dark"] .ztext a.internal:hover, html[data-theme="dark"] .ztext a.external:hover {
      border-bottom: 1px solid #175199;
}
/* 优化过后的超级链接，隐藏 protocol 和 path */
.ztext a.ztext-link > .ellipsis::after, .ztext a.internal > .ellipsis::after, .ztext a.external > .ellipsis::after {
      content: '...';
    }
.ztext a.ztext-link > .invisible, .ztext a.internal > .invisible, .ztext a.external > .invisible {
      /* .u-hideText */
      font: 0/0 a;
      color: transparent;
      text-shadow: none;
      background-color: transparent;
    }
.ztext a.ztext-link u, .ztext a.internal u, .ztext a.external u {
      border: none;
    }
html[data-theme="dark"] .ztext a.ztext-link, html[data-theme="dark"] .ztext a.internal, html[data-theme="dark"] .ztext a.external {
    border-bottom: 1px solid #808080;
}
/* 提及链接 */
.ztext a.member_mention {
    color: #175199;
  }
.ztext a.member_mention:hover {
    border-bottom: 1px solid #175199;
  }
html[data-theme="dark"] .ztext a.member_mention:hover {
    border-bottom: 1px solid #175199;
}
html[data-theme="dark"] .ztext a.member_mention {
    color: #175199;
}
/* 段落 */
.ztext p {
    margin: 1em 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;
  }
/* 公式使用 GBK02A [#1A1A1A, #999999] */
html[data-theme='dark'] .ztext img[eeimg] {
      -webkit-filter: invert(0.6) hue-rotate(180deg);
              filter: invert(0.6) hue-rotate(180deg); /* 0.6 = 0x99/0xff */
  }
/* inline math */
.ztext img[eeimg='1'] {
    margin: 0 3px;
    display: inline-block;
  }
/* display math */
.ztext img[eeimg='2'] {
    margin: 1em auto;
    display: block;
  }
/* 引用 */
.ztext blockquote {
    margin: 1em 0;
    padding-left: 1em;
    color: #646464;
    border-left: 3px solid #D3D3D3;
  }
html[data-theme="dark"] .ztext blockquote {
    color: #999999;
}
html[data-theme="dark"] .ztext blockquote {
    border-left: 3px solid #2E2E2E;
}
/** 列表
   * 对于列表的特别定制（https://codepen.io/ambarli/full/yjaYLZ/）：
   * - 项目符号与左边对齐
   * - 折行的文本与之前的文本对齐
   * - 防止溢出（三位数及以上的序号）
   * - 对齐列表外的相邻文本
   * - 同级的序号始终右侧对齐（仅有序列表）
   */
.ztext ol,
  .ztext ul {
    margin: 1em 0;
    padding: 0;
  }
.ztext ol ol,
    .ztext ol ul,
    .ztext ul ol,
    .ztext ul ul {
      margin: 0;
    }
/* 错误格式兼容（https://git.in.zhihu.com/fe/zhihu-components/issues/27） */
.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;
        /* 与原生一致，并且不同数字的占用宽度不一样（即使位数相同，例如 1/8 的宽度不一样） */
        text-align: right;
        counter-increment: ol;
        content: counter(ol) '. ';
        white-space: pre;
      }
/* hack level 2（错误格式兼容） */
.ztext ol ol {
    counter-reset: ol2;
  }
.ztext ol ol li::before {
      counter-increment: ol2;
      content: counter(ol2) '. ';
    }
/* hack level 3（错误格式兼容） */
.ztext ol ol ol {
    counter-reset: ol3;
  }
.ztext ol ol ol li::before {
      counter-increment: ol3;
      content: counter(ol3) '. ';
    }
/* hack level 4（错误格式兼容 —— Draft.js 最高支持四级嵌套） */
.ztext ol ol ol ol {
    counter-reset: ol4;
  }
.ztext ol ol ol ol li::before {
      counter-increment: ol4;
      content: counter(ol4) '. ';
    }
/* 图片（容器） */
.ztext figure {
    margin: 1em 0;
  }
.ztext figure .content_image,
    .ztext figure .origin_image {
      margin: 0 auto;
    }
.ztext figure figcaption {
      margin-top: calc(0.6em / 0.9);
      padding: 0 1em; /* 如果存在全宽图片，防止文字贴边 */
      font-size: 0.9em;
      line-height: 1.5;
      text-align: center;
      color: #999999;
    }
html[data-theme="dark"] .ztext figure figcaption {
      color: #646464;
}
/* 让相邻图片注释区分明显一些 */
.ztext figure + figure {
      margin-top: 1.6em;
    }
/* 图片（content_image 是宽度 <= 420 的图片，origin_image 是宽度 > 420 的图片） */
.ztext .content_image,
  .ztext .origin_image {
    display: block;
    max-width: 100%;
    margin: 1em auto;
  }
html[data-theme='dark'] .ztext .content_image, html[data-theme='dark'] .ztext .origin_image {
    -webkit-filter: brightness(0.7);
            filter: brightness(0.7);
  }
/* https://bugs.webkit.org/show_bug.cgi?id=183271 */
html[data-ios] .ztext .content_image, html[data-ios] .ztext .origin_image {
      -webkit-filter: none;
              filter: none;
    }
/* iOS 11 下 Mobile Safari 使用滤镜偶尔会破坏图片显示 */
.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: 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: 0.9em;
    background-color: #F6F6F6;
  }
html[data-theme="dark"] .ztext code {
    background-color: #2E2E2E;
}
/* 预格式化文本（代码块容器，高亮样式在 highlight.css） */
.ztext pre {
    margin: 1em 0;
    padding: calc(0.8em / 0.9);
    font-size: 0.9em;
    /* 覆盖 .ztext 设置的 break-word，否则 Safari 下会折行 */
    word-break: initial;
    /* overflow 容器不需要 break-word（同时确保 IE/Edge 显示滚动条，覆盖了外层的 word-wrap 样式） */
    word-wrap: initial;
    white-space: pre;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    background: #F6F6F6;
    border-radius: 4px;
  }
.ztext pre code {
      margin: 0;
      padding: 0;
      font-size: inherit;
      border-radius: 0;
      background-color: inherit;
    }
html[data-theme="dark"] .ztext pre {
    background: #2E2E2E;
}
/* 当前列表用表格模拟样式，内部遇到 pre 溢出时会 overflow 不生效（发生在旧的内容和用户构造提交的内容上）；TODO: 移除表格显示 */
.ztext li pre {
    white-space: pre-wrap;
  }

/* 旧的视频和分享，已废弃（新编辑器不再提供） */
.ztext .video-box,
.ztext .link-box {
  position: relative;
  display: flex;
  justify-content: space-between;
  margin: 1em 0;
  overflow: auto;
  white-space: normal;
  cursor: pointer;
  border: solid 1px #EBEBEB;
  border-radius: 4px;
  box-shadow: 0 1px 3px rgba(26, 26, 26, 0.1);
}
html[data-theme='dark'] .ztext .video-box, html[data-theme='dark'] .ztext .link-box {
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
  }
.ztext .video-box .thumbnail, .ztext .link-box .thumbnail {
    flex-shrink: 0;
    width: 90px;
    height: 90px;
    -o-object-fit: cover;
       object-fit: cover;
  }
.ztext .video-box .content, .ztext .link-box .content {
    display: flex;
    width: 100%;
    padding: 10px 1em;
    overflow: hidden;
    flex-direction: column;
    justify-content: space-around;
  }
.ztext .video-box .title, .ztext .link-box .title {
    font-size: 1.2em;
    /* 与设计一致，不支持设备将回退为 700 */
    font-weight: 600;
    /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
    font-synthesis: style;
  }
html[data-ios] .ztext .video-box .title, html[data-ios] .ztext .link-box .title {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }
html[data-android] .ztext .video-box .title, html[data-android] .ztext .link-box .title {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }
.ztext .video-box .url, .ztext .link-box .url {
    overflow: hidden;
    color: #808080;

    /* .u-ellipsis */
    text-overflow: ellipsis;
    word-wrap: normal;
    white-space: nowrap;
  }
html[data-theme="dark"] .ztext .video-box .url, html[data-theme="dark"] .ztext .link-box .url {
    color: #808080;
}
.ztext .video-box .label, .ztext .link-box .label {
    display: none;
  }
html[data-theme="dark"] .ztext .video-box, html[data-theme="dark"] .ztext .link-box {
  border: solid 1px #444444;
}
/* 代码高亮（由 Pygments 实现） */
.highlight {
  margin: 1em 0;
}
.highlight pre {
    margin: 0;
  }
/* 修改自 trac 主题 */
.highlight .hll {
    background-color: #FDFDFD;
  }
html[data-theme="dark"] .highlight .hll {
    background-color: #2E2E2E;
}
/* Comment */
.highlight .c {
    font-style: italic;
    color: #999999;
  }
html[data-theme="dark"] .highlight .c {
    color: #646464;
}
/* Error */
.highlight .err {
    color: #F1403C;
  }
html[data-theme="dark"] .highlight .err {
    color: #B7302D;
}
/* Keyword */
.highlight .k {
    /* 与设计一致，不支持设备将回退为 700 */
    font-weight: 600;
    /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
    font-synthesis: style;
  }
html[data-ios] .highlight .k {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }
html[data-android] .highlight .k {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }
/* Operator */
.highlight .o {
    /* 与设计一致，不支持设备将回退为 700 */
    font-weight: 600;
    /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
    font-synthesis: style;
  }
html[data-ios] .highlight .o {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }
html[data-android] .highlight .o {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }
/* Comment.Multiline */
.highlight .cm {
    font-style: italic;
    color: #999999;
  }
html[data-theme="dark"] .highlight .cm {
    color: #646464;
}
/* Comment.Preproc */
.highlight .cp {
    /* 与设计一致，不支持设备将回退为 700 */
    font-weight: 600;
    /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
    font-synthesis: style;
    color: #999999;
  }
html[data-ios] .highlight .cp {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }
html[data-android] .highlight .cp {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }
html[data-theme="dark"] .highlight .cp {
    color: #646464;
}
/* Comment.Single */
.highlight .c1 {
    font-style: italic;
    color: #999999;
  }
html[data-theme="dark"] .highlight .c1 {
    color: #646464;
}
.highlight .cs {
    font-style: italic;
    /* Comment.Special */
    /* 与设计一致，不支持设备将回退为 700 */
    font-weight: 600;
    /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
    font-synthesis: style;
    color: #999999;
  }
html[data-ios] .highlight .cs {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }
html[data-android] .highlight .cs {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }
html[data-theme="dark"] .highlight .cs {
    color: #646464;
}
/* Generic.Deleted */
.highlight .gd {
    color: #1A1A1A;
    background-color: #EBEBEB;
  }
html[data-theme="dark"] .highlight .gd {
    color: #999999;
}
html[data-theme="dark"] .highlight .gd {
    background-color: #444444;
}
/* Generic.Emph */
.highlight .ge {
    font-style: italic;
  }
/* Generic.Error */
.highlight .gr {
    color: #F1403C;
  }
html[data-theme="dark"] .highlight .gr {
    color: #B7302D;
}
/* Generic.Heading */
.highlight .gh {
    color: #999999;
  }
html[data-theme="dark"] .highlight .gh {
    color: #646464;
}
/* Generic.Inserted */
.highlight .gi {
    color: #1A1A1A;
    background-color: #F6F6F6;
  }
html[data-theme="dark"] .highlight .gi {
    color: #999999;
}
html[data-theme="dark"] .highlight .gi {
    background-color: #2E2E2E;
}
/* Generic.Output */
.highlight .go {
    color: #808080;
  }
html[data-theme="dark"] .highlight .go {
    color: #808080;
}
/* Generic.Prompt */
.highlight .gp {
    color: #646464;
  }
html[data-theme="dark"] .highlight .gp {
    color: #999999;
}
/* Generic.Strong */
.highlight .gs {
    /* 与设计一致，不支持设备将回退为 700 */
    font-weight: 600;
    /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
    font-synthesis: style;
  }
html[data-ios] .highlight .gs {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }
html[data-android] .highlight .gs {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }
/* Generic.Subheading */
.highlight .gu {
    color: #999999;
  }
html[data-theme="dark"] .highlight .gu {
    color: #646464;
}
/* Generic.Traceback */
.highlight .gt {
    color: #F1403C;
  }
html[data-theme="dark"] .highlight .gt {
    color: #B7302D;
}
/* Keyword.Constant */
.highlight .kc {
    /* 与设计一致，不支持设备将回退为 700 */
    font-weight: 600;
    /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
    font-synthesis: style;
  }
html[data-ios] .highlight .kc {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }
html[data-android] .highlight .kc {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }
/* Keyword.Declaration */
.highlight .kd {
    /* 与设计一致，不支持设备将回退为 700 */
    font-weight: 600;
    /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
    font-synthesis: style;
  }
html[data-ios] .highlight .kd {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }
html[data-android] .highlight .kd {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }
/* Keyword.Namespace */
.highlight .kn {
    /* 与设计一致，不支持设备将回退为 700 */
    font-weight: 600;
    /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
    font-synthesis: style;
  }
html[data-ios] .highlight .kn {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }
html[data-android] .highlight .kn {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }
/* Keyword.Pseudo */
.highlight .kp {
    /* 与设计一致，不支持设备将回退为 700 */
    font-weight: 600;
    /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
    font-synthesis: style;
  }
html[data-ios] .highlight .kp {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }
html[data-android] .highlight .kp {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }
/* Keyword.Reserved */
.highlight .kr {
    /* 与设计一致，不支持设备将回退为 700 */
    font-weight: 600;
    /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
    font-synthesis: style;
  }
html[data-ios] .highlight .kr {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }
html[data-android] .highlight .kr {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }
/* Keyword.Type */
.highlight .kt {
    /* 与设计一致，不支持设备将回退为 700 */
    font-weight: 600;
    /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
    font-synthesis: style;
    color: #175199;
  }
html[data-ios] .highlight .kt {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }
html[data-android] .highlight .kt {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }
html[data-theme="dark"] .highlight .kt {
    color: #175199;
}
/* Literal.Number */
.highlight .m {
    color: #0084FF;
  }
html[data-theme="dark"] .highlight .m {
    color: #3A76D0;
}
/* Literal.String */
.highlight .s {
    color: #F1403C;
  }
html[data-theme="dark"] .highlight .s {
    color: #B7302D;
}
/* Name.Attribute */
.highlight .na {
    color: #0084FF;
  }
html[data-theme="dark"] .highlight .na {
    color: #3A76D0;
}
/* Name.Builtin */
.highlight .nb {
    color: #0084FF;
  }
html[data-theme="dark"] .highlight .nb {
    color: #3A76D0;
}
/* Name.Class */
.highlight .nc {
    /* 与设计一致，不支持设备将回退为 700 */
    font-weight: 600;
    /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
    font-synthesis: style;
    color: #175199;
  }
html[data-ios] .highlight .nc {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }
html[data-android] .highlight .nc {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }
html[data-theme="dark"] .highlight .nc {
    color: #175199;
}
/* Name.Constant */
.highlight .no {
    color: #0084FF;
  }
html[data-theme="dark"] .highlight .no {
    color: #3A76D0;
}
/* Name.Entity */
.highlight .ni {
    color: #5868D1;
  }
html[data-theme="dark"] .highlight .ni {
    color: #5868D1;
}
/* Name.Exception */
.highlight .ne {
    /* 与设计一致，不支持设备将回退为 700 */
    font-weight: 600;
    /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
    font-synthesis: style;
    color: #F1403C;
  }
html[data-ios] .highlight .ne {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }
html[data-android] .highlight .ne {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }
html[data-theme="dark"] .highlight .ne {
    color: #B7302D;
}
/* Name.Function */
.highlight .nf {
    /* 与设计一致，不支持设备将回退为 700 */
    font-weight: 600;
    /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
    font-synthesis: style;
    color: #F1403C;
  }
html[data-ios] .highlight .nf {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }
html[data-android] .highlight .nf {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }
html[data-theme="dark"] .highlight .nf {
    color: #B7302D;
}
/* Name.Namespace */
.highlight .nn {
    color: #646464;
  }
html[data-theme="dark"] .highlight .nn {
    color: #999999;
}
/* Name.Tag */
.highlight .nt {
    color: #175199;
  }
html[data-theme="dark"] .highlight .nt {
    color: #175199;
}
/* Name.Variable */
.highlight .nv {
    color: #0084FF;
  }
html[data-theme="dark"] .highlight .nv {
    color: #3A76D0;
}
/* Operator.Word */
.highlight .ow {
    /* 与设计一致，不支持设备将回退为 700 */
    font-weight: 600;
    /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
    font-synthesis: style;
  }
html[data-ios] .highlight .ow {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }
html[data-android] .highlight .ow {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }
/* Text.Whitespace */
.highlight .w {
    color: #BFBFBF;
  }
html[data-theme="dark"] .highlight .w {
    color: #444444;
}
/* Literal.Number.Float */
.highlight .mf {
    color: #0084FF;
  }
html[data-theme="dark"] .highlight .mf {
    color: #3A76D0;
}
/* Literal.Number.Hex */
.highlight .mh {
    color: #0084FF;
  }
html[data-theme="dark"] .highlight .mh {
    color: #3A76D0;
}
/* Literal.Number.Integer */
.highlight .mi {
    color: #0084FF;
  }
html[data-theme="dark"] .highlight .mi {
    color: #3A76D0;
}
/* Literal.Number.Oct */
.highlight .mo {
    color: #0084FF;
  }
html[data-theme="dark"] .highlight .mo {
    color: #3A76D0;
}
/* Literal.String.Backtick */
.highlight .sb {
    color: #F1403C;
  }
html[data-theme="dark"] .highlight .sb {
    color: #B7302D;
}
/* Literal.String.Char */
.highlight .sc {
    color: #F1403C;
  }
html[data-theme="dark"] .highlight .sc {
    color: #B7302D;
}
/* Literal.String.Doc */
.highlight .sd {
    color: #F1403C;
  }
html[data-theme="dark"] .highlight .sd {
    color: #B7302D;
}
/* Literal.String.Double */
.highlight .s2 {
    color: #F1403C;
  }
html[data-theme="dark"] .highlight .s2 {
    color: #B7302D;
}
/* Literal.String.Escape */
.highlight .se {
    color: #F1403C;
  }
html[data-theme="dark"] .highlight .se {
    color: #B7302D;
}
/* Literal.String.Heredoc */
.highlight .sh {
    color: #F1403C;
  }
html[data-theme="dark"] .highlight .sh {
    color: #B7302D;
}
/* Literal.String.Interpol */
.highlight .si {
    color: #F1403C;
  }
html[data-theme="dark"] .highlight .si {
    color: #B7302D;
}
/* Literal.String.Other */
.highlight .sx {
    color: #F1403C;
  }
html[data-theme="dark"] .highlight .sx {
    color: #B7302D;
}
/* Literal.String.Regex */
.highlight .sr {
    color: #C2A469;
  }
html[data-theme="dark"] .highlight .sr {
    color: #806E46;
}
/* Literal.String.Single */
.highlight .s1 {
    color: #F1403C;
  }
html[data-theme="dark"] .highlight .s1 {
    color: #B7302D;
}
/* Literal.String.Symbol */
.highlight .ss {
    color: #F1403C;
  }
html[data-theme="dark"] .highlight .ss {
    color: #B7302D;
}
/* Name.Builtin.Pseudo */
.highlight .bp {
    color: #999999;
  }
html[data-theme="dark"] .highlight .bp {
    color: #646464;
}
/* Name.Variable.Class */
.highlight .vc {
    color: #0084FF;
  }
html[data-theme="dark"] .highlight .vc {
    color: #3A76D0;
}
/* Name.Variable.Global */
.highlight .vg {
    color: #0084FF;
  }
html[data-theme="dark"] .highlight .vg {
    color: #3A76D0;
}
/* Name.Variable.Instance */
.highlight .vi {
    color: #0084FF;
  }
html[data-theme="dark"] .highlight .vi {
    color: #3A76D0;
}
/* Literal.Number.Integer.Long */
.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, 0.5);
    border-radius: 6px;
  }
.highlight::-webkit-scrollbar-thumb:horizontal:hover {
      background-color: rgba(26, 26, 26, 0.6);
    }
html[data-theme="dark"] .highlight::-webkit-scrollbar-thumb:horizontal:hover {
      background-color: rgba(153, 153, 153, 0.6);
}
html[data-theme="dark"] .highlight::-webkit-scrollbar-thumb:horizontal {
    background-color: rgba(153, 153, 153, 0.5);
}
.AutoComplete-UserItem {
  width: 188px;
  height: 50px;
  padding: 9px 0;
  line-height: normal;
  box-sizing: border-box;
}

.AutoComplete-UserDetail {
  display: inline-block;
  margin-left: 8px;
  vertical-align: middle;
}

.AutoComplete-UserName,
.AutoComplete-UserHeadline {
  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: #999999;
}

.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;
}
.MentionSuggestions {
  position: absolute;
  z-index: 203;
  line-height: 1;
}

.MentionSuggestions-input {
  /* override Input */
  width: 200px;
  padding: 4px 6px;
  font-size: inherit;
}

.MentionSuggestions-input .Input {
    height: auto;
    background: transparent;
  }

.MentionSuggestions-menu {
  width: 200px;
}

.MentionSuggestions-menu .Menu-item {
    padding: 0 10px;
  }
.Dropzone {
  position: relative;
}

.Dropzone-cursor {
  position: absolute;
  left: 0;
  right: 0;
  margin: -1px 0;
  border-bottom: 2px solid #0084FF;
  pointer-events: none;
}

html[data-theme="dark"] .Dropzone-cursor {
  border-bottom: 2px solid #3A76D0;
}
.Editable-toolbar {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  background: #FFFFFF;
  border-bottom: 1px solid #EBEBEB;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}

  .Sticky.is-fixed .Editable-toolbar,
  .isToolbarSticky .Editable-toolbar {
    border-top: none !important;
    border-bottom: none !important;
  }

  .Sticky.is-fixed .Editable-toolbar::after, .isToolbarSticky .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, 0.1),
        rgba(255, 255, 255, 0) 80%
      );
      background: radial-gradient(
        ellipse at 50% 1%,
        rgba(26, 26, 26, 0.1),
        rgba(255, 255, 255, 0) 80%
      );
    }

  html[data-theme="dark"] .Sticky.is-fixed .Editable-toolbar::after, html[data-theme="dark"] .isToolbarSticky .Editable-toolbar::after {
      background: radial-gradient(
        ellipse at 50%, at 1%,
        rgba(153, 153, 153, 0.1),
        rgba(26, 26, 26, 0) 80%
      );
      background: radial-gradient(
        ellipse at 50% 1%,
        rgba(153, 153, 153, 0.1),
        rgba(26, 26, 26, 0) 80%
      );
}

  html[data-theme="dark"] .Editable-toolbar {
  background: #1A1A1A;
}

  html[data-theme="dark"] .Editable-toolbar {
  border-bottom: 1px solid #444444;
}

.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: #444444;
}

.Editable-control {
  align-items: center;
  border: 1px solid transparent;
  box-sizing: border-box;
  cursor: pointer;
  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;
}

html[data-theme="dark"] .Editable-control:not(:disabled):hover {
    border-color: #444444;
}

.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 {
  align-items: center;
  display: flex;
  line-height: 36px;
}

.Editable-toolbarMenuItem .Zi {
    margin-right: 4px;
  }
.Editable-videoModal .Modal-footer {
    padding: 12px 24px;
  }

.Editable-videoModal-title {
  font-size: 20px;
  font-weight: 500;
  color: #1A1A1A;
}

html[data-theme="dark"] .Editable-videoModal-title {
  color: #999999;
}

.Editable-videoModal-uploader {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  box-sizing: border-box;
  height: 220px;
  border: 2px dashed #EBEBEB;
  border-radius: 10px;
  cursor: pointer;
}

.Editable-videoModal-uploader:hover {
    border-color: #8590A6;
  }

.Editable-videoModal-uploader:hover .Zi {
      fill: #8590A6;
    }

html[data-theme="dark"] .Editable-videoModal-uploader:hover .Zi {
      fill: #606A80;
}

html[data-theme="dark"] .Editable-videoModal-uploader:hover {
    border-color: #606A80;
}

.Editable-videoModal-uploader input {
    display: none;
  }

html[data-theme="dark"] .Editable-videoModal-uploader {
  border: 2px dashed #444444;
}

.Editable-videoModal-uploader-icon {
  text-align: center;
  display: block;
}

.Editable-videoModal-uploader-icon .Zi {
    vertical-align: middle;
    fill: #EBEBEB;
  }

html[data-theme="dark"] .Editable-videoModal-uploader-icon .Zi {
    fill: #444444;
}

.Editable-videoModal-uploader-text {
  margin-top: 10px;
  font-size: 18px;
  line-height: 30px;
  text-align: center;
}

.Editable-videoModal-uploader-tip {
  font-size: 14px;
  line-height: 30px;
  text-align: center;
  color: #8590A6;
}

html[data-theme="dark"] .Editable-videoModal-uploader-tip {
  color: #606A80;
}
.Editable-docModal .Modal-footer {
    padding: 12px 24px;
  }
  .Editable-docModal input[type='file'] {
    display: none;
  }

.Editable-docModal-title {
  font-size: 20px;
  font-weight: 500;
  color: #1A1A1A;
}

html[data-theme="dark"] .Editable-docModal-title {
  color: #999999;
}

.Editable-docModal-uploader {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  box-sizing: border-box;
  height: 220px;
  border: 2px dashed #EBEBEB;
  border-radius: 10px;
  cursor: pointer;
}

.Editable-docModal-uploader:hover {
    border-color: #8590A6;
  }

.Editable-docModal-uploader:hover .Zi {
      fill: #8590A6;
    }

html[data-theme="dark"] .Editable-docModal-uploader:hover .Zi {
      fill: #606A80;
}

html[data-theme="dark"] .Editable-docModal-uploader:hover {
    border-color: #606A80;
}

html[data-theme="dark"] .Editable-docModal-uploader {
  border: 2px dashed #444444;
}

.Editable-docModal-uploader-icon {
  text-align: center;
  display: block;
}

.Editable-docModal-uploader-icon .Zi {
    vertical-align: middle;
    fill: #EBEBEB;
  }

html[data-theme="dark"] .Editable-docModal-uploader-icon .Zi {
    fill: #444444;
}

.Editable-docModal-uploader-text {
  font-size: 18px;
  line-height: 30px;
  margin-top: 20px;
  text-align: center;
}

.Editable-docModal-uploader-tip {
  font-size: 14px;
  line-height: 30px;
  text-align: center;
  color: #8590A6;
}

html[data-theme="dark"] .Editable-docModal-uploader-tip {
  color: #606A80;
}

.Editable-docModal-fileName {
  align-items: center;
  display: flex;
  justify-content: center;
}

.Editable-docModal-fileName .Zi {
    fill: #0084FF;
    margin-right: 4px;
  }

html[data-theme="dark"] .Editable-docModal-fileName .Zi {
    fill: #3A76D0;
}

.Editable-docModal-loading {
  display: flex;
  justify-content: center;
  margin: 36px 0 12px;
}

.Editable-docModal-fail {
  align-items: center;
  display: flex;
  flex-direction: column;
  text-align: center;
}

.Editable-docModal-failHint {
  color: #F1403C;
  font-size: 16px;
  margin-top: 36px;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
}

html[data-ios] .Editable-docModal-failHint {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .Editable-docModal-failHint {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

html[data-theme="dark"] .Editable-docModal-failHint {
  color: #B7302D;
}

.Editable-docModal-retryButton {
  margin: 32px 0 10px;
  width: 220px;
}
.WatermarkHint-modalBody {
  font-size: 14px;
  text-align: center;
}

.WatermarkHint-modalContent {
  padding-top: 16px;
}

.WatermarkHint-modalContent .ModalButtonGroup {
    margin-top: 32px;
    margin-bottom: 0;
  }

.WatermarkHint-modalTitle {
  font-size: 24px;
  margin: 32px 0 16px;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
}

html[data-ios] .WatermarkHint-modalTitle {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .WatermarkHint-modalTitle {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }
.Editable-languageSuggestions {
  position: fixed;
  z-index: 203;
}

.Editable-languageSuggestionsInput {
  /* simulate a search select */
  cursor: pointer;
}

.Editable-languageSuggestionsInput input {
    cursor: inherit;
  }

.Editable-languageSuggestionsInput input:focus {
      cursor: text;
    }

.Editable-languageSuggestionsMenu {
  max-height: 300px;
  margin-top: -8px; /* HACK: prevent mouseover to other block */
  margin-bottom: -8px; /* HACK: prevent mouseover to other block */
  overflow-y: auto;
}

.Editable-languageSuggestionsMenuContainer {
  overflow-y: hidden;
}
.Editable-notification-layout {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}

.Editable-notification-actions {
  display: flex;
  flex-direction: row;
  margin: 0 -12px;
}

.Editable-notification-action {
  margin: 0 12px;
}

.Editable .RichText {
  cursor: text;
}

.public-DraftEditorPlaceholder-root {
  position: absolute;
  pointer-events: none;
}

.Editable--hidePlaceholder .public-DraftEditorPlaceholder-root {
    display: none;
  }

/* 使连续的 block 不会贴在一起，并且间距与 RichText 一致 */
.Editable-styled,
.Editable-unstyled {
  margin: 0 0 0.72em;
}
.Editable-styled:first-child, .Editable-unstyled:first-child {
    margin-top: 0;
  }
.Editable-styled:last-child, .Editable-unstyled:last-child {
    /* 方便 block 样式容易被覆盖重新定义（如 .RichText blockquote） */
    margin-bottom: 0;
  }

.DraftEditor-root blockquote + blockquote {
    margin-top: -1em;
  }

.DraftEditor-root pre.public-DraftStyleDefault-pre {
    border-radius: 4px;
  }

.DraftEditor-root pre.public-DraftStyleDefault-pre pre {
      padding: 0;
      margin: 0;
      border-radius: 0;
      overflow: visible;
      overflow: initial;
    }

/* 编辑器内的有序列表结构是扁平的，对不同级的列表项需要模拟缩进样式 */

.DraftEditor-root .public-DraftStyleDefault-unorderedListItem,
  .DraftEditor-root .public-DraftStyleDefault-orderedListItem {
    margin: 0;
  }

.DraftEditor-root .public-DraftStyleDefault-unorderedListItem.public-DraftStyleDefault-depth1, .DraftEditor-root .public-DraftStyleDefault-orderedListItem.public-DraftStyleDefault-depth1 {
      margin-left: calc(1.15em * 1);
    }

.DraftEditor-root .public-DraftStyleDefault-unorderedListItem.public-DraftStyleDefault-depth2, .DraftEditor-root .public-DraftStyleDefault-orderedListItem.public-DraftStyleDefault-depth2 {
      margin-left: calc(1.15em * 2);
    }

.DraftEditor-root .public-DraftStyleDefault-unorderedListItem.public-DraftStyleDefault-depth3, .DraftEditor-root .public-DraftStyleDefault-orderedListItem.public-DraftStyleDefault-depth3 {
      margin-left: calc(1.15em * 3);
    }

.DraftEditor-root .public-DraftStyleDefault-unorderedListItem.public-DraftStyleDefault-depth4, .DraftEditor-root .public-DraftStyleDefault-orderedListItem.public-DraftStyleDefault-depth4 {
      margin-left: calc(1.15em * 4);
    }

/* 重置 ztext 列表样式 */

.DraftEditor-root .public-DraftStyleDefault-ul,
  .DraftEditor-root .public-DraftStyleDefault-ol {
    display: block;
  }

.DraftEditor-root .public-DraftStyleDefault-ul > li, .DraftEditor-root .public-DraftStyleDefault-ol > li {
      display: flex;
    }

.DraftEditor-root .public-DraftStyleDefault-ul > li::before, .DraftEditor-root .public-DraftStyleDefault-ol > li::before {
        display: inline;
        display: initial;
      }

/* 编辑器内的有序列表结构是扁平的，对不同级的列表项需要重置序号，注意确保 200+ 项目符号显示正确 */

.DraftEditor-root .public-DraftStyleDefault-orderedListItem {
    list-style-type: none;
  }

.DraftEditor-root .public-DraftStyleDefault-orderedListItem.public-DraftStyleDefault-depth0.public-DraftStyleDefault-reset {
        counter-reset: ol0;
      }

.DraftEditor-root .public-DraftStyleDefault-orderedListItem.public-DraftStyleDefault-depth0::before {
        content: counter(ol0) '. ';
        counter-increment: ol0;
      }

.DraftEditor-root .public-DraftStyleDefault-orderedListItem.public-DraftStyleDefault-depth1.public-DraftStyleDefault-reset {
        counter-reset: ol1;
      }

.DraftEditor-root .public-DraftStyleDefault-orderedListItem.public-DraftStyleDefault-depth1::before {
        content: counter(ol1) '. ';
        counter-increment: ol1;
      }

.DraftEditor-root .public-DraftStyleDefault-orderedListItem.public-DraftStyleDefault-depth2.public-DraftStyleDefault-reset {
        counter-reset: ol2;
      }

.DraftEditor-root .public-DraftStyleDefault-orderedListItem.public-DraftStyleDefault-depth2::before {
        content: counter(ol2) '. ';
        counter-increment: ol2;
      }

.DraftEditor-root .public-DraftStyleDefault-orderedListItem.public-DraftStyleDefault-depth3.public-DraftStyleDefault-reset {
        counter-reset: ol3;
      }

.DraftEditor-root .public-DraftStyleDefault-orderedListItem.public-DraftStyleDefault-depth3::before {
        content: counter(ol3) '. ';
        counter-increment: ol3;
      }

.DraftEditor-root .public-DraftStyleDefault-orderedListItem.public-DraftStyleDefault-depth4.public-DraftStyleDefault-reset {
        counter-reset: ol4;
      }

.DraftEditor-root .public-DraftStyleDefault-orderedListItem.public-DraftStyleDefault-depth4::before {
        content: counter(ol4) '. ';
        counter-increment: ol4;
      }

/**
  * IE/Edge 中禁用代码块的水平滚动条
  * 如果 IE/Edge 在 contenteditable 内部元素使用 overflow 样式，将出现一种 controlselect 行为：
  * 聚焦到此元素内后，无法移出光标；IE 同时会生成一个 resize 选择框，任何操作都无法移出焦点
  * IE/Edge only selector hack http://browserhacks.com/
  */
/* stylelint-disable-next-line */
_:-ms-lang(x),
pre.public-DraftStyleDefault-pre,
pre.public-DraftStyleDefault-pre pre {
  overflow: visible;
  overflow: initial;
  word-wrap: break-word;
}
/* stylelint-disable */
/**
   * prism.js default theme for JavaScript, CSS and HTML
   * Based on dabblet (http://dabblet.com)
   * @author Lea Verou
   */
.DraftEditor-root code[class*='language-'],
  .DraftEditor-root pre[class*='language-'] {
    color: black;
    background: none;
    text-shadow: 0 1px white;
    font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;
    text-align: left;
    white-space: pre;
    word-spacing: normal;
    word-break: normal;
    word-wrap: normal;
    line-height: 1.5;

    -moz-tab-size: 4;
    -o-tab-size: 4;
    tab-size: 4;

    -webkit-hyphens: none;
    -ms-hyphens: none;
    hyphens: none;
  }
.DraftEditor-root pre[class*='language-']::-moz-selection,
  .DraftEditor-root pre[class*='language-'] ::-moz-selection,
  .DraftEditor-root code[class*='language-']::-moz-selection,
  .DraftEditor-root code[class*='language-'] ::-moz-selection {
    text-shadow: none;
    background: #BFBFBF;
  }
html[data-theme="dark"] .DraftEditor-root pre[class*='language-']::-moz-selection, html[data-theme="dark"] .DraftEditor-root pre[class*='language-'] ::-moz-selection, html[data-theme="dark"] .DraftEditor-root code[class*='language-']::-moz-selection, html[data-theme="dark"] .DraftEditor-root code[class*='language-'] ::-moz-selection {
    background: #808080;
}
.DraftEditor-root pre[class*='language-']::-moz-selection,
  .DraftEditor-root pre[class*='language-'] ::-moz-selection,
  .DraftEditor-root code[class*='language-']::-moz-selection,
  .DraftEditor-root code[class*='language-'] ::-moz-selection {
    text-shadow: none;
    background: #BFBFBF;
  }
.DraftEditor-root pre[class*='language-']::selection,
  .DraftEditor-root pre[class*='language-'] ::selection,
  .DraftEditor-root code[class*='language-']::selection,
  .DraftEditor-root code[class*='language-'] ::selection {
    text-shadow: none;
    background: #BFBFBF;
  }
html[data-theme="dark"] .DraftEditor-root pre[class*='language-']::-moz-selection, html[data-theme="dark"] .DraftEditor-root pre[class*='language-'] ::-moz-selection, html[data-theme="dark"] .DraftEditor-root code[class*='language-']::-moz-selection, html[data-theme="dark"] .DraftEditor-root code[class*='language-'] ::-moz-selection {
    background: #808080;
}
html[data-theme="dark"] .DraftEditor-root pre[class*='language-']::selection, html[data-theme="dark"] .DraftEditor-root pre[class*='language-'] ::selection, html[data-theme="dark"] .DraftEditor-root code[class*='language-']::selection, html[data-theme="dark"] .DraftEditor-root code[class*='language-'] ::selection {
    background: #808080;
}
@media print {
    .DraftEditor-root code[class*='language-'],
    .DraftEditor-root pre[class*='language-'] {
      text-shadow: none;
    }
  }
/* Code blocks */
.DraftEditor-root pre[class*='language-'] {
    padding: 1em;
    margin: 0.5em 0;
    overflow: auto;
  }
.DraftEditor-root :not(pre) > code[class*='language-'],
  .DraftEditor-root pre[class*='language-'] {
    background: #F6F6F6;
  }
html[data-theme="dark"] .DraftEditor-root :not(pre) > code[class*='language-'], html[data-theme="dark"] .DraftEditor-root pre[class*='language-'] {
    background: #2E2E2E;
}
/* Inline code */
.DraftEditor-root :not(pre) > code[class*='language-'] {
    padding: 0.1em;
    border-radius: 0.3em;
    white-space: normal;
  }
.DraftEditor-root .token.comment,
  .DraftEditor-root .token.prolog,
  .DraftEditor-root .token.doctype,
  .DraftEditor-root .token.cdata {
    color: slategray;
  }
.DraftEditor-root .token.punctuation {
    color: #999999;
  }
html[data-theme="dark"] .DraftEditor-root .token.punctuation {
    color: #646464;
}
.DraftEditor-root .namespace {
    opacity: 0.7;
  }
.DraftEditor-root .token.property,
  .DraftEditor-root .token.tag,
  .DraftEditor-root .token.boolean,
  .DraftEditor-root .token.number,
  .DraftEditor-root .token.constant,
  .DraftEditor-root .token.symbol,
  .DraftEditor-root .token.deleted {
    color: #FF3366;
  }
html[data-theme="dark"] .DraftEditor-root .token.property, html[data-theme="dark"] .DraftEditor-root .token.tag, html[data-theme="dark"] .DraftEditor-root .token.boolean, html[data-theme="dark"] .DraftEditor-root .token.number, html[data-theme="dark"] .DraftEditor-root .token.constant, html[data-theme="dark"] .DraftEditor-root .token.symbol, html[data-theme="dark"] .DraftEditor-root .token.deleted {
    color: #D92155;
}
.DraftEditor-root .token.selector,
  .DraftEditor-root .token.attr-name,
  .DraftEditor-root .token.string,
  .DraftEditor-root .token.char,
  .DraftEditor-root .token.builtin,
  .DraftEditor-root .token.inserted {
    color: #808080;
  }
html[data-theme="dark"] .DraftEditor-root .token.selector, html[data-theme="dark"] .DraftEditor-root .token.attr-name, html[data-theme="dark"] .DraftEditor-root .token.string, html[data-theme="dark"] .DraftEditor-root .token.char, html[data-theme="dark"] .DraftEditor-root .token.builtin, html[data-theme="dark"] .DraftEditor-root .token.inserted {
    color: #808080;
}
.DraftEditor-root .token.operator,
  .DraftEditor-root .token.entity,
  .DraftEditor-root .token.url,
  .DraftEditor-root .language-css .token.string,
  .DraftEditor-root .style .token.string {
    color: #C2A469;
    background: rgba(255, 255, 255, 0.5);
  }
html[data-theme="dark"] .DraftEditor-root .token.operator, html[data-theme="dark"] .DraftEditor-root .token.entity, html[data-theme="dark"] .DraftEditor-root .token.url, html[data-theme="dark"] .DraftEditor-root .language-css .token.string, html[data-theme="dark"] .DraftEditor-root .style .token.string {
    color: #806E46;
}
html[data-theme="dark"] .DraftEditor-root .token.operator, html[data-theme="dark"] .DraftEditor-root .token.entity, html[data-theme="dark"] .DraftEditor-root .token.url, html[data-theme="dark"] .DraftEditor-root .language-css .token.string, html[data-theme="dark"] .DraftEditor-root .style .token.string {
    background: rgba(26, 26, 26, 0.5);
}
.DraftEditor-root .token.atrule,
  .DraftEditor-root .token.attr-value,
  .DraftEditor-root .token.keyword {
    color: #0084FF;
  }
html[data-theme="dark"] .DraftEditor-root .token.atrule, html[data-theme="dark"] .DraftEditor-root .token.attr-value, html[data-theme="dark"] .DraftEditor-root .token.keyword {
    color: #3A76D0;
}
.DraftEditor-root .token.function {
    color: #FF3366;
  }
html[data-theme="dark"] .DraftEditor-root .token.function {
    color: #D92155;
}
.DraftEditor-root .token.regex,
  .DraftEditor-root .token.important,
  .DraftEditor-root .token.variable {
    color: #FF9607;
  }
html[data-theme="dark"] .DraftEditor-root .token.regex, html[data-theme="dark"] .DraftEditor-root .token.important, html[data-theme="dark"] .DraftEditor-root .token.variable {
    color: #FF9607;
}
.DraftEditor-root .token.important,
  .DraftEditor-root .token.bold {
    /* 与设计一致，不支持设备将回退为 700 */
    font-weight: 600;
    /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
    font-synthesis: style;
  }
html[data-ios] .DraftEditor-root .token.important, html[data-ios] .DraftEditor-root .token.bold {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }
html[data-android] .DraftEditor-root .token.important, html[data-android] .DraftEditor-root .token.bold {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }
.DraftEditor-root .token.italic {
    font-style: italic;
  }
.DraftEditor-root .token.entity {
    cursor: help;
  }
.CommentEditor .RichText {
    min-height: auto !important;
  }
  .CommentEditor--normal {
    position: relative;
    transition: padding-right 300ms 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);
  transition: opacity 300ms ease, -webkit-transform 300ms ease;
  transition: opacity 300ms ease, transform 300ms ease;
  transition: opacity 300ms ease, transform 300ms ease, -webkit-transform 300ms ease;
}

.CommentEditor-singleButton:disabled {
    cursor: not-allowed;
  }

.CommentEditor-input {
  font-size: 15px;
}

.CommentEditor-input .Editable {
    background: #F6F6F6;
  }

.CommentEditor-input .Editable--focus {
      background: #FFFFFF;
    }

html[data-theme="dark"] .CommentEditor-input .Editable--focus {
      background: #1A1A1A;
}

html[data-theme="dark"] .CommentEditor-input .Editable {
    background: #2E2E2E;
}

.CommentEditor-input .Dropzone {
    min-height: auto !important;
  }

.CommentEditor-input .DraftEditor-root {
    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: #FFFFFF;
  }

html[data-theme="dark"] .CommentEditor-input--mobile .Editable {
    background: #1A1A1A;
}

.CommentEditor-modalButtons {
  display: flex;
  padding: 8px 20px;
  border-top: 1px solid #EBEBEB;
  border-bottom: 1px solid #EBEBEB;
}

.CommentEditor-modalButtons .Button {
    flex: 1;
  }

.CommentEditor-modalButtons .Button + .Button {
      margin-left: 16px;
    }

html[data-theme="dark"] .CommentEditor-modalButtons {
  border-top: 1px solid #444444;
}

html[data-theme="dark"] .CommentEditor-modalButtons {
  border-bottom: 1px solid #444444;
}
.SignInModal .MobileModal-title {
  padding-bottom: 0;
}

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

html[data-theme="dark"] .SignInModal-openInAppButton {
  color: #1A1A1A;
}

html[data-theme="dark"] .SignInModal-openInAppButton {
  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: #FFFFFF;
  border-color: #0084FF;
  color: #0084FF;
}

html[data-theme="dark"] .SignInModal-button-zhihu {
  background-color: #1A1A1A;
}

html[data-theme="dark"] .SignInModal-button-zhihu {
  border-color: #3A76D0;
}

html[data-theme="dark"] .SignInModal-button-zhihu {
  color: #3A76D0;
}

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

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

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

html[data-theme="dark"] .SignInModal-button-weibo {
  color: #1A1A1A;
}

.SignInModal-button-wechat {
  background-color: #BFBFBF;
  border-color: #BFBFBF;
  color: #FFFFFF;
}

html[data-theme="dark"] .SignInModal-button-wechat {
  background-color: #444444;
}

html[data-theme="dark"] .SignInModal-button-wechat {
  border-color: #444444;
}

html[data-theme="dark"] .SignInModal-button-wechat {
  color: #1A1A1A;
}

.SignInModal-button-qq {
  background-color: #0084FF;
  border-color: #0084FF;
  color: #FFFFFF;
}

html[data-theme="dark"] .SignInModal-button-qq {
  background-color: #3A76D0;
}

html[data-theme="dark"] .SignInModal-button-qq {
  border-color: #3A76D0;
}

html[data-theme="dark"] .SignInModal-button-qq {
  color: #1A1A1A;
}
.ReportInfringement {
  margin-top: -12px;
}

.ReportInfringement--mobile {
  margin-top: 0;
  padding: 20px;
}

.ReportInfringement-subtitle {
  margin-bottom: 20px;
  font-size: 12px;
  line-height: 20px;
  color: #8590A6;
}

html[data-theme="dark"] .ReportInfringement-subtitle {
  color: #606A80;
}

.ReportInfringement-item {
  display: flex;
  align-items: flex-start;
}

.ReportInfringement-item:nth-child(2) {
    padding-top: 10px;
    margin-bottom: 17px;
    border-top: 1px solid #F6F6F6;
  }

html[data-theme="dark"] .ReportInfringement-item:nth-child(2) {
    border-top: 1px solid #2E2E2E;
}

.ReportInfringement-link {
  color: #0084FF;
}

html[data-theme="dark"] .ReportInfringement-link {
  color: #3A76D0;
}

.ReportInfringement-image {
  display: block;
  flex-basis: 80px;
  height: 80px;
  margin-right: 16px;
}

.ReportInfringement-item {
  padding: 0 8px 0 10px;
  margin-bottom: 10px;
}

.ReportInfringement-itemTitle {
  margin-bottom: 10px;
  font-size: 16px;
  line-height: 24px;
  color: #1A1A1A;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
}

html[data-ios] .ReportInfringement-itemTitle {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .ReportInfringement-itemTitle {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

html[data-theme="dark"] .ReportInfringement-itemTitle {
  color: #999999;
}

.ReportInfringement-itemDescription {
  font-size: 12px;
  line-height: 20px;
  color: #444444;
}

html[data-theme="dark"] .ReportInfringement-itemDescription {
  color: #808080;
}

.ReportInfringement-arrow {
  flex-basis: 24px;
  height: 24px;
  min-width: 24px;
  margin-left: 16px;
}
.ReportOrgContent {
  width: 352px;
  height: 48px;
  margin-top: 1em;
  font-size: 14px;
  line-height: 24px;
  color: #646464;
}
  html[data-theme="dark"] .ReportOrgContent {
  color: #999999;
}

.ReportOrgContent-highlight {
  color: #FF9607;
}

html[data-theme="dark"] .ReportOrgContent-highlight {
  color: #FF9607;
}
.ReportInfringementMobile {
  padding: 20px;
}

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

.ReportInfringementMobile-text {
  font-size: 15px;
  line-height: 1.7;
  color: #1A1A1A;
}

.ReportInfringementMobile-text + .ReportInfringementMobile-text {
    margin-top: 1em;
  }

html[data-theme="dark"] .ReportInfringementMobile-text {
  color: #999999;
}

.ReportInfringementMobile-img {
  margin-top: 1em;
  margin-bottom: 5em;
  display: block;
  width: 100%;
}

.ReportInfringementMobile-link {
  color: #0084FF;
}

html[data-theme="dark"] .ReportInfringementMobile-link {
  color: #3A76D0;
}

.ReportInfringementMobile-bold {
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
}

html[data-ios] .ReportInfringementMobile-bold {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .ReportInfringementMobile-bold {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }
.ReportDeclare-description {
  font-size: 14px;
  line-height: 24px;
  color: #1A1A1A;
}

  .ReportDeclare-description a {
    color: #0084FF;
  }

  html[data-theme="dark"] .ReportDeclare-description a {
    color: #3A76D0;
}

  html[data-theme="dark"] .ReportDeclare-description {
  color: #999999;
}

.ReportDeclare-mobileButton {
  display: block;
  width: 100%;
}

.ReportDeclare-mobileText {
  font-size: 15px;
  line-height: 1.7;
  color: #1A1A1A;
}

.ReportDeclare-mobileText + .ReportDeclare-mobileText {
    margin-top: 1em;
  }

html[data-theme="dark"] .ReportDeclare-mobileText {
  color: #999999;
}

.ReportDeclare-mobileImg {
  margin-top: 1em;
  margin-bottom: 5em;
  display: block;
  width: 100%;
}
.ReportTrespass-description {
  font-size: 14px;
  line-height: 24px;
  color: #1A1A1A;
}
  .ReportTrespass-description a {
    color: #0084FF;
  }
  html[data-theme="dark"] .ReportTrespass-description a {
    color: #3A76D0;
}
  html[data-theme="dark"] .ReportTrespass-description {
  color: #999999;
}
.ReportOption-check {
  font-size: 14px;
  color: #8590A6;
}

  .ReportOption-check input {
    margin-right: 8px;
  }

  html[data-theme="dark"] .ReportOption-check {
  color: #606A80;
}

.ReportOption-desc {
  font-size: 14px;
  color: #999999;
}

html[data-theme="dark"] .ReportOption-desc {
  color: #646464;
}
.ReportMenu-inner {
  margin-bottom: 30px;
  font-size: 14px;
  line-height: 1.75;
}

.ReportMenu-mobile .ReportMenu-inner:not(.ReportMenu-options) {
  padding-top: 18px;
}

.ReportMenu-item {
  display: flex;
  width: 100%;
  align-items: center;
  padding: 12px 0;
  text-align: left;
  cursor: pointer;
  border-bottom: 1px solid #F6F6F6;
  outline: none;
}

html[data-theme="dark"] .ReportMenu-item {
  border-bottom: 1px solid #2E2E2E;
}

.ReportMenu-itemValue {
  flex: 1;
}

.ReportMenu-itemCheck {
  position: absolute;
  width: 0;
  height: 0;
  opacity: 0;
}

.ReportMenu-itemCheck:checked + .ReportMenu-itemCheckIcon {
    opacity: 1;
  }

.ReportMenu-itemCheckIcon {
  fill: #0084FF;
  opacity: 0;
  transition: opacity 200ms;
}

html[data-theme="dark"] .ReportMenu-itemCheckIcon {
  fill: #3A76D0;
}

.ReportMenu-paragraph {
  white-space: pre-wrap;
  list-style: none;
}

.ReportMenu-paragraph--light {
  margin-top: 1em;
  color: #8590A6;
}

html[data-theme="dark"] .ReportMenu-paragraph--light {
  color: #606A80;
}

.ReportMenu-textarea {
  width: 100%;
}

.ReportMenu-link {
  color: #175199;
}

.ReportMenu-link:hover {
    text-decoration: underline;
  }

html[data-theme="dark"] .ReportMenu-link {
  color: #175199;
}

.ReportMenu-link--light {
  text-decoration: underline;
}

.ReportMenu-errorText {
  width: 100%;
  margin-top: 16px;
  color: #F1403C;
  font-size: 15px;
  text-align: right;
}

html[data-theme="dark"] .ReportMenu-errorText {
  color: #B7302D;
}
.WalleModal-wrapper {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  padding: 0 15px;
}

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

html[data-theme="dark"] .WalleModal-des {
  color: #808080;
}

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

.WalleModal-open {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.WalleModal-content {
  width: 60%;
}

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

@media only screen and (min-device-width: 320px) {

.WalleModal-title {
    font-size: 15px
}
  }

html[data-theme="dark"] .WalleModal-title {
  color: #808080;
}

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

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

.WalleModal-btn {
  width: 92px;
  height: 32px;
}
.NumberBoard {
  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 #444444;
}

.NumberBoard-item {
  flex: 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 {
        color: #175199;
      }

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;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
}

html[data-ios] .NumberBoard-itemValue {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .NumberBoard-itemValue {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

html[data-theme="dark"] .NumberBoard-itemValue {
  color: #999999;
}
.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-title,
.HoverCard-subtitle {
  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: flex;
  padding: 8px 0;
  border-bottom: 1px solid #F6F6F6;
  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 #FFFFFF;
}

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

.HoverCard-titleText {
  display: flex;
  min-height: 42px;
  padding-bottom: 2px;
  margin-left: 84px;
  flex-direction: column;
  justify-content: center;
  overflow: hidden;
  flex: 1;
}

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

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

html[data-theme="dark"] .HoverCard-attrInfo {
  color: #606A80;
}
.HoverCard {
  padding: 0 12px 16px;
  font-size: 14px;
  opacity: 1;
  transition: opacity 300ms ease;
}

  .HoverCard--isLoading {
    opacity: 0;
  }

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

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

  html[data-theme="dark"] .HoverCard, html[data-theme="dark"] .HoverCard-loading {
    background: #1A1A1A;
}

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

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

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

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

.HoverCard-numberBoard {
  display: flex;
  justify-content: space-around;
  align-items: center;
}

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

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

.HoverCard-numberGroup {
  flex: 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: #999999;
}

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

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

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

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

.HoverCard-description {
  display: block; /* Fallback for non-webkit */
  display: -webkit-box;
  max-height: calc(1.75 * 3 * 14px); /* Fallback for non-webkit */
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-line-clamp: 3;
}

.HoverCard-separate {
  color: #EBEBEB;
}

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

.HoverCard-popoverTarget {
  border-width: 0;
  background: transparent;
  box-shadow: none;
}
.FollowButton {
  min-width: 96px;
}

.FollowButton-icon {
  margin-right: 8px;
  fill: currentColor;
}
.ModifyButton {
  font-size: 15px;
}

.ModifyButton-icon {
  margin-right: 4px;
  fill: currentColor;
}
.Messages-menu {
  width: 360px;
  padding: 0;
  overflow: hidden;
}

.Messages-newItem {
  background: #F6F6F6;
}

html[data-theme="dark"] .Messages-newItem {
  background: #2E2E2E;
}

.Messages-header {
  display: flex;
  border-bottom: 1px solid #EBEBEB;
}

html[data-theme="dark"] .Messages-header {
  border-bottom: 1px solid #444444;
}

.Messages-tab {
  position: relative;
  flex: 1;
  height: 48px;
  font-size: 14px;
  color: #8590A6;
  cursor: pointer;
}

html[data-theme="dark"] .Messages-tab {
  color: #606A80;
}

.Messages-currentTab {
  color: #1A1A1A;
}

.Messages-currentTab:hover {
    color: currentColor;
  }

html[data-theme="dark"] .Messages-currentTab {
  color: #999999;
}

.Messages-myMessageTab {
  width: 360px;
  color: #1A1A1A;
}

html[data-theme="dark"] .Messages-myMessageTab {
  color: #999999;
}

.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: #444444;
}

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

.Messages-withNoTabList {
  height: 408px;
}

.Messages-item {
  position: relative;
  display: flex;
  align-items: center;
  padding: 15px;
  font-size: 14px;
  line-height: 24px;
  color: #1A1A1A;
}

.Messages-item:hover {
    background-color: #F6F6F6;
  }

html[data-theme="dark"] .Messages-item:hover {
    background-color: #2E2E2E;
}

.Messages-item .Avatar {
    display: block;
  }

html[data-theme="dark"] .Messages-item {
  color: #999999;
}

.Messages-user {
  flex: 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 {
  display: flex;
  flex-direction: column;
  min-height: 274px;
}

.Messages-footer {
  display: flex;
  justify-content: space-between;
  height: 40px;
  padding: 0 16px;
  line-height: 40px;
  background: #FFFFFF;
  border-top: 1px solid #EBEBEB;
  box-sizing: border-box;
}

html[data-theme="dark"] .Messages-footer {
  background: #1A1A1A;
}

html[data-theme="dark"] .Messages-footer {
  border-top: 1px solid #444444;
}

.Messages-receiver {
  display: flex;
  justify-content: space-between;
  height: 36px;
  margin-top: 8px;
  line-height: 36px;
}

.Messages-receiverInfo {
  display: flex;
  height: 36px;
  align-items: center;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
  line-height: 36px;
}

html[data-ios] .Messages-receiverInfo {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .Messages-receiverInfo {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

.Messages-receiverAutoComplete {
  position: relative;
  margin-top: 8px;
}

.Messages-records {
  color: #175199;
}

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;
  transition: opacity 200ms;
}

.Messages-warning.is-shown {
    opacity: 1;
  }

html[data-theme="dark"] .Messages-warning {
  color: #B7302D;
}

.Messages-input {
  width: 352px;
}

.Messages-icon {
  cursor: pointer;
}

.Messages-count {
  position: absolute;
  bottom: 50%;
  left: 50%;
  padding: 0 4px;
  font-size: 11px;
  color: #FFFFFF;
  background-color: #F1403C;
  border: 2px solid #FFFFFF;
  border-radius: 20px;
}

html[data-theme="dark"] .Messages-count {
  color: #1A1A1A;
}

html[data-theme="dark"] .Messages-count {
  background-color: #B7302D;
}

html[data-theme="dark"] .Messages-count {
  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%);
}
.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;
}
  html[data-theme="dark"] .FollowStatus {
  background-color: #2E2E2E;
}
.UserHoverCard-infoItem {
  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: #444444;
}

.UserHoverCard-mutuals {
  color: #8590A6;
}

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

.UserHoverCard-orgBadge {
  margin-left: 6px;
  vertical-align: 2px;
}
.UserLink-badge {
  margin-left: 0.3em;
}

.UserLink-vipIcon {
  align-items: center;
  display: flex;
  height: 14px;
  justify-content: center;
  margin-left: 0.3em;
  width: 14px;
}

.UserLink-vipIcon img {
    height: 100%;
    width: 100%;
  }
.GifPlayer {
  position: relative;
  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;
}
  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, 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;
  transition: 0.3s ease-out;
  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(0.3);
            transform: scale(0.3);
    opacity: 0;
  }
.RichText-video {
  margin: 16px 0;
}
.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;
  }
.CommentItem {
  /* flex bug for Safari 9, see: https://github.com/philipwalton/flexbugs#1-minimum-content-sizing-of-flex-items-not-honored */
  position: relative;
  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-style: solid;
    border-bottom-color: #F6F6F6;
    border-bottom-width: 1px;
    content: '';
  }

  @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {

  .CommentItem:not(:first-child)::after {
    border-bottom-width: calc(1px / 2);
  }
  }

  @media (-webkit-min-device-pixel-ratio: 3), (min-resolution: 288dpi) {

  .CommentItem:not(:first-child)::after {
    border-bottom-width: calc(1px / 3);
  }
  }

  @media (-webkit-min-device-pixel-ratio: 4), (min-resolution: 384dpi) {

  .CommentItem:not(:first-child)::after {
    border-bottom-width: calc(1px / 4);
  }
  }

  html[data-theme="dark"] .CommentItem:not(:first-child)::after {
    border-bottom-color: #2E2E2E;
}

.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-roleInfo,
.CommentItem-reply {
  color: #8590A6;
}

html[data-theme="dark"] .CommentItem-roleInfo, html[data-theme="dark"] .CommentItem-reply {
  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: flex;
  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;
  transition: opacity 0.2s;
}

.CommentItem:hover .CommentItem-hoverBtn {
    opacity: 1;
  }

.CommentItem-walleTag {
  display: flex;
  align-items: 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;
  }

.CommentItem-likeBtn.is-liked:hover {
      color: #175199;
    }

.CommentItem-likeBtn.is-liked:hover .Icon {
        fill: currentColor;
      }

html[data-theme="dark"] .CommentItem-likeBtn.is-liked:hover {
      color: #175199;
}

.CommentItem-likeBtn.is-liked .Icon {
      fill: currentColor;
    }

html[data-theme="dark"] .CommentItem-likeBtn.is-liked {
    color: #3A76D0;
}

.CommentItem--highlighted {
  -webkit-animation: highlight 1600ms ease-out;
          animation: highlight 1600ms ease-out;
}

@-webkit-keyframes highlight {
  from {
    background: #EBEBEB;
  }
    html[data-theme="dark"] from {
    background: #444444;
  }

  to {
    background: transparent none repeat 0 0 / auto auto padding-box border-box scroll;
    background: initial;
  }
}

@keyframes highlight {
  from {
    background: #EBEBEB;
  }
    html[data-theme="dark"] from {
    background: #444444;
  }

  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;

  /* 与设计一致，不支持设备将回退为 700 */

  font-weight: 600;

  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */

  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 {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .CommentItem-userLink {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

.CommentItem-menu-item {
  padding-top: 13px;
  padding-bottom: 13px;
}
.Comments-pattern-loading {
  height: 96px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.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;
}

.Tabs-link.is-active {
    /* 与设计一致，不支持设备将回退为 700 */
    font-weight: 600;
    /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
    font-synthesis: style;
  }

html[data-ios] .Tabs-link.is-active {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .Tabs-link.is-active {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    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;
}

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

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

html[data-theme="dark"] .Tabs-meta {
  color: #646464;
}
.Topbar {
  background: #FFFFFF;
  border-bottom: 1px solid #F6F6F6;
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 50px;
  padding: 0 20px;
}
  html[data-theme="dark"] .Topbar {
  background: #1A1A1A;
}
  html[data-theme="dark"] .Topbar {
  border-bottom: 1px solid #2E2E2E;
}

.Topbar-title {
  flex: 1;
}

.Topbar--mobile .Topbar-title {
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
}

html[data-ios] .Topbar--mobile .Topbar-title {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .Topbar--mobile .Topbar-title {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

.Topbar--mobile .Topbar-title button {
    font-weight: normal;
    margin-left: 13px;
  }
.CommentTopbar-title {
  display: inline-block;
  font-size: 15px;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
  color: #1A1A1A;
}
  html[data-ios] .CommentTopbar-title {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }
  html[data-android] .CommentTopbar-title {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }
  html[data-theme="dark"] .CommentTopbar-title {
  color: #999999;
}

.CommentTopbar-back {
  font-size: 16px;
  font-weight: inherit;
  color: #1A1A1A;
}

.CommentTopbar-back:hover {
    color: #0084FF;
  }

html[data-theme="dark"] .CommentTopbar-back:hover {
    color: #3A76D0;
}

html[data-theme="dark"] .CommentTopbar-back {
  color: #999999;
}

.CommentTopbar-backIcon {
  vertical-align: -2px;
  fill: currentColor;
}
.CommentTopbar {
  border-radius: 2px;
}

.CommentTopbar-meta {
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 50px;
  padding: 0 16px;
}

.CommentTopbar-tabsWrapper {
  display: flex;
  font-size: 15px;
  align-items: center;
}

.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;
  }
.Comments-container {
  height: 100%;
}

.Comments {
  display: flex;
  flex-direction: column;
  height: 100%;
  overflow: hidden;
  box-sizing: border-box;
}

.Comments--hidden {
    display: none;
  }

.Comments-titleLink a {
    color: #175199;
  }

.Comments-titleLink a:hover {
    border-bottom: 1px solid #175199;
  }

html[data-theme="dark"] .Comments-titleLink a:hover {
    border-bottom: 1px solid #175199;
}

html[data-theme="dark"] .Comments-titleLink a {
    color: #175199;
}

.CommentList {
  flex: 1;
  overflow-x: hidden;
  overflow-y: auto;
}

.CommentList-divider {
  position: relative;
  margin: 0 24px;
  font-size: 14px;
  color: #8590A6;
  text-align: center;
}

.CommentList-divider:first-child {
    margin-top: 16px;
  }

.CommentList-divider:last-child {
    margin-bottom: 16px;
  }

.CommentList-divider + .CommentItem::after {
    content: none;
  }

.CommentList-divider a {
    color: #175199;
  }

.CommentList-divider a:hover {
    border-bottom: 1px solid #175199;
  }

html[data-theme="dark"] .CommentList-divider a:hover {
    border-bottom: 1px solid #175199;
}

html[data-theme="dark"] .CommentList-divider a {
    color: #175199;
}

html[data-theme="dark"] .CommentList-divider {
  color: #606A80;
}

.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 #444444;
}

.CommentList-dividerText {
  position: relative;
  z-index: 2;
  display: inline-block;
  padding: 0 1em;
  background-color: #FFFFFF;
}

.CommentList-dividerText .CommentList-questionMark {
    margin-left: 8px;
  }

html[data-theme="dark"] .CommentList-dividerText {
  background-color: #1A1A1A;
}

.Comments-footer {
  padding: 12px 20px;
  background: #FFFFFF;
  border-top: 1px solid #EBEBEB;
}

html[data-theme="dark"] .Comments-footer {
  background: #1A1A1A;
}

html[data-theme="dark"] .Comments-footer {
  border-top: 1px solid #444444;
}

.Comments-disabledText {
  display: flex;
  padding: 14px 12px;
  color: #8590A6;
  background-color: #F6F6F6;
  border-top: 1px solid #F6F6F6;
  box-sizing: border-box;
  align-items: center;
  justify-content: center;
}

html[data-theme="dark"] .Comments-disabledText {
  color: #606A80;
}

html[data-theme="dark"] .Comments-disabledText {
  background-color: #2E2E2E;
}

html[data-theme="dark"] .Comments-disabledText {
  border-top: 1px solid #2E2E2E;
}

.Comments-disabledText--fixed {
  position: fixed;
  width: 100%;
  bottom: 0;
  background: #FFFFFF;
}

.Comments-disabledText--fixed .Comments-disabledReason {
    padding-top: 8px;
    padding-bottom: 8px;
    background: #F6F6F6;
    width: 100%;
    text-align: center;
    border-radius: 3px;
  }

html[data-theme="dark"] .Comments-disabledText--fixed .Comments-disabledReason {
    background: #2E2E2E;
}

html[data-theme="dark"] .Comments-disabledText--fixed {
  background: #1A1A1A;
}

.CommentList-action {
  position: relative;
  padding: 16px 0;
  text-align: center;
}

.CommentList-action::after {
    position: absolute;
    top: 0;
    display: block;
    width: calc(100% - 48px);
    border-bottom: 1px solid #F6F6F6;
    content: '';
  }

html[data-theme="dark"] .CommentList-action::after {
    border-bottom: 1px solid #2E2E2E;
}

.CommentList-action a {
    color: #175199;
  }

.CommentList-action a:hover {
    border-bottom: 1px solid #175199;
  }

html[data-theme="dark"] .CommentList-action a:hover {
    border-bottom: 1px solid #175199;
}

html[data-theme="dark"] .CommentList-action a {
    color: #175199;
}

.Comments-withPagination {
  border: 1px solid #EBEBEB;
  box-shadow: 0 1px 3px rgba(26, 26, 26, 0.1);
  background: #FFFFFF;
  margin-top: 12px;
  overflow: visible;
  border-radius: 4px;
}

html[data-theme='dark'] .Comments-withPagination {
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
  }

.Comments-withPagination .CommentList {
    overflow-y: visible;
  }

html[data-theme="dark"] .Comments-withPagination {
  border: 1px solid #444444;
}

html[data-theme="dark"] .Comments-withPagination {
  background: #1A1A1A;
}

.comments-pagination {
  border-top: 1px solid #EBEBEB;
}

html[data-theme="dark"] .comments-pagination {
  border-top: 1px solid #444444;
}

.Comments-Packup-Button {
  background: rgba(235, 235, 235, 0.95);
  border-radius: 3px;
  position: fixed;
  height: 30px;
  width: 93px;
  bottom: 30px;
  left: 570px;
  font-size: 13px;
  color: #8590A6;
  letter-spacing: 0;
  margin-left: -93px;
}

.Comments-Packup-Button:hover {
    color: #808080;
  }

html[data-theme="dark"] .Comments-Packup-Button:hover {
    color: #808080;
}

.Comments-Packup-Button .Zi--ArrowUp {
    position: relative;
    left: 6px;
    margin-left: -6px;
  }

.Comments-Packup-Button-enter,
  .Comments-Packup-Button-leave {
    transition: opacity 0.3s;
  }

.Comments-Packup-Button-enter {
    opacity: 0;
  }

.Comments-Packup-Button-enter-active {
    opacity: 1;
  }

.Comments-Packup-Button-leave {
    opacity: 1;
  }

.Comments-Packup-Button-leave-active {
    opacity: 0;
  }

html[data-theme="dark"] .Comments-Packup-Button {
  background: rgba(68, 68, 68, 0.95);
}

html[data-theme="dark"] .Comments-Packup-Button {
  color: #606A80;
}

.Comments-empty {
  padding: 60px 0;
  flex: 1;
  box-sizing: border-box;
  overflow: auto;
}

.CommentList-expendCollapseButton {
  color: #8590A6;
  cursor: pointer;
}

.CommentList-expendCollapseButton:hover {
    color: #808080;
  }

html[data-theme="dark"] .CommentList-expendCollapseButton:hover {
    color: #808080;
}

html[data-theme="dark"] .CommentList-expendCollapseButton {
  color: #606A80;
}
/* 去掉焦点元素的外边框 */
.CommentItem {
  outline: none;
}
.UploadPicture-wrapper {
  cursor: pointer;
}

.UploadPicture-input {
  display: none;
}
.ImagePopover,
.CommentEditorV2-inputUpLoad-Icon {
  width: 24px;
  height: 24px;
}

.ImagePopover {
  margin-right: 8px;
}

.ImagePopover-imageInput {
  display: none;
  opacity: 0;
}

.ImagePopover-thumbnail {
  width: 120px;
  height: 120px;
  padding: 20px;
}

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

.ImagePopover-thumbnail .closeButton {
    position: absolute;
    width: 16px;
    height: 16px;
    right: 8px;
    top: 8px;
  }

.ImagePopover-thumbnail .Zi--Close {
    width: 16px;
    height: 16px;
  }

.ImagePopover-thumbnail img {
    width: 120px;
    height: 120px;
  }
.CommentSticker {
  font-size: 0;
}

.CommentSticker-img,
.CommentSticker-load {
  width: 48px;
  height: 48px;
  padding-bottom: 4px;
}

.CommentSticker-load {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  font-size: 9px;
  color: #D3D3D3;
  background: #F6F6F6;
}

html[data-theme="dark"] .CommentSticker-load {
  color: #2E2E2E;
}

html[data-theme="dark"] .CommentSticker-load {
  background: #2E2E2E;
}
.StickerPopover-stickers-item {
  width: 48px;
  height: 73px;
  padding: 8px;
  text-align: center;
}

  .StickerPopover-stickers-item.StickerPopover-stickers-item-single {
    width: 140px;
    height: 143px;
    position: relative;
  }

  .StickerPopover-stickers-item.StickerPopover-stickers-item-single .closeButton {
      position: absolute;
      width: 16px;
      height: 16px;
      right: 8px;
      top: 8px;
    }

  .StickerPopover-stickers-item.StickerPopover-stickers-item-single .Zi--Close {
      width: 16px;
      height: 16px;
    }

  .StickerPopover-stickers-item .VagueImage {
    padding-bottom: 4px;
  }

  .StickerPopover-stickers-item.StickerPopover-stickers-item-single img {
    width: 100px;
    height: 100px;
    padding: 20px;
  }

.StickerPopover-stickers-item p {
  width: 48px;
  line-height: 18px;
  font-size: 12px;
  color: #808080;
}

html[data-theme="dark"] .StickerPopover-stickers-item p {
  color: #808080;
}

.StickerPopover-stickers-wrap {
  overflow-y: scroll;
}

.StickerPopover-stickers-list {
  width: 384px;
  height: 200px;
  padding: 4px;
  display: flex;
  flex-wrap: wrap;
  align-content: flex-start;
}
.CommentEditorV2 .RichText {
    min-height: auto !important;
  }
  .CommentEditorV2--normal {
    position: relative;
    transition: padding-right 300ms ease;
  }
  .CommentEditorV2--normal .CommentEditorV2-input {
      overflow: hidden;
      width: 100%;
    }
  .CommentEditorV2--normal .Editable-unstyled {
      margin: 0 !important;
    }
  .CommentEditorV2--normal.CommentEditorV2--active {
      display: flex; /* hack fix safari http://jira.in.zhihu.com/browse/CFE-594 */
      padding-right: 94px;
    }
  .CommentEditorV2--normal.CommentEditorV2--active .CommentEditorV2-singleButton {
        -webkit-transform: scale(1);
                transform: scale(1);
      }
  .CommentEditorV2--inCommentItem .CommentEditorV2-actions {
      margin-top: 16px;
      text-align: right;
    }
  .CommentEditorV2--inCommentItem .CommentEditorV2-actions .Button {
        line-height: 34px;
      }
  .CommentEditorV2--inCommentItem .CommentEditorV2-actions .Button + .Button {
          margin-left: 20px;
        }

.CommentEditorV2-singleButton {
  position: absolute;
  right: 16px;
  bottom: 13px;
  line-height: 34px !important;
  -webkit-transform: scale(0);
          transform: scale(0);
  transition: opacity 300ms ease, -webkit-transform 300ms ease;
  transition: opacity 300ms ease, transform 300ms ease;
  transition: opacity 300ms ease, transform 300ms ease, -webkit-transform 300ms ease;
}

.CommentEditorV2-singleButton:disabled {
    cursor: not-allowed;
  }

.CommentEditorV2-input {
  font-size: 15px;
}

.CommentEditorV2-input .Editable {
    background: transparent;
  }

.CommentEditorV2-input .Editable--focus {
      background: transparent;
    }

.CommentEditorV2-input .Dropzone {
    min-height: auto !important;
  }

.CommentEditorV2-startCommentButton {
  width: 100%;
}

.CommentEditorV2-hiddenInput {
  position: absolute;
  z-index: -1;
  top: -9999px;
}

.CommentEditorV2-input--mobile {
  min-height: 208px;
}

.CommentEditorV2-input--mobile,
  .CommentEditorV2-input--mobile.is-focus {
    border: none;
  }

.CommentEditorV2-input--mobile .Editable {
    background: #FFFFFF;
  }

html[data-theme="dark"] .CommentEditorV2-input--mobile .Editable {
    background: #1A1A1A;
}

.CommentEditorV2-modalButtons {
  display: flex;
  padding: 8px 20px;
  border-top: 1px solid #EBEBEB;
  border-bottom: 1px solid #EBEBEB;
}

.CommentEditorV2-modalButtons .Button {
    flex: 1;
  }

.CommentEditorV2-modalButtons .Button + .Button {
      margin-left: 16px;
    }

html[data-theme="dark"] .CommentEditorV2-modalButtons {
  border-top: 1px solid #444444;
}

html[data-theme="dark"] .CommentEditorV2-modalButtons {
  border-bottom: 1px solid #444444;
}

.CommentEditorV2-inputWrap {
  position: relative;
  display: flex;
  align-items: flex-end;
  border: solid 1px #EBEBEB;
  border-radius: 3px;
  background-color: #F6F6F6;
}

.CommentEditorV2-inputWrap .Input-wrapper {
    border: none;
    background: transparent;
  }

html[data-theme="dark"] .CommentEditorV2-inputWrap {
  border: solid 1px #444444;
}

html[data-theme="dark"] .CommentEditorV2-inputWrap {
  background-color: #2E2E2E;
}

.CommentEditorV2-inputWrap--change {
  display: block;
}

.CommentEditorV2-inputWrap--active {
  flex: 1; /* hack fix safari http://jira.in.zhihu.com/browse/CFE-594 */
  border: 1px solid #8590A6;
  background-color: #FFFFFF;
}

html[data-theme="dark"] .CommentEditorV2-inputWrap--active {
  border: 1px solid #606A80;
}

html[data-theme="dark"] .CommentEditorV2-inputWrap--active {
  background-color: #1A1A1A;
}

.CommentEditorV2-inputUpload {
  height: 36px;
  display: flex;
  align-items: center;
}

.CommentEditorV2-inputUpload--FlexEnd {
  justify-content: flex-end;
}

.CommentEditorV2-inputUpload--SpaceBetween {
  justify-content: space-between;
}

.CommentEditorV2-inputUpLoad-Icon {
  margin-right: 12px;
}

.CommentEditorV2-inputUpLoad-Icon .Editable-control .Zi {
    fill: currentcolor;
  }

.CommentEditorV2-popoverWrap {
  display: flex;
}

.CommentEditorV2-popoverWrap .Editable-control:not(:disabled):hover {
    background-color: transparent;
    border-color: transparent;
  }

.CommentEditorV2-popoverWrap .CommentEditorV2-inputUpLoad-Icon--active .Zi.Zi--Emotion {
      fill: #0084FF;
    }

html[data-theme="dark"] .CommentEditorV2-popoverWrap .CommentEditorV2-inputUpLoad-Icon--active .Zi.Zi--Emotion {
      fill: #3A76D0;
}

.CommentEditorV2-popoverWrap .CommentEditorV2-inputUpLoad-Icon--active .Editable-control:not(:disabled):hover .Zi.Zi--Emotion {
        fill: #0084FF;
      }

html[data-theme="dark"] .CommentEditorV2-popoverWrap .CommentEditorV2-inputUpLoad-Icon--active .Editable-control:not(:disabled):hover .Zi.Zi--Emotion {
        fill: #3A76D0;
}

.CommentEditorV2-MaxLength {
  font-size: 14px;
  line-height: 1.71;
  color: #f1403c;
  padding-left: 12px;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
}

html[data-ios] .CommentEditorV2-MaxLength {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .CommentEditorV2-MaxLength {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }
.ImageView {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 101;
  overflow: hidden;
  transition: background-color 200ms ease-in-out;
}

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

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

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

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

.ImageView-transformOrigin {
  -webkit-transform-origin: left top;
          transform-origin: left top;
  transition: 300ms ease-in-out;
  transition-property: -webkit-transform opacity;
  transition-property: transform opacity;
  transition-property: transform opacity, -webkit-transform opacity;
}
.CommentRichText .Richtext-content_img {
    overflow: hidden;
    position: relative;
  }

    .CommentRichText .Richtext-content_img .comment_img,
    .CommentRichText .Richtext-content_img .comment_gif {
      cursor: zoom-in;
    }

    .CommentRichText .Richtext-content_img img {
      position: relative;
      left: 50%;
      -webkit-transform: translateX(-50%);
              transform: translateX(-50%);
    }
  .CommentRichText .Richtext-content_img-square {
    width: 80px;
    height: 80px;
  }
  .CommentRichText .Richtext-content_img-square img {
      width: 80px;
      height: 80px;
    }
  .CommentRichText .Richtext-content_img-square--wideShape {
    max-width: 160px;
    height: 80px;
  }
  .CommentRichText .Richtext-content_img-square--wideShape img {
      width: 160px;
    }
  .CommentRichText .Richtext-content_img-square--highShape {
    width: 80px;
    max-height: 160px;
  }
  .CommentRichText .Richtext-content_img-square--highShape img {
      height: 160px;
    }

.CommentRichText-ImageView {
  z-index: 300;
}
.CommentItemV2 {
  /* flex bug for Safari 9, see: https://github.com/philipwalton/flexbugs#1-minimum-content-sizing-of-flex-items-not-honored */
  position: relative;
  flex-shrink: 0;
  padding: 12px 20px 10px;
  font-size: 15px;
}

  .CommentItemV2:not(:first-child)::after {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    display: block;
    margin: 0 20px;
    margin-top: 10px;
    border-bottom: 1px solid #F6F6F6;
    content: '';
  }

  html[data-theme="dark"] .CommentItemV2:not(:first-child)::after {
    border-bottom: 1px solid #2E2E2E;
}

.CommentItemV2-deletedContent {
  font-size: 15px;
  color: #999999;
}

html[data-theme="dark"] .CommentItemV2-deletedContent {
  color: #646464;
}

.CommentItemV2-meta {
  position: relative;
  height: 24px;
  padding-right: 3px;
  padding-left: 1px;
  margin-bottom: 4px;
  line-height: 24px;
}

.CommentItemV2-meta .UserLink-link {
    font-weight: 500;
  }

.CommentItemV2-metaSibling {
  padding-left: 33px;
}

.CommentItemV2-avatar {
  margin-right: 8px;
}

.CommentItemV2-avatar .UserLink-avatar {
    vertical-align: top;
  }

.CommentItemV2-roleInfo,
.CommentItemV2-reply {
  color: #8590A6;
}

html[data-theme="dark"] .CommentItemV2-roleInfo, html[data-theme="dark"] .CommentItemV2-reply {
  color: #606A80;
}

.CommentItemV2-reviewing {
  margin-left: 8px;
}

.CommentItemV2-reply {
  margin-right: 8px;
  margin-left: 8px;
}

.CommentItemV2-roleInfo {
  /* 标点挤压 */
  margin-right: -8px;
}

.CommentItemV2-time {
  float: right;
  font-size: 14px;
  color: #8590A6;
}

html[data-theme="dark"] .CommentItemV2-time {
  color: #606A80;
}

.CommentItemV2-content {
  margin-bottom: 6px;
  line-height: 25px;
}

.CommentItemV2-content p {
    margin: 0;
  }

.CommentItemV2-editor {
  padding: 12px 0;
}

.CommentItemV2-footer {
  display: flex;
  align-items: center;
  height: 24px;
  font-size: 14px;
  line-height: 24px;
  margin-top: 4px;
}

.CommentItemV2-footer .Button + .Button {
    margin-left: 20px;
  }

.CommentItemV2-mobileFooter .Button + .Button {
    margin-left: 0;
  }

.CommentItemV2-hoverBtn {
  opacity: 0;
  transition: opacity 0.2s;
}

.CommentItemV2:hover .CommentItemV2-hoverBtn {
    opacity: 1;
  }

.CommentItemV2-likeBtn:disabled {
    opacity: 1;
  }

.CommentItemV2-likeBtn.is-liked {
    color: #0084FF;
  }

.CommentItemV2-likeBtn.is-liked:hover {
      color: #175199;
    }

.CommentItemV2-likeBtn.is-liked:hover .Icon {
        fill: currentColor;
      }

html[data-theme="dark"] .CommentItemV2-likeBtn.is-liked:hover {
      color: #175199;
}

.CommentItemV2-likeBtn.is-liked .Icon {
      fill: currentColor;
    }

html[data-theme="dark"] .CommentItemV2-likeBtn.is-liked {
    color: #3A76D0;
}

.CommentItemV2--highlighted {
  -webkit-animation: highlight 1600ms ease-out;
          animation: highlight 1600ms ease-out;
}

@-webkit-keyframes highlight {
  from {
    background: rgba(0, 132, 255, 0.06);
  }

  to {
    background: transparent none repeat 0 0 / auto auto padding-box border-box scroll;
    background: initial;
  }
}

@keyframes highlight {
  from {
    background: rgba(0, 132, 255, 0.06);
  }

  to {
    background: transparent none repeat 0 0 / auto auto padding-box border-box scroll;
    background: initial;
  }
}

.IsolationDot {
  margin: 0 6px;
}

.CommentItemV2-replyArrow {
  color: #8590A6;
  -webkit-transform: rotate(90deg);
          transform: rotate(90deg);
  margin: 0 5px 0 8px;
}

html[data-theme="dark"] .CommentItemV2-replyArrow {
  color: #606A80;
}

.CommentItemV2-userLink {
  max-width: 80px;

  /* 与设计一致，不支持设备将回退为 700 */

  font-weight: 600;

  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */

  font-synthesis: style;
  display: inline-block;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  vertical-align: top;
}

@media (min-width: 360px) {

.CommentItemV2-userLink {
    max-width: 100px;
}
  }

html[data-ios] .CommentItemV2-userLink {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .CommentItemV2-userLink {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

.CommentItemV2-menu-item {
  padding-top: 13px;
  padding-bottom: 13px;
}

.CommentItemV2-editor.CommentEditorV2--active {
    padding-right: 78px;
  }

.CommentItemV2-editor .CommentEditorV2-singleButton {
    right: 0;
  }

.CommentItemV2-walleTag {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  color: #8590A6;
  margin-left: 16px;
  margin-right: 16px;
}

html[data-theme="dark"] .CommentItemV2-walleTag {
  color: #606A80;
}

.CommentItemV2-walleIcon {
  margin-right: 4px;
}
.CommentMoreReplyButton {
  padding: 12px 20px 12px 84px;
}
.NestComment {
  position: relative;
}

  .NestComment:not(:last-child):after {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    display: block;
    margin: 0 20px;
    border-bottom: 1px solid #F6F6F6;
    content: '';
  }

  html[data-theme="dark"] .NestComment:not(:last-child):after {
    border-bottom: 1px solid #2E2E2E;
}

  .NestComment .NestComment--child {
    position: relative;
    padding-left: 33px;
  }

  .NestComment .NestComment--child:after {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    display: block;
    margin-right: 20px;
    margin-left: 84px;
    border-bottom: 1px solid #F6F6F6;
    content: '';
  }

  html[data-theme="dark"] .NestComment .NestComment--child:after {
    border-bottom: 1px solid #2E2E2E;
}

.NestComment--rootComment {
  position: relative;
}

.NestComment--rootComment:after {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    display: block;
    margin-right: 20px;
    margin-left: 52px;
    border-bottom: 1px solid #F6F6F6;
    content: '';
  }

html[data-theme="dark"] .NestComment--rootComment:after {
    border-bottom: 1px solid #2E2E2E;
}

.NestCoomment-moreCommentButton {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 20px;
  padding: 12px 0;
  font-size: 14px;
  line-height: 1.71;
  text-align: center;
  color: #0084FF;
  cursor: pointer;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
  border-bottom: 1px solid #F6F6F6;
}

html[data-ios] .NestCoomment-moreCommentButton {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .NestCoomment-moreCommentButton {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

html[data-theme="dark"] .NestCoomment-moreCommentButton {
  color: #3A76D0;
}

html[data-theme="dark"] .NestCoomment-moreCommentButton {
  border-bottom: 1px solid #2E2E2E;
}

.NestComment-nextSiblings--noBorder + .NestComment:after,
    .NestComment-nextSiblings--noBorder + .NestComment .CommentItemV2:after {
      content: none;
    }
.Comments-container {
  height: 100%;
}

.CommentsV2 {
  display: flex;
  flex-direction: column;
  height: 100%;
  overflow: hidden;
  box-sizing: border-box;
}

.CommentsV2--hidden {
    display: none;
  }

.Comments-titleLink a {
    color: #175199;
  }

.Comments-titleLink a:hover {
    border-bottom: 1px solid #175199;
  }

html[data-theme="dark"] .Comments-titleLink a:hover {
    border-bottom: 1px solid #175199;
}

html[data-theme="dark"] .Comments-titleLink a {
    color: #175199;
}

.CommentListV2 {
  flex: 1;
  overflow-x: hidden;
  overflow-y: auto;
}

.CommentListV2-divider {
  position: relative;
  margin: 0 20px;
  font-size: 14px;
  color: #8590A6;
  text-align: center;
}

.CommentListV2-divider:first-child {
    margin-top: 16px;
  }

html[data-theme="dark"] .CommentListV2-divider {
  color: #606A80;
}

.CommentListV2-dividerLine {
  position: absolute;
  top: 0;
  bottom: 0;
  width: 100%;
  height: 0;
  margin: auto;
  border-top: 1px solid #F6F6F6;
}

html[data-theme="dark"] .CommentListV2-dividerLine {
  border-top: 1px solid #2E2E2E;
}

.CommentListV2-dividerText {
  position: relative;
  z-index: 2;
  display: inline-block;
  padding: 0 1em;
  background-color: #FFFFFF;
}

.CommentListV2-dividerText .CommentListV2-questionMark {
    margin-left: 8px;
  }

html[data-theme="dark"] .CommentListV2-dividerText {
  background-color: #1A1A1A;
}

.CommentsV2-footer {
  padding: 12px 20px;
  background: #FFFFFF;
  border-top: 1px solid #EBEBEB;
}

html[data-theme="dark"] .CommentsV2-footer {
  background: #1A1A1A;
}

html[data-theme="dark"] .CommentsV2-footer {
  border-top: 1px solid #444444;
}

.CommentsV2-disabledText {
  display: flex;
  padding: 14px 12px;
  color: #8590A6;
  background-color: #F6F6F6;
  border-top: 1px solid #F6F6F6;
  box-sizing: border-box;
  align-items: center;
  justify-content: center;
}

html[data-theme="dark"] .CommentsV2-disabledText {
  color: #606A80;
}

html[data-theme="dark"] .CommentsV2-disabledText {
  background-color: #2E2E2E;
}

html[data-theme="dark"] .CommentsV2-disabledText {
  border-top: 1px solid #2E2E2E;
}

.CommentsV2-disabledText--fixed {
  position: fixed;
  width: 100%;
  bottom: 0;
  background: #FFFFFF;
}

.CommentsV2-disabledText--fixed .CommentsV2-disabledReason {
    padding-top: 8px;
    padding-bottom: 8px;
    background: #F6F6F6;
    width: 100%;
    text-align: center;
    border-radius: 3px;
  }

html[data-theme="dark"] .CommentsV2-disabledText--fixed .CommentsV2-disabledReason {
    background: #2E2E2E;
}

html[data-theme="dark"] .CommentsV2-disabledText--fixed {
  background: #1A1A1A;
}

.CommentListV2-action {
  position: relative;
  padding: 16px 0;
  text-align: center;
}

.CommentListV2-action::after {
    position: absolute;
    top: 0;
    display: block;
    width: calc(100% - 48px);
    border-bottom: 1px solid #F6F6F6;
    content: '';
  }

html[data-theme="dark"] .CommentListV2-action::after {
    border-bottom: 1px solid #2E2E2E;
}

.CommentListV2-action a {
    color: #175199;
  }

.CommentListV2-action a:hover {
    border-bottom: 1px solid #175199;
  }

html[data-theme="dark"] .CommentListV2-action a:hover {
    border-bottom: 1px solid #175199;
}

html[data-theme="dark"] .CommentListV2-action a {
    color: #175199;
}

.CommentsV2-withPagination {
  border: 1px solid #EBEBEB;
  box-shadow: 0 1px 3px rgba(26, 26, 26, 0.1);
  background: #FFFFFF;
  margin-top: 12px;
  overflow: visible;
  border-radius: 4px;
}

html[data-theme='dark'] .CommentsV2-withPagination {
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
  }

.CommentsV2-withPagination .CommentListV2 {
    overflow-y: visible;
  }

html[data-theme="dark"] .CommentsV2-withPagination {
  border: 1px solid #444444;
}

html[data-theme="dark"] .CommentsV2-withPagination {
  background: #1A1A1A;
}

.CommentsV2-pagination {
  border-top: 1px solid #EBEBEB;
}

html[data-theme="dark"] .CommentsV2-pagination {
  border-top: 1px solid #444444;
}

.CommentsV2-Packup-Button {
  background: rgba(235, 235, 235, 0.95);
  border-radius: 3px;
  position: fixed;
  height: 30px;
  width: 93px;
  bottom: 30px;
  left: 570px;
  font-size: 13px;
  color: #8590A6;
  letter-spacing: 0;
  margin-left: -93px;
}

.CommentsV2-Packup-Button:hover {
    color: #808080;
  }

html[data-theme="dark"] .CommentsV2-Packup-Button:hover {
    color: #808080;
}

.CommentsV2-Packup-Button .Icon {
    margin-left: 6px;
    -webkit-transform: rotateX(180deg);
            transform: rotateX(180deg);
  }

.CommentsV2-Packup-Button-enter,
  .CommentsV2-Packup-Button-leave {
    transition: opacity 0.3s;
  }

.CommentsV2-Packup-Button-enter {
    opacity: 0;
  }

.CommentsV2-Packup-Button-enter-active {
    opacity: 1;
  }

.CommentsV2-Packup-Button-leave {
    opacity: 1;
  }

.CommentsV2-Packup-Button-leave-active {
    opacity: 0;
  }

html[data-theme="dark"] .CommentsV2-Packup-Button {
  background: rgba(68, 68, 68, 0.95);
}

html[data-theme="dark"] .CommentsV2-Packup-Button {
  color: #606A80;
}

.CommentsV2-empty {
  padding: 60px 0;
  flex: 1;
  box-sizing: border-box;
  overflow: auto;
}

.CommentListV2-expendCollapseButton {
  color: #8590A6;
  cursor: pointer;
}

.CommentListV2-expendCollapseButton:hover {
    color: #808080;
  }

html[data-theme="dark"] .CommentListV2-expendCollapseButton:hover {
    color: #808080;
}

html[data-theme="dark"] .CommentListV2-expendCollapseButton {
  color: #606A80;
}
/* 去掉焦点元素的外边框 */
.CommentItemV2 {
  outline: none;
}

.CommentsV2-replyNum {
  padding: 12px 0px 10px;
  margin: 0 20px;
  border-bottom: 1px solid #F6F6F6;
  font-weight: 500;
}

html[data-theme="dark"] .CommentsV2-replyNum {
  border-bottom: 1px solid #2E2E2E;
}

.CommentsV2-openComment-divider {
  height: 10px;
  background-color: #F6F6F6;
}

html[data-theme="dark"] .CommentsV2-openComment-divider {
  background-color: #2E2E2E;
}

.CommentListV2-header-divider {
  padding: 10px 20px;
  font-size: 14px;
  color: #808080;
  background-color: rgba(246, 246, 246, 0.5);
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
}

html[data-ios] .CommentListV2-header-divider {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .CommentListV2-header-divider {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

html[data-theme="dark"] .CommentListV2-header-divider {
  color: #808080;
}
.AuthorInfo {
  display: flex;
  align-items: center;
}

.AuthorInfo-avatar {
  vertical-align: top;
}

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

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

.AuthorInfo-name {
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
  color: #444444;
}

html[data-ios] .AuthorInfo-name {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .AuthorInfo-name {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

html[data-theme="dark"] .AuthorInfo-name {
  color: #808080;
}

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

/* bio 始终比 name 浅 */
.AuthorInfo-badgeText {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: #646464;
}
html[data-theme="dark"] .AuthorInfo-badgeText {
  color: #999999;
}

.AuthorInfo--plain .AuthorInfo-content {
    display: flex;
    align-items: center; /* 横向放置，对齐里面可能的 extra */
    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: flex;
  border-bottom: 1px solid #EBEBEB;
}

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

.PushNotifications-tab {
  position: relative;
  flex: 1;
  height: 48px;
  cursor: pointer;
  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: #444444;
}

.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: #999999;
}

.PushNotifications-item a {
  color: #175199;
}

.PushNotifications-item a:hover {
    color: hsl(213.23076923076923, 73.8636363636%, 29.5098039216%);
  }

html[data-theme="dark"] .PushNotifications-item a:hover {
    color: hsl(213.23076923076923, 73.8636363636%, 29.5098039216%);
}

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

.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: #444444;
}

.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 #444444;
}

.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: #999999;
}

.Notifications-footer {
  display: flex;
  justify-content: space-between;
  width: 100%;
  height: 40px;
  padding: 0 16px;
  line-height: 40px;
  background: #FFFFFF;
  border-top: 1px solid #EBEBEB;
  box-sizing: border-box;
}

html[data-theme="dark"] .Notifications-footer {
  background: #1A1A1A;
}

html[data-theme="dark"] .Notifications-footer {
  border-top: 1px solid #444444;
}

.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: #FFFFFF;
  background-color: #F1403C;
  border: 2px solid #FFFFFF;
  border-radius: 20px;
}

html[data-theme="dark"] .PushNotifications-count {
  color: #EBEBEB;
}

html[data-theme="dark"] .PushNotifications-count {
  background-color: #B7302D;
}

html[data-theme="dark"] .PushNotifications-count {
  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;
}
.SearchBar-topSearchItem {
  display: inline-flex;
  font-size: 14px;
  align-items: center;
  padding: 4px 0;
  height: 32px;
  box-sizing: border-box;
  margin: 2px 0;
}

.SearchBar-hotIcon {
  margin-left: 5px;
}
.SearchBar-historyItem {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 14px;
  padding: 6px 0;
  line-height: 24px;
}

.SearchBar-historyItemContent {
  display: flex;
  align-items: center;
}

.SearchBar-historyItemContent.blueFont {
    color: #175199;
  }

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: flex;
  justify-content: space-between;
}

html[data-theme="dark"] .SearchBar-historyLabel {
  color: #606A80;
}

html[data-theme="dark"] .SearchBar-historyLabel {
  border-bottom: 1px solid #444444;
}

.SearchBar-historyIconWrapper {
  position: relative;
}

.SearchBar-historyIconWrapper svg {
    fill: #8590A6;
  }

html[data-theme="dark"] .SearchBar-historyIconWrapper svg {
    fill: #606A80;
}

.SearchBar-historyIconWrapper:hover {
    color: #175199;
  }

html[data-theme="dark"] .SearchBar-historyIconWrapper:hover {
    color: #175199;
}

.SearchBar-historyIconWrapper:hover svg {
    fill: #175199;
  }

html[data-theme="dark"] .SearchBar-historyIconWrapper:hover svg {
    fill: #175199;
}

.SearchBar-historyIconShade {
  position: absolute;
  width: 100%;
  height: 100%;
  cursor: pointer;
}

.SearchBar-historyLabelDeleteAll {
  display: flex;
  align-items: center;
}

.SearchBar-historyDelete {
  display: none;
}

.SearchBar-historyItem:hover .SearchBar-historyDelete {
  display: flex;
  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;
  /* color: cc(GBK05A); */
  vertical-align: top;
  border-radius: 100px;

  /* 暂时与投票按钮样式一致，一周后改成灰色再 a/b test */
  /* background: cc(GBK10A); */
  background: rgba(0, 132, 255, 0.1);
}

  .Tag:hover {
    background-color: rgba(0, 132, 255, 0.15);
  }

  html[data-theme="dark"] .Tag:hover {
    background-color: rgba(58, 118, 208, 0.15);
}

  .Tag--removable {
    padding-right: 28px;
  }

  html[data-theme="dark"] .Tag {
  color: #3A76D0;
}

  html[data-theme="dark"] .Tag {
  background: rgba(58, 118, 208, 0.1);
}

.Tag-remove {
  position: absolute;
  top: 0;
  right: 10px;
  bottom: 0;
  margin-top: auto;
  margin-bottom: auto;
  cursor: pointer;
  padding: 0;
  background: none;
  border: none;
  outline: none;
  color: inherit;
}

.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;
}
  html[data-theme="dark"] .AskTopics-input {
  color: #3A76D0;
}
.AskFieldTip {
  font-size: 15px;
}

  .AskFieldTip--warning {
    color: #FF9607;
  }

  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: flex;
  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: flex;
  justify-content: space-between;
}

.AskTitle-suggestionItemDesc {
  padding-left: 14px;
  color: #8590A6;
  flex-shrink: 0;
}

html[data-theme="dark"] .AskTitle-suggestionItemDesc {
  color: #606A80;
}
.AskDetail {
  min-height: 112px;
  display: flex;
  flex-direction: column;
}

.AskDetail-input {
  font-size: 15px;
}

.AskDetail-inputWrapper {
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

.AskDetail-actionsWrapper {
  overflow: hidden;
  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;
  @bold;
}
  html[data-theme="dark"] .AskBrandTitle-main {
  color: #999999;
}

.AskBrandTitle-sub {
  color: #999999;
  font-size: 13px;
}

html[data-theme="dark"] .AskBrandTitle-sub {
  color: #646464;
}
.Ask-form {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.Ask-items {
  display: flex;
  max-height: calc(100vh - 24px * 4 - 50px);
  min-height: 138px;
  overflow: hidden;
  flex-direction: column;
}

.Ask-items:first-child {
    padding-top: 8px;
  }

.Ask-item {
  flex-shrink: 0;
  margin-bottom: 16px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

.Ask-item:nth-child(2) {
    flex-shrink: 1;
  }

.Ask-titleWrapper {
  display: block;
}

.Ask-avatar {
  float: left;
  margin-right: 16px;
  margin-top: 3px;
}

.Ask-title {
  overflow: hidden;
}

.Ask-footer {
  display: flex;
  flex-shrink: 0;
}

.Ask-footer-buttonWrapper {
  flex: 1;
  text-align: right;
}

.Ask-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  background-color: #F6F6F6;
  padding: 18px 24px;
  border-bottom: 20px solid transparent;
  border-bottom: 1px solid #EBEBEB;
  margin: -24px -24px 12px;
}

html[data-theme="dark"] .Ask-header {
  background-color: #2E2E2E;
}

html[data-theme="dark"] .Ask-header {
  border-bottom: 1px solid #444444;
}
.AskOrgSelect-item {
  display: flex;
  align-items: center;
  color: #BFBFBF;
  padding-bottom: 15px;
  padding-top: 26px;
}

  .AskOrgSelect-item + .AskOrgSelect-item {
    border-top: 1px solid #EBEBEB;
  }

  html[data-theme="dark"] .AskOrgSelect-item + .AskOrgSelect-item {
    border-top: 1px solid #444444;
}

  .AskOrgSelect-item svg {
    flex-shrink: 0;
  }

  html[data-theme="dark"] .AskOrgSelect-item {
  color: #808080;
}

.AskOrgSelect-itemTitle {
  font-size: 17px;
  color: #1A1A1A;
}

html[data-theme="dark"] .AskOrgSelect-itemTitle {
  color: #999999;
}

.AskOrgSelect-itemDesc {
  margin-top: 10px;
  font-size: 14px;
  color: #8590A6;
}

html[data-theme="dark"] .AskOrgSelect-itemDesc {
  color: #606A80;
}
.SearchBar {
  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: flex;
    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 {
    /* HACK */
    height: 40px;
    padding: 0;
    margin-top: 8px;
    line-height: 40px;
    color: #8590A6;
  }

.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;
}

html[data-theme="dark"] .SearchBar-menu.SearchBar-hasValueMenu .AutoComplete-group:last-child .Menu-item {
    color: #606A80;
}

.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 {
    color: #175199;
  }

html[data-theme="dark"] .SearchBar-menu .blueFont em {
    color: #175199;
}

.SearchBar-topicResult,
.SearchBar-peopleResult,
.SearchBar-contentResult,
.SearchBar-defaultResult {
  display: block;
  padding: 10px 0;
  font-size: 14px;
  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;
}

.SearchBar-label--history {
    display: flex;
    align-items: center;
    justify-content: space-between;
  }

html[data-theme="dark"] .SearchBar-label {
  color: #606A80;
}

html[data-theme="dark"] .SearchBar-label {
  border-bottom: 1px solid #444444;
}

.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;
  transition: opacity 300ms ease, -webkit-transform 300ms ease;
  transition: opacity 300ms ease, transform 300ms ease;
  transition: opacity 300ms ease, transform 300ms ease, -webkit-transform 300ms ease;
  line-height: 30px;
}

.SearchBar-hiddenAskButton {
  opacity: 0;
  -webkit-transform: scale(0);
          transform: scale(0);
}

.SearchBar-input {
  width: 326px;
  padding-left: 16px;
  transition: width 200ms ease, background 300ms ease;
}

.SearchBar-focusedInput {
  width: 400px;
}

.SearchBar-searchIcon {
  position: absolute;
  right: -11px;
  top: -17px;
  bottom: -17px;
  background: transparent;
  border: transparent;
  padding: 0 12px;
  border-bottom-left-radius: 0;
  border-top-left-radius: 0;
  transition: fill 300ms ease;
}

.SearchBar-focusedSearchIcon .Icon {
  fill: #0084FF;
}

html[data-theme="dark"] .SearchBar-focusedSearchIcon .Icon {
  fill: #3A76D0;
}

.SearchBar-hasValueSearchIcon .Icon {
  fill: #FFFFFF;
}

html[data-theme="dark"] .SearchBar-hasValueSearchIcon .Icon {
  fill: #1A1A1A;
}

.SearchBar-iconDecorator {
  position: absolute;
  top: 0;
  right: -40px;
  width: 40px;
  height: 36px;
  border-radius: 0 3px 3px 0;
  transition: all 300ms ease;
  transition-delay: 100ms;
}

.SearchBar-iconDecorator {
  z-index: 101;
  background: #0084FF;
  opacity: 0;
}

html[data-theme="dark"] .SearchBar-iconDecorator {
  background: #3A76D0;
}

.SearchBar-shownIconDecorator {
  opacity: 1;
  -webkit-transform: translateX(-40px);
          transform: translateX(-40px);
  transition-delay: 0;
}

/* override origin component style */
.SearchBar-menu .Menu-item {
  padding: 0 16px;
}
.SimpleSearchBar-wrapper {
  margin: auto 0;
}

  .SimpleSearchBar-wrapper .Input-after {
    right: -1px;
  }

.SimpleSearchBar-searchButton {
  display: flex;
  height: 34px;
  padding: 3px 16px;
  border-radius: 0 3px 3px 0;
}

.SimpleSearchBar-input {
  width: 296px;
  background-color: #F6F6F6;
}

html[data-theme="dark"] .SimpleSearchBar-input {
  background-color: #2E2E2E;
}
.PrivacyConfirm-modal {
  width: 640px;
  height: 532px;
}

  .PrivacyConfirm-modal .Modal-inner {
    border-radius: 8px;
    overflow: hidden;
  }

  .PrivacyConfirm-modal .Modal-content {
    padding: 0;
  }

.PrivacyConfirm {
  position: relative;
  font-size: 13px;
  line-height: 1.54;
  color: #444444;
  padding-bottom: 80px;
}

.PrivacyConfirm a {
    color: #0084FF;
  }

html[data-theme="dark"] .PrivacyConfirm a {
    color: #3A76D0;
}

.PrivacyConfirm p {
    margin: 10px 0;
  }

html[data-theme="dark"] .PrivacyConfirm {
  color: #808080;
}

.PrivacyConfirm-inner {
  height: 340px;
  overflow: auto;
  padding: 0 30px;
}

.PrivacyConfirm-title {
  color: #1A1A1A;
  font-size: 21px;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
  text-align: center;
  margin-bottom: 24px;
}

html[data-ios] .PrivacyConfirm-title {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .PrivacyConfirm-title {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

html[data-theme="dark"] .PrivacyConfirm-title {
  color: #999999;
}

.PrivacyConfirm-section {
  color: #1A1A1A;
  font-size: 16px;
  line-height: 1;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
  border-left: 3px solid #0084FF;
  padding-left: 8px;
  margin: 20px 0 10px;
}

html[data-ios] .PrivacyConfirm-section {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .PrivacyConfirm-section {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

html[data-theme="dark"] .PrivacyConfirm-section {
  color: #999999;
}

html[data-theme="dark"] .PrivacyConfirm-section {
  border-left: 3px solid #3A76D0;
}

.PrivacyConfirm-buttons {
  position: absolute;
  bottom: 0;
  width: 100%;
  background-color: #FFFFFF;
  text-align: center;
  padding: 20px 0;
  border-top: solid #D3D3D3;
  border-top: 0.5px solid #D3D3D3;
}

html[data-hairline] .PrivacyConfirm-buttons {
    border-top: 1px solid #D3D3D3;
    -o-border-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='1' height='1'> <rect x='0' y='0' width='1' height='.5' fill='#d3d3d3'/> </svg>")
      1 0 0 0;
       border-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='1' height='1'> <rect x='0' y='0' width='1' height='.5' fill='#d3d3d3'/> </svg>")
      1 0 0 0;
  }

html[data-theme="dark"] html[data-hairline] .PrivacyConfirm-buttons {
    border-top: 1px solid #2E2E2E;
}

.PrivacyConfirm-buttons button {
    width: 180px;
    height: 40px;
  }

.PrivacyConfirm-buttons button:first-child:not(:last-child) {
    margin-right: 60px;
    background-color: #EBEBEB;
    border-color: #EBEBEB;
    color: #808080;
  }

html[data-theme="dark"] .PrivacyConfirm-buttons button:first-child:not(:last-child) {
    background-color: #444444;
}

html[data-theme="dark"] .PrivacyConfirm-buttons button:first-child:not(:last-child) {
    border-color: #444444;
}

html[data-theme="dark"] .PrivacyConfirm-buttons button:first-child:not(:last-child) {
    color: #808080;
}

html[data-theme="dark"] .PrivacyConfirm-buttons {
  background-color: #1A1A1A;
}

html[data-theme="dark"] .PrivacyConfirm-buttons {
  border-top: solid #2E2E2E;
}

html[data-theme="dark"] .PrivacyConfirm-buttons {
  border-top: 0.5px solid #2E2E2E;
}

.PrivacyConfirm-refuseModal {
  width: 390px;
}

.PrivacyConfirm-refuseModal .Modal-inner {
    border-radius: 8px;
  }

.PrivacyConfirm-refuseModal .PrivacyConfirm-buttons {
    position: relative;
    margin-top: 20px;
  }

.PrivacyConfirm-refuseModal .Modal-content {
    padding: 0;
  }

.PrivacyConfirm-refuseModal .Modal-content div:first-child {
      padding: 0 7.4%;
    }

.PrivacyConfirm-privacyAnchor {
  outline: none !important;
}

.PrivacyConfirm-center {
  text-align: center;
}
.AppHeaderProfileMenu-item {
  align-items: center;
  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 #FFFFFF;
  border-radius: 50%;
  height: 8px;
  right: -4px;
  top: -4px;
  width: 8px;
}

html[data-theme="dark"] .AppHeader-profileAvatarRedDot {
  background: #B7302D;
}

html[data-theme="dark"] .AppHeader-profileAvatarRedDot {
  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 {
  align-items: center;
  box-sizing: border-box;
  display: flex;
  font-size: 14px;
  /* TODO: 这个宽度不是必须的、是 Popover 在切换窗口宽度的过程中可能导致宽度塌陷 */
  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;
  /* TODO: Popover 在打开后会默认 focus 在这个 Link 上，和 aria 有关，先 hack 掉样式 */
  outline: none;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
}

html[data-ios] .AppHeaderProfileMenu-creatorHintLink {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .AppHeaderProfileMenu-creatorHintLink {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

html[data-theme="dark"] .AppHeaderProfileMenu-creatorHintLink {
  color: #175199;
}

.AppHeaderProfileMenu-creatorHintCloseContainer {
  align-items: center;
  color: #D3D3D3;
  cursor: pointer;
  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: #FFFFFF;
  box-shadow: 0 1px 3px rgba(26, 26, 26, 0.1);
  background-clip: content-box;
}
  html[data-theme='dark'] .AppHeader {
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
  }
  .AppHeader.is-fixed {
    z-index: 100;
  }
  html[data-theme="dark"] .AppHeader {
  background: #1A1A1A;
}

.AppHeader-inner {
  position: relative;
  display: flex;
  width: 1000px;
  height: 52px;
  padding: 0 16px;
  margin: 0 auto;
  align-items: center;
  transition: -webkit-transform 0.3s;
  transition: transform 0.3s;
  transition: transform 0.3s, -webkit-transform 0.3s;
}

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

.AppHeader-nav {
  display: flex;
  justify-content: space-between;
  height: 30px;
  margin-right: 18px;
  margin-left: 27px;
  color: #999999;
}

html[data-theme="dark"] .AppHeader-nav {
  color: #646464;
}

.AppHeader-navItem {
  padding: 0 15px;
  font-size: 15px;
  line-height: 30px;
  color: #8590A6;
}

.AppHeader-navItem.AppHeader-navItem-orgHome {
    padding-right: 22px;
  }

.AppHeader-navItem:hover {
    color: #175199;
  }

html[data-theme="dark"] .AppHeader-navItem:hover {
    color: #175199;
}

.AppHeader-navItem.is-active {
    color: #444444;
  }

html[data-theme="dark"] .AppHeader-navItem.is-active {
    color: #808080;
}

.AppHeader-navItem.is-org-active {
    color: #1A1A1A;
    /* 与设计一致，不支持设备将回退为 700 */
    font-weight: 600;
    /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
    font-synthesis: style;
  }

html[data-ios] .AppHeader-navItem.is-org-active {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .AppHeader-navItem.is-org-active {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

html[data-theme="dark"] .AppHeader-navItem.is-org-active {
    color: #999999;
}

.AppHeader-navItem:first-child {
    padding-left: 0;
  }

html[data-theme="dark"] .AppHeader-navItem {
  color: #606A80;
}

.AppHeader-navDivider {
  height: 15px;
  border-right: 1px #D3D3D3 solid;
  align-self: center;
}

html[data-theme="dark"] .AppHeader-navDivider {
  border-right: 1px #2E2E2E solid;
}

.AppHeader-input {
  width: 345px;
}

.AppHeader-userInfo {
  flex: 1;
  justify-content: flex-end;
  display: flex;
  align-items: center;
}

.AppHeader-notifications,
.AppHeader-messages {
  margin-right: 40px;
}

.AppHeader-profile {
  position: relative;
}

.AppHeader-login {
  margin-right: 16px;
}

.AppHeader-downloadPopover {
  padding: 16px;
}

.AppHeader-downloadPopoverImage {
  width: 120px;
}
.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;
}
  html[data-theme="dark"] .AdblockBanner {
  background-color: #444444;
}

.AdblockBanner-inner {
  width: 1000px;
  padding: 0 24px;
  margin: 0 auto;
  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;
  }
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;
  font-size: 15px;
  color: #1A1A1A;
  background: #F6F6F6;
  -webkit-tap-highlight-color: rgba(26, 26, 26, 0);
}
  html[data-theme="dark"] body {
  color: #999999;
}
  html[data-theme="dark"] body {
  background: #000000;
}
  html[data-theme="dark"] body {
  -webkit-tap-highlight-color: rgba(153, 153, 153, 0);
}

.App-main {
  display: block;
}

/**
 * Utilities
 */
.u-ellipsis {
  overflow: hidden;
  text-overflow: ellipsis;
  word-wrap: normal; /* for IE 8 & 9 , 参见 http://www.99css.com/archives/811 */
  white-space: nowrap;
}

.App-loginGuideModal {
  width: 400px;
}

.App-loginButton,
.App-registerButton {
  display: block;
  width: 220px;
  height: 36px;
  margin: 0 auto;
  font-size: 14px;
  text-align: center;
}

.App-loginButton {
  margin-top: 28px;
  color: #FFFFFF;
}

html[data-theme="dark"] .App-loginButton {
  color: #1A1A1A;
}

.App-registerButton {
  margin-top: 52px;
  margin-bottom: 12px;
  color: #8590A6;
}

html[data-theme="dark"] .App-registerButton {
  color: #606A80;
}
.EntrySign-body {
  overflow: hidden;
}

  .EntrySign-body .AppHeader {
    display: none;
  }

.SignFlowHomepage {
  background-image: url(https://static.zhihu.com/heifetz/sign_bg.db29b0fbd2f78dd8c1b7.png);
  background-repeat: no-repeat;
  background-color: #b8e5f8;
  background-size: cover;
  width: 100%;
  height: 100vh;
  overflow: auto;
  padding-right: 15px;
}

.SignFlowHomepage .Card {
    overflow: visible;
  }

.SignFlowHomepage-content {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  border-radius: 2px;
  min-height: 688px;
  height: calc(100% - 42px);
  box-sizing: border-box;
}

.SignFlowHomepage-downloadBtn {
  margin-top: 30px;
  background: #8590A6;
  border: none;
  color: #FFFFFF;
  width: 432px;
  height: 42px;
}

.SignFlowHomepage-downloadBtn:hover {
    background: #8590A6;
  }

html[data-theme="dark"] .SignFlowHomepage-downloadBtn:hover {
    background: #606A80;
}

html[data-theme="dark"] .SignFlowHomepage-downloadBtn {
  background: #606A80;
}

html[data-theme="dark"] .SignFlowHomepage-downloadBtn {
  color: #1A1A1A;
}

.SignFlowHomepage-qrImage {
  position: absolute;
  z-index: 0;
  left: 0;
  right: 0;
  height: 100%;
  bottom: 0;
  transition: opacity 0.3s, height 0.3s;
}

.SignFlowHomepage-qrImage div {
    width: 100%;
    height: 100%;
    box-sizing: border-box;
    background-color: #FFFFFF;
    background-size: 250px 250px;
    background-position: center center;
    background-repeat: no-repeat;
    background-image: url(https://www.zhihu.com/static/revved/img/index/qr-code@2x.2607d448.png);
    box-shadow: 0 0 8px 0 rgba(26, 26, 26, 0.15);
    border-radius: 2px;
  }

html[data-theme="dark"] .SignFlowHomepage-qrImage div {
    background-color: #1A1A1A;
}

html[data-theme="dark"] .SignFlowHomepage-qrImage div {
    box-shadow: 0 0 8px 0 rgba(153, 153, 153, 0.15);
}

.SignFlowHomepage-qrImage::after,
  .SignFlowHomepage-qrImage::before {
    content: '';
    position: absolute;
    bottom: -7px;
    -webkit-transform: translate(-50%) rotate(45deg);
            transform: translate(-50%) rotate(45deg);
    left: 50%;
    width: 20px;
    height: 20px;
    background: #FFFFFF;
    border-radius: 4px;
  }

html[data-theme="dark"] .SignFlowHomepage-qrImage::after, html[data-theme="dark"] .SignFlowHomepage-qrImage::before {
    background: #1A1A1A;
}

.SignFlowHomepage-qrImage::after {
    box-shadow: 0 0 8px 0 rgba(26, 26, 26, 0.15);
    z-index: -1;
  }

html[data-theme="dark"] .SignFlowHomepage-qrImage::after {
    box-shadow: 0 0 8px 0 rgba(153, 153, 153, 0.15);
}

.SignFlowHomepage-qrImageHidden {
  opacity: 0;
  height: 0;
  bottom: 0;
}

.SignFlowHomepage-qrImageHidden::after,
  .SignFlowHomepage-qrImageHidden::before {
    display: none;
  }

.SignFlowHomepage-footer {
  font-size: 12px;
  line-height: 21px;
  text-align: center;
  color: #FFFFFF;
  text-shadow: 0 1px 2px #999999;
}

html[data-theme="dark"] .SignFlowHomepage-footer {
  color: #1A1A1A;
}

html[data-theme="dark"] .SignFlowHomepage-footer {
  text-shadow: 0 1px 2px #646464;
}

.ZhihuIntegrity {
  border-top: #EBEBEB 1px solid;
  width: 420px;
  margin: 10px auto;
  padding-top: 10px;
}

.ZhihuIntegrity > div {
    cursor: pointer;
    display: inline-block;
    position: relative;
    line-height: 26px;
    z-index: 0;
  }

.ZhihuIntegrity img {
    position: absolute;
    left: -34px;
    z-index: -1;
    width: 138px;
    height: 26px;
  }

html[data-theme="dark"] .ZhihuIntegrity {
  border-top: #444444 1px solid;
}

.SignFlowHomepage-footer a:not(:last-child)::after, .SignFlowHomepage-footer span:not(:last-child)::after {
    content: ' \B7   ';
    white-space: pre;
    display: inline-block;
  }

.SignFlowHomepage-footer a:hover {
  text-decoration: underline;
}
.UserStatus {
  width: 100%;
  height: 60px;
  font-size: 15px;
  line-height: 60px;
  color: #1A1A1A;
  text-align: center;
  background-color: rgba(133, 144, 166, 0.08);
}

  .UserStatus .Button {
    font-size: 15px;
  }

  html[data-theme="dark"] .UserStatus {
  color: #999999;
}

  html[data-theme="dark"] .UserStatus {
  background-color: rgba(96, 106, 128, 0.08);
}

.UserStatus-warnText {
  margin-left: 8px;
}
.UserAvatar {
  display: inline-block;
  overflow: hidden;
  vertical-align: top;
  background-color: #FFFFFF;
  border: 4px solid #FFFFFF;
  border-radius: 8px;
}
  html[data-theme="dark"] .UserAvatar {
  background-color: #1A1A1A;
}
  html[data-theme="dark"] .UserAvatar {
  border: 4px solid #1A1A1A;
}

.UserAvatar-inner {
  vertical-align: top;
}

.UserAvatar-holder {
  width: 160px;
  height: 160px;
}

.UserAvatar-round {
  border-radius: 50%;
  width: 160px;
  height: 160px;
}
.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 #FFFFFF;
  border-radius: 8px;
}

html[data-theme="dark"] .UserAvatarEditor-avatar {
  background: #2E2E2E;
}

html[data-theme="dark"] .UserAvatarEditor-avatar {
  border: 4px solid #1A1A1A;
}

.UserAvatarEditor-title {
  font-size: 24px;
  color: #1A1A1A;
}

html[data-theme="dark"] .UserAvatarEditor-title {
  color: #999999;
}

.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 #FFFFFF;
  border-radius: 8px;
}

html[data-theme="dark"] .UserAvatarEditor-maskInner {
  border: 4px solid #1A1A1A;
}

.UserAvatarEditor-maskInnerText {
  white-space: nowrap;
}

.UserAvatarEditor-cameraIcon {
  margin-bottom: 14px;
  fill: #FFFFFF;
}

html[data-theme="dark"] .UserAvatarEditor-cameraIcon {
  fill: #1A1A1A;
}

.UserAvatarEditor-maskRoundInner {
  border-radius: 50%;
}
.UserCover {
  position: relative;
  height: 240px;
  overflow: hidden;
  background: #F6F6F6;
  border-top-right-radius: 1px;
  border-top-left-radius: 1px;
  transition: height 0.3s;
}
  html[data-theme="dark"] .UserCover {
  background: #2E2E2E;
}

.UserCover--colorBlock {
  height: 132px;
  background: #999999;
}

html[data-theme="dark"] .UserCover--colorBlock {
  background: #646464;
}

.UserCover-image {
  transition: -webkit-transform 6000ms ease-out;
  transition: transform 6000ms ease-out;
  transition: transform 6000ms ease-out, -webkit-transform 6000ms ease-out;
}

.UserCover-image,
  .UserCover-image img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
  }
.DynamicColorButton {
  color: #D3D3D3;
  transition: color, border-color 300ms;
}

  .DynamicColorButton svg {
    fill: currentColor;
  }

  html[data-theme="dark"] .DynamicColorButton {
  color: #2E2E2E;
}

.DynamicColorButton--dark {
  color: rgba(26, 26, 26, 0.6);
  border-color: rgba(26, 26, 26, 0.12);
}

.DynamicColorButton--dark:hover {
    background: rgba(26, 26, 26, 0.03);
  }

html[data-theme="dark"] .DynamicColorButton--dark:hover {
    background: rgba(153, 153, 153, 0.03);
}

html[data-theme="dark"] .DynamicColorButton--dark {
  color: rgba(153, 153, 153, 0.6);
}

html[data-theme="dark"] .DynamicColorButton--dark {
  border-color: rgba(153, 153, 153, 0.12);
}

.DynamicColorButton--white {
  color: rgba(255, 255, 255, 0.7);
  border-color: rgba(255, 255, 255, 0.24);
}

.DynamicColorButton--white:hover {
    background: rgba(255, 255, 255, 0.04);
  }

html[data-theme="dark"] .DynamicColorButton--white:hover {
    background: rgba(26, 26, 26, 0.04);
}

html[data-theme="dark"] .DynamicColorButton--white {
  color: rgba(26, 26, 26, 0.7);
}

html[data-theme="dark"] .DynamicColorButton--white {
  border-color: rgba(26, 26, 26, 0.24);
}
.UserCoverGuide {
  position: absolute;
  z-index: 2;
  width: 100%;
  height: 100%;
  overflow: hidden;
  border-top-right-radius: 1px;
  border-top-left-radius: 1px;
}

  .UserCoverGuide.is-active .is-playing {
      opacity: 1;
    }

  .UserCoverGuide.is-active .UserCoverGuide-dialog {
      opacity: 1;
      -webkit-transform: translateY(0);
              transform: translateY(0);
    }

.UserCoverGuide-inner {
  position: relative;
  z-index: 2;
  float: right;
  padding: 24px;
}

.UserCoverGuide-buttonContainer {
  margin-bottom: 14px;
  text-align: right;
}

.UserCoverGuide-dialog {
  position: relative;
  width: 286px;
  padding: 22px 16px;
  background-color: #FFFFFF;
  border-radius: 4px;
  opacity: 0;
  -webkit-transform: translateY(-10px);
          transform: translateY(-10px);
  transition: opacity 300ms, -webkit-transform 300ms;
  transition: opacity 300ms, transform 300ms;
  transition: opacity 300ms, transform 300ms, -webkit-transform 300ms;
}

.UserCoverGuide-dialog::after {
    position: absolute;
    right: 60px;
    bottom: 100%;
    border-color: transparent transparent #FFFFFF;
    border-style: solid;
    border-width: 7px;
    content: '';
  }

html[data-theme="dark"] .UserCoverGuide-dialog::after {
    border-color: transparent transparent #1A1A1A;
}

html[data-theme="dark"] .UserCoverGuide-dialog {
  background-color: #1A1A1A;
}

.UserCoverGuide-dialogContent {
  font-size: 14px;
  line-height: 1.7;
}

.UserCoverGuide-dialogContent a {
    color: #175199;
    cursor: pointer;
  }

.UserCoverGuide-dialogContent a:hover {
      text-decoration: underline;
    }

html[data-theme="dark"] .UserCoverGuide-dialogContent a {
    color: #175199;
}

.UserCoverGuide-dialogDescription,
.UserCoverGuide-dialogHead {
  margin: 0 0 6px;
}

.UserCoverGuide-items {
  width: 100%;
  height: 100%;
}

.UserCoverGuide-item {
  position: absolute;
  width: 100%;
  height: 100%;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  opacity: 0;
  transition: opacity 500ms;
}
.UserCoverEditor {
  position: relative;
}

.UserCoverEditor-simpleEditButton {
  position: absolute;
  top: 24px;
  right: 24px;
  z-index: 2;
}

.UserCoverEditor-editor {
  position: relative;
  z-index: 2;
}

.UserCoverEditor-editor canvas {
    vertical-align: top;
  }

.UserCoverEditor-action {
  position: absolute;
  width: 100%;
  height: 80px;
  background: #FFFFFF;
  border-bottom: 1px solid #EBEBEB;
  box-shadow: 0 1px 3px rgba(26, 26, 26, 0.1);
}

html[data-theme='dark'] .UserCoverEditor-action {
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
  }

html[data-theme="dark"] .UserCoverEditor-action {
  background: #1A1A1A;
}

html[data-theme="dark"] .UserCoverEditor-action {
  border-bottom: 1px solid #444444;
}

.UserCoverEditor-actionContent {
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 100%;
  margin: 0 24px;
}

.UserCoverEditor-actionContent .Button + .Button {
    margin-left: 16px;
  }

.UserCoverEditor-actionTitle {
  font-size: 20px;
  color: #1A1A1A;
}

html[data-theme="dark"] .UserCoverEditor-actionTitle {
  color: #999999;
}

.UserCoverEditor-actionDescription {
  font-size: 13px;
  color: #8590A6;
}

html[data-theme="dark"] .UserCoverEditor-actionDescription {
  color: #606A80;
}

.UserCoverEditor-rangeInput {
  display: inline-block;
}

.UserCoverEditor-cameraIcon {
  margin-bottom: 14px;
  fill: #FFFFFF;
}

html[data-theme="dark"] .UserCoverEditor-cameraIcon {
  fill: #1A1A1A;
}

.UserCoverEditor-loadingCanvas {
  width: 100%;
  height: 100%;
}

.UserCoverEditor-leftMasker {
  left: 0;

  position: absolute;

  z-index: 20;

  height: 100%;

  width: calc(50% - 240px);

  background-color: rgba(255, 255, 255, 0.5);

  display: inline-block;
}

html[data-theme="dark"] .UserCoverEditor-leftMasker {

  background-color: rgba(26, 26, 26, 0.5);
}

.UserCoverEditor-rightMasker {
  right: 0;

  position: absolute;

  z-index: 20;

  height: 100%;

  width: calc(50% - 240px);

  background-color: rgba(255, 255, 255, 0.5);

  display: inline-block;
}

html[data-theme="dark"] .UserCoverEditor-rightMasker {

  background-color: rgba(26, 26, 26, 0.5);
}
.ProfileHeader {
  position: relative;
  width: 1000px;
  padding: 0 16px;
  margin: 10px auto;
}

.ProfileHeader-wrapper {
  position: relative;
  width: 100%;
  background: #FFFFFF;
  box-sizing: border-box;
}

html[data-theme="dark"] .ProfileHeader-wrapper {
  background: #1A1A1A;
}

.ProfileHeader-main {
  position: relative;
  margin: 0 20px 24px;
}

.ProfileHeader-avatar {
  position: absolute;
  top: -25px;
  left: 0;
  z-index: 1;
}

.ProfileHeader--org .ProfileHeader-avatar,
  .ProfileEdit--org .ProfileHeader-avatar {
    top: -60px;
  }

.ProfileHeader-content {
  padding-top: 16px;
  padding-left: 32px;
  border-left: 164px solid transparent;
}

.ProfileHeader-contentHead {
  position: relative;
  padding-right: 106px;
  margin-bottom: 16px;
}

.ProfileHeader-contentHead .Button--plain {
    position: absolute;
    top: 8px;
    right: 0;
  }

.ProfileHeader-contentHead .Button--plain:hover {
      color: #808080;
    }

.ProfileHeader-contentHead .Button--plain:hover .Icon {
        fill: #999999;
      }

html[data-theme="dark"] .ProfileHeader-contentHead .Button--plain:hover .Icon {
        fill: #646464;
}

html[data-theme="dark"] .ProfileHeader-contentHead .Button--plain:hover {
      color: #808080;
}

.ProfileHeader-contentHead .FollowStatus {
    position: absolute;
    right: 0;
    bottom: 0;
    padding: 3px 6px;
  }

.ProfileHeader-contentBody {
  position: relative;
  width: 524px;
  overflow: hidden;
}

.content-enter {
  top: 0;
  opacity: 0;
}

.content-enter-active {
  opacity: 1;
  transition: opacity 300ms ease-out;
}

.content-leave {
  position: absolute;
  opacity: 1;
}

.content-leave-active {
  opacity: 0;
  transition: opacity 300ms ease-out;
}

.ProfileHeader-title {
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ProfileHeader-name {
  font-size: 26px;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
  line-height: 30px;
}

html[data-ios] .ProfileHeader-name {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .ProfileHeader-name {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

.ProfileHeader-badge {
  margin-left: 12px;
  vertical-align: 2px;
}

.ProfileHeader-badge.is-unverified {
    color: #8590A6;
  }

.ProfileHeader-badge.is-unverified .Icon {
      margin-right: 4px;
    }

html[data-theme="dark"] .ProfileHeader-badge.is-unverified {
    color: #606A80;
}

.ProfileHeader-headline a, .ProfileHeader-detailValue a {
    border: none !important;
  }

.ProfileHeader-headline a:hover, .ProfileHeader-detailValue a:hover {
      color: #175199;
    }

html[data-theme="dark"] .ProfileHeader-headline a:hover, html[data-theme="dark"] .ProfileHeader-detailValue a:hover {
      color: #175199;
}

.ProfileHeader-headline {
  margin-left: 12px;
  font-size: 18px;
  white-space: nowrap;
}

.ProfileHeader-info {
  font-size: 14px;
  line-height: 20px;
  box-sizing: border-box;
}

.ProfileHeader--org .ProfileHeader-info {
    margin-bottom: 36px;
    overflow: hidden;
    font-size: 18px;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

.ProfileHeader-divider {
  display: inline-block;
  width: 1px;
  height: 10px;
  margin: 0 8px;
  background: #EBEBEB;
}

html[data-theme="dark"] .ProfileHeader-divider {
  background: #444444;
}

.ProfileHeader-infoItem {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ProfileHeader-infoItem:not(:last-child) {
    margin-bottom: 10px;
  }

.ProfileHeader-iconWrapper {
  display: inline-block;
  width: 18px;
  height: 18px;
  margin-right: 12px;
  text-align: center;
  color: #8590A6;
}

html[data-theme="dark"] .ProfileHeader-iconWrapper {
  color: #606A80;
}

.ProfileHeader-arrowIcon.is-active {
  -webkit-transform: rotate(180deg);
          transform: rotate(180deg);
}

.ProfileHeader-contentFooter {
  position: relative;
  padding-top: 8px;
}

.ProfileHeader-expandButton {
  line-height: 1;
}

.ProfileHeader-expandButton .Icon {
    margin: 0 16px 0 4px;
  }

.ProfileHeader-buttons {
  position: absolute;
  right: 0;
  bottom: 0;
}

.ProfileHeader-detail {
  width: 100%;
  font-size: 14px;
  line-height: 1.8;
  color: #1A1A1A;
}

html[data-theme="dark"] .ProfileHeader-detail {
  color: #999999;
}

.ProfileHeader-detailItem {
  display: flex;
  margin-bottom: 18px;
}

.ProfileHeader-detailLabel {
  width: 60px;
  margin-right: 37px;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
}

html[data-ios] .ProfileHeader-detailLabel {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .ProfileHeader-detailLabel {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

.ProfileHeader-detailValue {
  flex: 1;
  overflow: hidden;
}

.ProfileHeader-field {
  display: flex;
  align-items: center;
}

.ProfileHeader-field:not(:first-child) {
    margin-top: 12px;
  }

.ProfileHeader-itemAvatar {
  width: 18px;
  height: 18px;
  margin-right: 12px;
}

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

.ProfileHeader-tips {
  font-size: 14px;
  color: #8590A6;
}

html[data-theme="dark"] .ProfileHeader-tips {
  color: #606A80;
}
.PageHeader {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  transition: -webkit-transform 0.3s;
  transition: transform 0.3s;
  transition: transform 0.3s, -webkit-transform 0.3s;
}

  .PageHeader:not(.is-shown) {
    -webkit-transform: translateY(100%);
            transform: translateY(100%);
  }
.ProfileCreations-tabHeaderWrapper {
  flex: 1;
}

.ProfileCreations-tabHeader {
  width: 694px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 50px;
  padding: 0 20px;
  border-bottom: 1px solid #F6F6F6;
  box-sizing: border-box;
}

.ProfileCreations-tabHeader--pageHeader {
    width: 654px;
  }

html[data-theme="dark"] .ProfileCreations-tabHeader {
  border-bottom: 1px solid #2E2E2E;
}

.ProfileCreations-tabHeaderText {
  margin: 0;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
}

html[data-ios] .ProfileCreations-tabHeaderText {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .ProfileCreations-tabHeaderText {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

.ProfileCreations-tabHeaderOptions {
  font-size: 14px;
}
.ProfileMain-avatar .Avatar {
    display: block;
    cursor: pointer;
  }

.ProfileMain-tabs {
  flex: 1;
}

.PageHeader .ProfileMain-header {
  display: flex;
  align-items: center;
  width: 1000px;
  height: 100%;
  padding: 0 16px;
  margin: 0 auto;
}

.PageHeader .ProfileMain-tabs {
  border-bottom: none;
}

.ProfileMain-tabs {
  flex: 1;
}

.ProfileMain-tabs .Tabs-meta {
    font-weight: 400;
  }

.ProfileMain-menuToggler {
  font-size: 16px;
  color: #1A1A1A;
}

html[data-theme="dark"] .ProfileMain-menuToggler {
  color: #999999;
}

.ProfileMain-tabIcon {
  margin-left: 4px;
}

.Profile-popoverMenuItem {
  height: 40px;
  font-size: 16px;
  line-height: 40px;
  color: #1A1A1A;
}

.Profile-popoverMenuItem.is-active {
    background: #F6F6F6;
  }

html[data-theme="dark"] .Profile-popoverMenuItem.is-active {
    background: #2E2E2E;
}

html[data-theme="dark"] .Profile-popoverMenuItem {
  color: #999999;
}

.Profile-popoverMenuItem .Link-meta {
  font-size: 14px;
  color: #8590A6;
}

html[data-theme="dark"] .Profile-popoverMenuItem .Link-meta {
  color: #606A80;
}

body:not(.Body--isAppleDevice) .ProfileMain-tabs .is-active {
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
}

html[data-ios] body:not(.Body--isAppleDevice) .ProfileMain-tabs .is-active {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] body:not(.Body--isAppleDevice) .ProfileMain-tabs .is-active {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

.ProfileMainPrivacy-mainContentWrapper {
  height: 383px;
  display: flex;
  justify-content: center;
}

.ProfileMainPrivacy-mainContent {
  display: flex;
  flex-direction: column;
  margin-top: 86px;
  align-items: center;
  color: #8590A6;
}

html[data-theme="dark"] .ProfileMainPrivacy-mainContent {
  color: #606A80;
}

.ProfileMainPrivacy-mainContentText {
  display: flex;
  margin-top: 20px;
}

.ProfileMainPrivacy-mainContentLink {
  font-size: 15px;
}

.ProfileMainPrivacy-authWrapper {
  display: inline-block;
}

.ProfileMainPrivacy-pointerWrapper {
  cursor: pointer;
}
.ProfileLockStatus {
  position: fixed;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}

.ProfileLockStatus-title {
  margin: 42px 0 10px;
  font-size: 20px;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
  color: #1A1A1A;
}

html[data-ios] .ProfileLockStatus-title {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .ProfileLockStatus-title {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

html[data-theme="dark"] .ProfileLockStatus-title {
  color: #999999;
}

.ProfileLockStatus-subtitle {
  margin-bottom: 23px;
  font-size: 16px;
  color: #8590A6;
}

html[data-theme="dark"] .ProfileLockStatus-subtitle {
  color: #606A80;
}

.ProfileLockStatus-avatar {
  display: block;
  width: 140px;
  height: 140px;
  margin: 0 auto;
  border-radius: 50%;
}

.ProfileLockStatus-redirect {
  display: block;
  margin: 0 auto;
  text-decoration: underline;
}

.ProfileLockStatus-redirect:hover {
    color: rgba(23, 81, 153, 0.72);
  }

html[data-theme="dark"] .ProfileLockStatus-redirect:hover {
    color: rgba(23, 81, 153, 0.72);
}

.ProfileLockStatus-redirect:active {
    color: #175199;
  }

html[data-theme="dark"] .ProfileLockStatus-redirect:active {
    color: #175199;
}

.ProfileLockStatus-title,
.ProfileLockStatus-subtitle,
.ProfileLockStatus-avatar,
.ProfileLockStatus-redirect {
  text-align: center;
}
.OrgCreateButton {
  border: none;
  padding: 0;
}

  .OrgCreateButton-logoutModal p {
    padding: 0 24px;
    text-align: center;
  }
.Footer {
  padding: 10px 0 10px 5px;
  font-size: 13px;
  line-height: 2;
  color: #8590A6;
}
  html[data-theme="dark"] .Footer {
  color: #606A80;
}

.Footer-dot::after {
  margin: 0 5px;
  content: '\B7';
}

.Footer-item {
  display: inline-block;
}

a.Footer-item:hover {
  color: #175199;
  cursor: pointer;
}

html[data-theme="dark"] a.Footer-item:hover {
  color: #175199;
}
.IconGraf {
  display: flex;
  margin-bottom: 12px;
}

  .IconGraf:last-child {
    margin-bottom: 0;
  }

.IconGraf-iconWrapper {
  display: inline-block;
  width: 28px;
}

.IconGraf-icon {
  fill: #8590A6;
}

html[data-theme="dark"] .IconGraf-icon {
  fill: #606A80;
}
.SideItem {
  display: flex;
  padding: 20px 0;
  margin-bottom: 24px;
}

  .SideItem:last-child {
    margin-bottom: 0;
  }

.SideItem-image {
  padding-top: 3px;
}

.SideItem--multiline .SideItem-image {
    padding-top: 0;
  }

.SideItem-image img {
    vertical-align: top;
  }

.SideItem-content {
  flex: 1;
  padding-left: 20px;
}

.SideItem-title {
  font-size: 15px;
  color: #1A1A1A;
}

.SideItem--multiline .SideItem-title {
    font-size: 18px;
  }

html[data-theme="dark"] .SideItem-title {
  color: #999999;
}

.SideItem-description {
  max-height: 52px;
  margin-top: 2px;
  overflow: hidden;
  font-size: 14px;
  color: #8590A6;
  text-overflow: ellipsis;
}

.SideItem--multiline .SideItem-description {
    margin-top: 8px;
  }

html[data-theme="dark"] .SideItem-description {
  color: #606A80;
}
.Publication-title:hover {
  color: #175199;
}
  html[data-theme="dark"] .Publication-title:hover {
  color: #175199;
}

.Publications-content {
  padding: 4px 20px;
}

.Publication-item:not(:first-child) {
  display: block;
  border-top: 1px solid #F6F6F6;
}

html[data-theme="dark"] .Publication-item:not(:first-child) {
  border-top: 1px solid #2E2E2E;
}

.Publication-summary {
  line-height: 24px;
  color: #1A1A1A;
  display: -webkit-box;
  text-overflow: ellipsis;
  overflow: hidden;
  -webkit-line-clamp: 2;
  /* autoprefixer: ignore next */
  -webkit-box-orient: vertical;
}

html[data-theme="dark"] .Publication-summary {
  color: #999999;
}

.Publication-image {
  width: 80px;
  border-radius: 3px;
  box-shadow: 0 1px 3px rgba(26, 26, 26, 0.1);
}

html[data-theme='dark'] .Publication-image {
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
  }
.FollowshipCard {
  font-size: 14px;
}

  .FollowshipCard .NumberBoard-itemInner {
    padding: 12px 0;
  }

.FollowshipCard-counts:not(:last-child) {
    border-bottom: 1px solid #F6F6F6;
  }

html[data-theme="dark"] .FollowshipCard-counts:not(:last-child) {
    border-bottom: 1px solid #2E2E2E;
}

.FollowshipCard-link {
  color: #175199;
}

.FollowshipCard-link:hover {
    border-bottom: 1px solid #175199;
  }

html[data-theme="dark"] .FollowshipCard-link:hover {
    border-bottom: 1px solid #175199;
}

html[data-theme="dark"] .FollowshipCard-link {
  color: #175199;
}

.FollowshipCard-avatars {
  margin-top: 12px;
}

.FollowshipCard-item:not(:first-child) {
    margin-top: 12px;
  }

.FollowshipCard-icon {
  margin-right: 8px;
}

.FollowshipCard-avatar {
  margin-left: 8px;
}

.FollowshipCard-avatar:first-child {
    margin-left: 0;
  }
.AnalyticsCountDelta {
  align-items: center;
  display: flex;
}

.AnalyticsCountDelta-text {
  font-size: 14px;
  color: #8590A6;
  margin-right: 8px;
}

html[data-theme="dark"] .AnalyticsCountDelta-text {
  color: #606A80;
}

.AnalyticsCountDelta-number {
  font-size: 12px;
  margin-left: 4px;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
}

html[data-ios] .AnalyticsCountDelta-number {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .AnalyticsCountDelta-number {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

.AnalyticsCountDelta-upIcon {
  color: #0084FF;
}

html[data-theme="dark"] .AnalyticsCountDelta-upIcon {
  color: #3A76D0;
}

.AnalyticsCountDelta-downIcon {
  color: #FF3366;
}

html[data-theme="dark"] .AnalyticsCountDelta-downIcon {
  color: #D92155;
}
.ProfileSideCreator {
  cursor: pointer;
}

.ProfileSideCreator-link {
  display: flex;
  flex-direction: column;
}

.ProfileSideCreator-entrance {
  align-items: center;
  display: flex;
  height: 56px;
  padding: 0 20px 0 4px;
}

.ProfileSideCreator-image {
  height: 40px;
  width: 80px;
}

.ProfileSideCreator-text {
  display: flex;
  flex-direction: column;
  flex-grow: 1;
  margin-left: 6px;
  line-height: 16px;
}

.ProfileSideCreator-title {
  color: #1A1A1A;
  font-size: 14px;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
}

html[data-ios] .ProfileSideCreator-title {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .ProfileSideCreator-title {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

html[data-theme="dark"] .ProfileSideCreator-title {
  color: #999999;
}

.ProfileSideCreator-entranceMessage {
  color: #999999;
  font-size: 12px;
  margin-top: 2px;
}

html[data-theme="dark"] .ProfileSideCreator-entranceMessage {
  color: #646464;
}

.ProfileSideCreator-seen {
  background: #FF3366;
  border-radius: 50%;
  height: 6px;
  margin-left: 8px;
  width: 6px;
}

html[data-theme="dark"] .ProfileSideCreator-seen {
  background: #D92155;
}

.ProfileSideCreator-arrow {
  color: #8590A6;
}

html[data-theme="dark"] .ProfileSideCreator-arrow {
  color: #606A80;
}

.ProfileSideCreator-analytics {
  border-top: 1px solid #F6F6F6;
  display: flex;
  padding: 20px 0;
}

html[data-theme="dark"] .ProfileSideCreator-analytics {
  border-top: 1px solid #2E2E2E;
}

.ProfileSideCreator-readCountItem {
  align-items: center;
  border-right: 1px solid #EBEBEB;
  display: flex;
  flex: 1 0 0;
  flex-direction: column;
}

.ProfileSideCreator-readCountItem:last-child {
    border-right: none;
  }

html[data-theme="dark"] .ProfileSideCreator-readCountItem {
  border-right: 1px solid #444444;
}

.ProfileSideCreator-readCountTitle {
  color: #8590A6;
  font-size: 12px;
  line-height: 22px;
}

html[data-theme="dark"] .ProfileSideCreator-readCountTitle {
  color: #606A80;
}

.ProfileSideCreator-readCountNumber {
  color: #444444;
  font-size: 18px;
  line-height: 28px;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
}

html[data-ios] .ProfileSideCreator-readCountNumber {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .ProfileSideCreator-readCountNumber {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

html[data-theme="dark"] .ProfileSideCreator-readCountNumber {
  color: #808080;
}

.ProfileSideCreator-readCountDeltaText {
  font-size: 12px;
}
.Profile {
  width: auto;
}

.Profile-main {
  display: flex;
  width: 1000px;
  min-height: 100vh;
  padding: 0 16px;
  margin: 10px auto;
  justify-content: space-between;
  align-items: flex-start;
}

.Profile-mainColumn {
  width: 694px;
}

.Profile-mainColumn .SubTabs-item .Select-button {
    color: inherit;
  }

body:not(.Body--isAppleDevice) .Profile-mainColumn .List-headerText {
    /* 与设计一致，不支持设备将回退为 700 */
    font-weight: 600;
    /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
    font-synthesis: style;
  }

html[data-ios] body:not(.Body--isAppleDevice) .Profile-mainColumn .List-headerText {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] body:not(.Body--isAppleDevice) .Profile-mainColumn .List-headerText {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

body:not(.Body--isAppleDevice) .Profile-mainColumn .SubTabs-item:not(.is-active) {
    font-weight: normal;
    font-weight: initial;
  }

.Profile-sideColumn {
  width: 296px;
  color: #646464;
}

html[data-theme="dark"] .Profile-sideColumn {
  color: #999999;
}

.Profile-sideColumnItems {
  padding: 12px 0;
}

.Profile-sideColumnItem {
  padding: 6px 20px;
}

.Profile-sideColumnItemIncludedText {
  display: inline-block;
}

.Profile-sideColumnItemIncludedInfo {
  margin-left: 2px;
  display: inline;
}

.Profile-sideColumnItemIncludedInfo > *:not(:last-child)::after {
    content: '\3001';
  }

.Profile-sideColumnItemValue {
  margin-top: 6px;
  margin-left: 29px;
  font-size: 14px;
  color: #8590A6;
}

html[data-theme="dark"] .Profile-sideColumnItemValue {
  color: #606A80;
}

.Profile-sideColumnItemTitle {
  display: block;
  margin-bottom: 12px;
}

.Profile-lightList {
  font-size: 14px;
}

.Profile-lightItem {
  padding-left: 5px;
  display: flex;
  align-items: center;
  height: 46px;
  font-size: 14px;
  border-top: 1px solid #EBEBEB;
}

.Profile-lightItem:hover,
  .Profile-lightItem:hover .Profile-lightItemValue {
    color: #175199;
  }

html[data-theme="dark"] .Profile-lightItem:hover, html[data-theme="dark"] .Profile-lightItem:hover .Profile-lightItemValue {
    color: #175199;
}

.Profile-lightItem:last-child {
    border-bottom: 1px solid #EBEBEB;
  }

html[data-theme="dark"] .Profile-lightItem:last-child {
    border-bottom: 1px solid #444444;
}

html[data-theme="dark"] .Profile-lightItem {
  border-top: 1px solid #444444;
}

.Profile-lightItemName {
  flex-grow: 1;
}

.Profile-lightItemValue {
  font-size: 14px;
  color: #8590A6;
}

html[data-theme="dark"] .Profile-lightItemValue {
  color: #606A80;
}

.Profile-footerOperations {
  width: 100%;
  padding: 10px 0 10px 5px;
  box-sizing: border-box;
  margin-top: 6px;
  font-size: 14px;
  line-height: 1.8;
  text-align: left;
  border-bottom: 1px solid #EBEBEB;
}

.Profile-footerOperations,
  .Profile-footerOperations a {
    color: #8590A6;
  }

html[data-theme="dark"] .Profile-footerOperations, html[data-theme="dark"] .Profile-footerOperations a {
    color: #606A80;
}

html[data-theme="dark"] .Profile-footerOperations {
  border-bottom: 1px solid #444444;
}

.Profile-footerDot::after {
  margin-right: 5px;
  margin-left: 5px;
  content: '\B7';
}

.Profile-sideColumnItemLink {
  cursor: pointer;
}

.Profile-sideColumnItemLink:hover {
    color: #175199;
  }

html[data-theme="dark"] .Profile-sideColumnItemLink:hover {
    color: #175199;
}

.Profile-createOrgAccount {
  display: inline-block;
  width: 100%;
  line-height: 60px;
  text-align: center;
  color: #175199;
  cursor: pointer;
}

html[data-theme="dark"] .Profile-createOrgAccount {
  color: #175199;
}

.Profile-createOrgAccountTip {
  text-align: center;
}
.List .EmptyState {
    padding: 70px 0;
  }

.List-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 50px;
  margin: 0 20px;
  border-bottom: 1px solid #F6F6F6;
  box-sizing: border-box;
}

html[data-theme="dark"] .List-header {
  border-bottom: 1px solid #2E2E2E;
}

.List-headerText {
  margin: 0;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
}

html[data-ios] .List-headerText {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .List-headerText {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    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 + .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;
}
.Annotation-mark {
  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: flex;
}

.Annotation-alert {
  margin-right: 5px;
  width: 16px;
  height: 16px;
}

.Annotation-markTitle {
  color: #444444;
  font-size: 15px;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
}

html[data-ios] .Annotation-markTitle {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .Annotation-markTitle {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

html[data-theme="dark"] .Annotation-markTitle {
  color: #808080;
}

.Annotation-markSummary {
  margin-top: 4px;
  color: #444444;
  font-size: 14px;
  line-height: 20px;
  overflow: auto;
}

.Annotation-markSummary a {
    cursor: pointer;
    color: #175199;
    text-decoration: underline;
  }

html[data-theme="dark"] .Annotation-markSummary a {
    color: #175199;
}

html[data-theme="dark"] .Annotation-markSummary {
  color: #808080;
}
.AnnotationTag {
  margin-left: auto;
  padding: 0 12px;
  /* 最多只显示六个字，否则可能导致样式错误。运营有相关的限制，但是为了防止运营错误的配置还是在这里加上 */
  max-width: 136px;
  font-size: 14px;
  line-height: 30px;
  color: #808080;
  background-color: #F6F6F6;
  border-radius: 4px;
}
  html[data-theme="dark"] .AnnotationTag {
  color: #808080;
}
  html[data-theme="dark"] .AnnotationTag {
  background-color: #2E2E2E;
}
.ContentItem-title {
  font-size: 18px;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
  line-height: 1.6;
  color: #1A1A1A;
  margin-top: -4px;
  margin-bottom: -4px;
}
  html[data-ios] .ContentItem-title {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }
  html[data-android] .ContentItem-title {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }
  .ContentItem-title + .ContentItem-meta {
    margin-top: 6px;
  }
  .ContentItem-title a:hover {
    color: #175199;
  }
  html[data-theme="dark"] .ContentItem-title a:hover {
    color: #175199;
}
  html[data-theme="dark"] .ContentItem-title {
  color: #999999;
}

.ContentItem-meta {
  font-size: 15px;
  color: #646464;
}

.ContentItem-meta .ColumnItem-meta,
  .ContentItem-meta .TopicItem-meta {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

html[data-theme="dark"] .ContentItem-meta {
  color: #999999;
}

.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: flex;
  align-items: center;
  padding: 10px 20px;
  margin: 0 -20px -10px;
  color: #646464;
  background: #FFFFFF;
  clear: both;
}

.ContentItem-actions.is-fixed {
    margin: 0;
    box-shadow: 0 -1px 3px rgba(26, 26, 26, 0.1);
  }

html[data-theme="dark"] .ContentItem-actions.is-fixed {
    box-shadow: 0 -1px 3px rgba(153, 153, 153, 0.1);
}

html[data-theme="dark"] .ContentItem-actions {
  color: #999999;
}

html[data-theme="dark"] .ContentItem-actions {
  background: #1A1A1A;
}

.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;
}

.ContentItem-more:hover {
    color: #808080;
  }

html[data-theme="dark"] .ContentItem-more:hover {
    color: #808080;
}

.ContentItem-more .Icon {
    fill: currentColor;
  }

html[data-theme="dark"] .ContentItem-more {
  color: #175199;
}

.ContentItem-time {
  margin-top: 10px;
  font-size: 14px;
  color: #8590A6;
}

.ContentItem-time a:hover {
    border-bottom: 1px solid rgba(133, 144, 166, 0.72);
  }

html[data-theme="dark"] .ContentItem-time a:hover {
    border-bottom: 1px solid rgba(96, 106, 128, 0.72);
}

html[data-theme="dark"] .ContentItem-time {
  color: #606A80;
}

.ContentItem-arrowIcon.is-active {
    -webkit-transform: rotate(180deg);
            transform: rotate(180deg);
  }

.ContentItem-main {
  display: flex;
}

.ContentItem-image {
  float: left;
  margin-right: 16px;
}

.ContentItem-head {
  flex: 1;
  overflow: hidden;
  margin-right: 6px;
}

.ContentItem-extra {
  align-self: center;
}

.ContentItem-cells {
  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;
}
.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;
    transition: max-height 0.32s cubic-bezier(0.95, 0.05, 0.795, 0.035),
      -webkit-mask-size 0.22s cubic-bezier(0.95, 0.05, 0.795, 0.035);
    transition: mask-size 0.22s cubic-bezier(0.95, 0.05, 0.795, 0.035),
      max-height 0.32s cubic-bezier(0.95, 0.05, 0.795, 0.035);
    transition: mask-size 0.22s cubic-bezier(0.95, 0.05, 0.795, 0.035),
      max-height 0.32s cubic-bezier(0.95, 0.05, 0.795, 0.035),
      -webkit-mask-size 0.22s cubic-bezier(0.95, 0.05, 0.795, 0.035);
    -webkit-mask-image: linear-gradient(
      #1A1A1A calc(100% - 8rem),
      transparent calc(100% - 2.8rem)
    );
            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: linear-gradient(
      #999999 calc(100% - 8rem),
      transparent calc(100% - 2.8rem)
    );
            mask-image: linear-gradient(
      #999999 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;
    transition: color 140ms 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: #999999;
  }
}

.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: center;
  background-size: cover;
  border-radius: 4px;
  -webkit-transform: translate3d(
    0,
    0,
    0
  );
          transform: translate3d(
    0,
    0,
    0
  );
}

/* for chrome bug: transform overwrite overflow */

.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, 0.02);
    content: '';
  }

html[data-theme="dark"] .RichContent-cover::after {
    background: rgba(153, 153, 153, 0.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;
  box-shadow: 0 0 4px 0 rgba(26, 26, 26, 0.16);
  border-radius: 50%;
}

html[data-theme="dark"] .RichContent-cover-play {
  box-shadow: 0 0 4px 0 rgba(0, 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: 200ms slideInUp;
          animation: 200ms slideInUp;
}

.RichContent-videoMore {
  text-align: center;
  font-size: 14px;
  margin-top: 30px;
  color: #0084FF;
}

html[data-theme="dark"] .RichContent-videoMore {
  color: #3A76D0;
}

@-webkit-keyframes slideInUp {
  from {
    -webkit-transform: translate3d(0, 100%, 0);
            transform: translate3d(0, 100%, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
  }
}

@keyframes slideInUp {
  from {
    -webkit-transform: translate3d(0, 100%, 0);
            transform: translate3d(0, 100%, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
  }
}
.ShareMenu-button {
  height: 40px;
  font-size: 14px;
}

  .ShareMenu-button .Zi--InsertLink {
    vertical-align: middle;
    margin-right: 4px;
    margin-left: -2px;
  }

.ShareMenu-wechat {
  padding-bottom: 12px;
}

.ShareMenu-fakeQRCode {
  display: none;
}

.ShareMenu-qrCode,
.ShareMenu-wechatText {
  display: block;
}

.ShareMenu-qrCode {
  width: 94px;
  height: 94px;
}

.ShareMenu-isReviewing {
  margin-left: 24px;
}
.CommentButton-text {
  margin-right: 4px;
}

  @media (max-width: 320px) {.CommentButton-text {
    display: none
}
  }
.QuestionItem-title {
  display: flex;
  align-items: center;
}

.QuestionItem-muteStatus {
  display: inline-block;
  padding: 0 6px;
  margin-left: 8px;
  font-size: 12px;
  line-height: 1.5;
  color: #8590A6;
  cursor: default;
  background-color: #F6F6F6;
  border-radius: 3px;
}

html[data-theme="dark"] .QuestionItem-muteStatus {
  color: #606A80;
}

html[data-theme="dark"] .QuestionItem-muteStatus {
  background-color: #2E2E2E;
}

.QuestionItem-icon {
  margin-left: 8px;
}

.QuestionItem-footer {
  display: flex;
  justify-content: space-between;
}

.QuestionItem-answerIcon {
  margin-right: 4px;
}

.QuestionItem-mobileDot {

  margin: 0 10px;
}

.QuestionItem-mobileDot::after {
    content: '\2022';
  }
.RadioButtons {
  font-size: 14px;
  color: #444444;
}

  .RadioButtons-item {
    display: flex;
    align-items: center;
    cursor: pointer;
    padding: 11px 0;
    border-bottom: 1px solid #F6F6F6;
  }

  @media (max-width: 660px) {

  .RadioButtons-item {
      min-height: 48px;
      line-height: 20px
  }
    }

  html[data-theme="dark"] .RadioButtons-item {
    border-bottom: 1px solid #2E2E2E;
}

  .RadioButtons-text {
    flex: 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%;
    transition: background-color, border-color 300ms;
    background-clip: content-box;
    -webkit-appearance: none;
       -moz-appearance: none;
            appearance: none;
  }

  .RadioButtons-input:checked {
      background-color: #0084FF;
      border-color: #0084FF;
    }

  html[data-theme="dark"] .RadioButtons-input:checked {
      background-color: #3A76D0;
}

  html[data-theme="dark"] .RadioButtons-input:checked {
      border-color: #3A76D0;
}

  .RadioButtons-input:focus {
      outline: none;
    }

  html[data-theme="dark"] .RadioButtons-input {
    border: 2px solid #444444;
}

  html[data-theme="dark"] .RadioButtons {
  color: #808080;
}
.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
}
  }
.UserItem-avatar .Avatar,
  .UserItem-avatar .Popover {
    display: block;
  }

.UserItem-title {
  display: flex;
  align-items: center;
}

.UserItem-name {
  display: flex;
}

.UserItem-name .UserLink-badge {
    display: flex;
    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: #999999;
}

.UserItem-company::after {
    margin: 0 5px;
    color: #EBEBEB;
    content: '|';
  }

html[data-theme="dark"] .UserItem-company::after {
    color: #444444;
}

.ContentItem-rewardDetails {
  margin-top: -10px;
}

.ContentItem-rewardAmount {
  font-size: 18px;
  color: #444444;
  line-height: 25px;
}

html[data-theme="dark"] .ContentItem-rewardAmount {
  color: #808080;
}

.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: flex;
  flex-direction: column;
  height: 100%;
}

.VoterList-content {
  flex: 1;
  overflow-y: scroll;
}

.VoterList-description {
  text-align: center;
  color: #8590A6;
  font-size: 14px;
  background: rgba(133, 144, 166, 0.1);
}

.VoterList-description p {
    margin: 12px 24px;
  }

html[data-theme="dark"] .VoterList-description {
  color: #606A80;
}

html[data-theme="dark"] .VoterList-description {
  background: rgba(96, 106, 128, 0.1);
}
.Voters {
  color: #8590A6;
}
  html[data-theme="dark"] .Voters {
  color: #606A80;
}
.AnswerModal-list {
  font-size: 14px;
  line-height: 1.75;
}

  .AnswerModal-list > li:not(:first-child) {
    margin-top: 4px;
  }

.AnswerModal-moreLink {
  display: inline-block;
  margin-top: 8px;
  border-bottom: 1px solid transparent;
  font-size: 14px;
  color: #175199;
}

.AnswerModal-moreLink:hover {
    border-bottom: 1px solid #175199;
  }

html[data-theme="dark"] .AnswerModal-moreLink:hover {
    border-bottom: 1px solid #175199;
}

html[data-theme="dark"] .AnswerModal-moreLink {
  color: #175199;
}
.CircleEntry-openCircleLabel {
  color: #8590A6;
  font-size: 14px;
}

  .CircleEntry-openCircleLabel input {
    margin-right: 9px;
  }

  html[data-theme="dark"] .CircleEntry-openCircleLabel {
  color: #606A80;
}

.CircleEntry-openCircleLabel--withoutReward {
  margin-left: auto;
  position: absolute;
  right: 200px;
}

.CircleEntry-openCircleDraftsLabel {
  margin-left: auto;
  position: absolute;
  right: 345px;
}

.CircleEntry-openCircleDraftsLabel--withoutReward {
  right: 280px;
}
.RewardForm-rewardModal {
  width: 536px;
  font-size: 14px;
  color: #8590A6;
}
  html[data-theme="dark"] .RewardForm-rewardModal {
  color: #606A80;
}

.RewardForm-rewardTitle {
  color: #444444;
  font-size: 24px;
  margin: 40px auto 24px;
  text-align: center;
}

html[data-theme="dark"] .RewardForm-rewardTitle {
  color: #808080;
}

.RewardForm-rewardInput {
  width: 488px;
  height: 48px;
  line-height: 48px;
  border: 1px solid #D3D3D3;
  border-radius: 3px;
}

.RewardForm-rewardInput input {
    height: 36px;
  }

html[data-theme="dark"] .RewardForm-rewardInput {
  border: 1px solid #2E2E2E;
}

.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 {
  display: inline-block;
}

.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: #FFFFFF;
}

.RewardForm-rewardSubmit:hover {
    background-color: #0084FF !important;
    color: #FFFFFF;
  }

html[data-theme="dark"] .RewardForm-rewardSubmit:hover {
    background-color: #3A76D0 !important;
}

html[data-theme="dark"] .RewardForm-rewardSubmit:hover {
    color: #1A1A1A;
}

html[data-theme="dark"] .RewardForm-rewardSubmit {
  background: #3A76D0;
}

html[data-theme="dark"] .RewardForm-rewardSubmit {
  border: 1px solid #3A76D0;
}

html[data-theme="dark"] .RewardForm-rewardSubmit {
  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;
    position: initial;
  }
}
/*
结构：
  body[overflow-hidden]
    ...
    .fullscreenBackdrop # animate
    .fullscreenContent # animate
      .fullscreenScroller # 确保它是 toolbar 和 editable 的 offsetParent
        .title
        .toolbar # sticky
        .editable.isToolbarSticky?
      .footer # fixed
    .cloneEditor # 占位

**全屏**
顶栏：默认边框，吸顶后径向渐变阴影
底栏：始终 box-shadow 阴影

**非全屏**
顶栏：默认边框，吸顶后径向渐变阴影
底栏：默认无边框，吸底后 box-shadow 阴影
*/

@-webkit-keyframes fsFadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@keyframes fsFadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@-webkit-keyframes fsFadeOut {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}

@keyframes fsFadeOut {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}

@-webkit-keyframes fsSlideUp {
  from {
    opacity: 0;
    -webkit-transform: translateY(40px);
            transform: translateY(40px);
  }

  to {
    opacity: 1;
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}

@keyframes fsSlideUp {
  from {
    opacity: 0;
    -webkit-transform: translateY(40px);
            transform: translateY(40px);
  }

  to {
    opacity: 1;
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}

@-webkit-keyframes fsSlideDown {
  from {
    opacity: 1;
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }

  to {
    opacity: 0;
    -webkit-transform: translateY(40px);
            transform: translateY(40px);
  }
}

@keyframes fsSlideDown {
  from {
    opacity: 1;
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }

  to {
    opacity: 0;
    -webkit-transform: translateY(40px);
            transform: translateY(40px);
  }
}

.AnswerForm {
  position: relative;
}

.AnswerForm--bordered {
    border: 1px solid #EBEBEB;
    border-radius: 3px;
  }

html[data-theme="dark"] .AnswerForm--bordered {
    border: 1px solid #444444;
}

.AnswerForm:not(.AnswerForm--bordered) .Editable-toolbar {
      border-top: 1px solid #EBEBEB;
    }

html[data-theme="dark"] .AnswerForm:not(.AnswerForm--bordered) .Editable-toolbar {
      border-top: 1px solid #444444;
}

.AnswerForm .Sticky.is-fixed .Editable-toolbar, .AnswerForm--isToolbarSticky .Editable-toolbar {
    border-top: none;
    border-bottom: none;
  }

.AnswerForm .Sticky.is-fixed .Editable-toolbar::after, .AnswerForm--isToolbarSticky .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, 0.1),
        rgba(255, 255, 255, 0) 80%
      );
      background: radial-gradient(
        ellipse at 50% 1%,
        rgba(26, 26, 26, 0.1),
        rgba(255, 255, 255, 0) 80%
      );
    }

html[data-theme="dark"] .AnswerForm .Sticky.is-fixed .Editable-toolbar::after, html[data-theme="dark"] .AnswerForm--isToolbarSticky .Editable-toolbar::after {
      background: radial-gradient(
        ellipse at 50%, at 1%,
        rgba(153, 153, 153, 0.1),
        rgba(26, 26, 26, 0) 80%
      );
      background: radial-gradient(
        ellipse at 50% 1%,
        rgba(153, 153, 153, 0.1),
        rgba(26, 26, 26, 0) 80%
      );
}

.AnswerForm-fullscreenBackdrop {
  position: absolute;
  z-index: 99;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(26, 26, 26, 0.3);
  -webkit-animation: fsFadeIn 300ms ease-in-out;
          animation: fsFadeIn 300ms ease-in-out;
}

.AnswerForm-fullscreenBackdrop.isLeaveActive {
    -webkit-animation: fsFadeOut 300ms ease-out;
            animation: fsFadeOut 300ms ease-out;
  }

html[data-theme="dark"] .AnswerForm-fullscreenBackdrop {
  background: rgba(153, 153, 153, 0.3);
}

.AnswerForm-fullscreenScroller {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 52px;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  display: flex;
  flex-direction: column;
  background: #FFFFFF;
}

html[data-theme="dark"] .AnswerForm-fullscreenScroller {
  background: #1A1A1A;
}

.AnswerForm-cloneEditor {
  opacity: 1;
}

.AnswerForm-fullscreenContent {
  position: fixed;
  z-index: 100; /* 小于 Popover/Modal 等等 */
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  display: flex;
  flex-direction: column;
  -webkit-animation: fsSlideUp 300ms ease-in-out;
          animation: fsSlideUp 300ms ease-in-out;
}

.AnswerForm-fullscreenContent.isLeaveActive {
    -webkit-animation: fsSlideDown 300ms ease-out;
            animation: fsSlideDown 300ms ease-out;
  }

.AnswerForm-fullscreenContent .RichText {
    height: calc(
      100% - 52px
    ); /* 撑开容器，方便内容区域点击聚焦（减掉实际 toolbar 高度） */
    min-height: 0 !important;
    min-height: initial !important; /* 使容器的高度等于内容的高度 */
  }

.AnswerForm-fullscreenContent .Editable {
    flex: 1;
    height: 100%;
    border: none;
    overflow: visible; /* 重置 Input */
  }

.AnswerForm-fullscreenContent .Editable-toolbar {
    position: -webkit-sticky;
    position: sticky;
    z-index: 10;
    top: 0;
    border-color: #EBEBEB;
    border-width: 1px 0;
    background: #FFFFFF;
  }

html[data-theme="dark"] .AnswerForm-fullscreenContent .Editable-toolbar {
    border-color: #444444;
}

html[data-theme="dark"] .AnswerForm-fullscreenContent .Editable-toolbar {
    background: #1A1A1A;
}

.AnswerForm-fullscreenContent .AnswerForm-container {
    margin-left: auto;
    margin-right: auto;
    max-width: 688px;
    width: 100%;
  }

.AnswerForm-fullscreenContent .AnswerForm-editor {
    position: static;
    display: block;
    flex: 1;
  }

.AnswerForm-fullscreenContent .AnswerForm-footer {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    box-shadow: 0 -1px 3px 0 rgba(23, 81, 153, 0.05);
  }

html[data-theme="dark"] .AnswerForm-fullscreenContent .AnswerForm-footer {
    box-shadow: 0 -1px 3px 0 rgba(23, 81, 153, 0.05);
}

.AnswerForm-enterFullscreenButton {
  padding: 0 6px;
}

.AnswerForm-exitFullscreenButton {
  position: fixed;
  z-index: 11;
  top: 17px;
  right: 17px;
  padding: 0 8px;
  line-height: 30px;
  background: #EBEBEB;
  border-radius: 4px;
  border: none;
}

.AnswerForm-exitFullscreenButton .Icon {
    margin-right: 8px;
    fill: currentColor;
  }

.AnswerForm-exitFullscreenButton:hover {
    color: #808080;
    background: #EBEBEB;
  }

html[data-theme="dark"] .AnswerForm-exitFullscreenButton:hover {
    color: #808080;
}

html[data-theme="dark"] .AnswerForm-exitFullscreenButton:hover {
    background: #444444;
}

html[data-theme="dark"] .AnswerForm-exitFullscreenButton {
  background: #444444;
}

.AnswerForm-title {
  margin: 16px 0;
  padding: 0 20px;
  font-size: 22px;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
}

html[data-ios] .AnswerForm-title {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .AnswerForm-title {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

.AnswerForm-editor.is-focus {
    border: none;
  }

.AnswerForm-editor .Dropzone-overlay {
    margin: 14px 24px;
  }

.AnswerForm-editor,
.AnswerForm-cloneEditor {
  border: none;
  border-radius: 0;
}

.AnswerForm-editor .DraftEditor-root, .AnswerForm-cloneEditor .DraftEditor-root {
    padding: 12px 20px;
    font-size: 15px;
  }

.AnswerForm-footer {
  position: relative;
  background: #FFFFFF;
}

.AnswerForm--isFullscreen .AnswerForm-footer,
  .AnswerForm-footer.is-fixed {
    box-shadow: 0 -1px 3px 0 rgba(23, 81, 153, 0.05);
  }

html[data-theme="dark"] .AnswerForm--isFullscreen .AnswerForm-footer, html[data-theme="dark"] .AnswerForm-footer.is-fixed {
    box-shadow: 0 -1px 3px 0 rgba(23, 81, 153, 0.05);
}

.AnswerForm-footer--hidden {
    pointer-events: none;
    opacity: 0;
  }

html[data-theme="dark"] .AnswerForm-footer {
  background: #1A1A1A;
}

.AnswerForm-footerContent {
  position: relative;
  display: flex;
  align-items: center;
  height: 52px;
  padding: 12px 24px;
  box-sizing: border-box;
  justify-content: space-between;
}

.AnswerForm-status {
  font-size: 14px;
  color: #8590A6;
}

html[data-theme="dark"] .AnswerForm-status {
  color: #606A80;
}

.AnswerForm-delete {
  margin-right: 12px;
}

.AnswerForm-delete:hover .Icon {
    fill: #999999;
  }

html[data-theme="dark"] .AnswerForm-delete:hover .Icon {
    fill: #646464;
}

.AnswerForm-draftStatus--failed {
    color: #F1403C;
  }

html[data-theme="dark"] .AnswerForm-draftStatus--failed {
    color: #B7302D;
}

.AnswerForm-footerRight {
  transition: opacity 300ms ease-out;
  display: flex;
  align-items: center;
}

.AnswerForm-submit {
  margin-left: 22px;
}

.AnswerForm-cancel {
  cursor: pointer;
  color: #175199;
}

.AnswerForm-cancel:hover {
    border-bottom: 1px solid #175199;
  }

html[data-theme="dark"] .AnswerForm-cancel:hover {
    border-bottom: 1px solid #175199;
}

html[data-theme="dark"] .AnswerForm-cancel {
  color: #175199;
}

.AnswerForm-Notication {
  position: absolute;
  right: 300px;
  display: inline-block;
  background: #1A1A1A;
  margin-left: 129px;
  height: 20px;
  opacity: 0.8;
  color: #FFFFFF;
  padding: 8px;
  line-height: 20px;
  border-radius: 4px;
  font-size: 14px;
}

.AnswerForm-Notication::after {
    position: absolute;
    right: -12px;
    z-index: 3;
    width: 0;
    height: 0;
    margin: auto;
    border-right: 8px solid transparent;
    border-left: 8px solid transparent;
    border-radius: 1px;
    content: '';
    border-bottom: 8px solid #1A1A1A;
    -webkit-transform: rotate(90deg);
            transform: rotate(90deg);
    margin-top: 6px;
  }

html[data-theme="dark"] .AnswerForm-Notication::after {
    border-bottom: 8px solid #999999;
}

html[data-theme="dark"] .AnswerForm-Notication {
  background: #999999;
}

html[data-theme="dark"] .AnswerForm-Notication {
  color: #1A1A1A;
}

.AnswerForm-openRewardButton {
  margin-left: auto;
  position: absolute;
  right: 250px;
}

.AnswerForm-openRewardDraftsLabel {
  right: 200px;
}

.AnswerForm-openRewardLabel {
  color: #8590A6;
  font-size: 14px;
}

.AnswerForm-openRewardLabel input {
    margin-right: 9px;
  }

html[data-theme="dark"] .AnswerForm-openRewardLabel {
  color: #606A80;
}
.VoteDownReasonMenu-target {
  z-index: 1;
}

.VoteDownReasonMenu-container {
  box-sizing: border-box;
  font-size: 14px;
  padding: 16px 20px;
  position: relative;
  width: 350px;
}

.VoteDownReasonMenu-header {
  font-weight: 600;
  margin-bottom: 12px;
}

.VoteDownReasonMenu-action {
  color: #8590A6;
  cursor: pointer;
  font-size: 13px;
  line-height: 20px;
  position: absolute;
  right: 20px;
  top: 16px;
}

html[data-theme="dark"] .VoteDownReasonMenu-action {
  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: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}

.VoteDownReasonMenu-reason {
  background: #F6F6F6;
  border-radius: 3px;
  color: #0084FF;
  cursor: pointer;
  display: inline-block;
  line-height: 30px;
  margin-bottom: 10px;
  text-align: center;
  width: 150px;
}

.VoteDownReasonMenu-reason:last-child,
  .VoteDownReasonMenu-reason:nth-last-child(2) {
    margin-bottom: 0;
  }

html[data-theme="dark"] .VoteDownReasonMenu-reason {
  background: #2E2E2E;
}

html[data-theme="dark"] .VoteDownReasonMenu-reason {
  color: #3A76D0;
}

.VoteDownReasonMenu-disableReasonHint {
  margin-bottom: 12px;
}

.VoteDownReasonMenu-disableReasonButtonList {
  display: flex;
  justify-content: space-between;
}

.VoteDownReasonMenu-disableReasonButtonList .Button {
    line-height: 28px;
    width: 150px;
  }
.VoteButton {
  padding: 0 10px;
  color: #0084FF;
  background: rgba(0, 132, 255, 0.1);
  border-color: transparent;
}

  .VoteButton:not(:disabled):hover {
    background-color: rgba(0, 132, 255, 0.15);
  }

  html[data-theme="dark"] .VoteButton:not(:disabled):hover {
    background-color: rgba(58, 118, 208, 0.15);
}

  .VoteButton:disabled:hover {
    background: #F6F6F6;
  }

  html[data-theme="dark"] .VoteButton:disabled:hover {
    background: #2E2E2E;
}

  .VoteButton.is-active {
    color: #FFFFFF;
    background: #0084FF;
  }

  .VoteButton.is-active:hover {
      background-color: #0084FF;
    }

  html[data-theme="dark"] .VoteButton.is-active:hover {
      background-color: #3A76D0;
}

  html[data-theme="dark"] .VoteButton.is-active {
    color: #EBEBEB;
}

  html[data-theme="dark"] .VoteButton.is-active {
    background: #3A76D0;
}

  html[data-theme="dark"] .VoteButton {
  color: #3A76D0;
}

  html[data-theme="dark"] .VoteButton {
  background: rgba(58, 118, 208, 0.1);
}

.VoteButton:focus {
  outline: none;
}

html:not([data-focus-method='pointer']) .VoteButton:focus {
  box-shadow: 0 0 0 2px #FFFFFF, 0 0 0 4px rgba(0, 132, 255, 0.3);
}

html[data-theme="dark"] html:not([data-focus-method='pointer']) .VoteButton:focus {
  box-shadow: 0 0 0 2px #1A1A1A, 0 0 0 4px rgba(58, 118, 208, 0.3);
}

.VoteButton-TriangleUp {
  margin-right: 5px;
}

.VoteButton--down {
  margin-left: 4px;
}

.VoteButton--down.VoteButton--mobileDown {
    margin-left: 8px;
  }
.Reward-activateBtn {
  color: #FFFFFF;
  background: #FF3366;
  width: 80px;
  height: 34px;
  border-radius: 4px;
  margin-bottom: 20px;
  margin-top: 60px;
}
  html[data-theme="dark"] .Reward-activateBtn {
  color: #1A1A1A;
}
  html[data-theme="dark"] .Reward-activateBtn {
  background: #D92155;
}

.Reward-activateHint {
  margin-bottom: 28px;
}
.Reward-editButton {
  margin-left: 15px;
  cursor: pointer;
}

.Reward-money {
  font-size: 24px;
  margin-top: 20px;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
  color: #444444;
}

html[data-ios] .Reward-money {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .Reward-money {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

.Reward-money span {
    cursor: pointer;
  }

html[data-theme="dark"] .Reward-money {
  color: #808080;
}
.Reward-User-text {
  align-self: center;
  cursor: pointer;
  margin: 0 auto 10px;
  max-width: 100px;
}

.Reward-User-img {
  position: relative;
}

.Reward-User-img:hover::before,
    .Reward-User-img:hover::after {
      visibility: visible;
      opacity: 1;
      transition-delay: 300ms;
    }

.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, 0.8);
    border-bottom: 6px solid currentColor;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
  }

html[data-theme="dark"] .Reward-User-img::before {
    color: rgba(153, 153, 153, 0.8);
}

.Reward-User-img::after,
  .Reward-User-img::before {
    content: '';
    position: absolute;
    visibility: hidden;
    opacity: 0;
    left: 38%;
    top: -20px;
    z-index: 10;
    transition: visibility 300ms, opacity 300ms;
  }

.Reward-User-img::after {
    content: attr(data-hover-title);
    -webkit-transform: translate(-50%, -100%);
            transform: translate(-50%, -100%);
    font-size: 13px;
    color: #FFFFFF;
    background: rgba(26, 26, 26, 0.8);
    border-radius: 4px;
    white-space: nowrap;
    padding: 3px 8px;
  }

html[data-theme="dark"] .Reward-User-img::after {
    color: #1A1A1A;
}

html[data-theme="dark"] .Reward-User-img::after {
    background: rgba(153, 153, 153, 0.8);
}

.Reward-User-avatar {
  cursor: pointer;
  border-radius: 100px;
  height: 25px;
  width: 25px;
  margin-right: 9px;
}

.Reward-MoreUser {
  cursor: pointer;
  text-align: center;
  width: 25px;
  height: 25px;
  border-radius: 100px;
  display: inline-block;
  background: #F6F6F6;
  margin-right: 9px;
}

.Reward-MoreUser i {
    width: 3px;
    height: 3px;
    background: #BFBFBF;
    border-radius: 45%;
    position: absolute;
    margin-top: 11px;
    margin-left: -2px;
  }

.Reward-MoreUser i:first-child {
      margin-left: -8px;
    }

.Reward-MoreUser i:last-child {
      margin-left: 4px;
    }

html[data-theme="dark"] .Reward-MoreUser i {
    background: #808080;
}

html[data-theme="dark"] .Reward-MoreUser {
  background: #2E2E2E;
}
.Reward-countZero,
.Reward-count {
  margin-top: 20px;
}
.Reward-rewardBtn {
  color: #FFFFFF;
  background: #FF3366;
  width: 80px;
  height: 34px;
  border-radius: 4px;
  margin-top: 27px;
}
  html[data-theme="dark"] .Reward-rewardBtn {
  color: #1A1A1A;
}
  html[data-theme="dark"] .Reward-rewardBtn {
  background: #D92155;
}
.Reward {
  text-align: center;
  color: #808080;
  font-size: 14px;
}
  html[data-theme="dark"] .Reward {
  color: #808080;
}

.Reward-tagline {
  margin-top: 60px;
  line-height: 18px;
  font-size: 15px;
}
.TPass {
  display: inline-block;
  border-color: #BFBFBF;
}
  html[data-theme="dark"] .TPass {
  border-color: #808080;
}

.TPass-wrapper {
  display: block;
  position: relative;
  font-size: 14px;
  color: #646464;
  border-color: inherit;
}

html[data-theme="dark"] .TPass-wrapper {
  color: #999999;
}

.TPass-input {
  opacity: 0;
  position: absolute;
  top: 0;
  left: 0;
  margin-top: 1px;
  margin-left: 1px;
  padding: 0;
  width: 50px;
  height: 50px;
  border: 0;
  border-radius: 4px;
  line-height: 50px;
  text-align: center;
  color: currentColor;
  transition: opacity 0.1s;
}

.TPass-input::-webkit-inner-spin-button,
  .TPass-input::-webkit-outer-spin-button {
    -webkit-appearance: none;
            appearance: none;
  }

.TPass-input:focus {
  opacity: 1;
}

.TPassBoxes {
  display: flex;
  justify-content: space-between;
  width: 352px;
  line-height: 1;
  vertical-align: top;
  overflow: hidden;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}

.TPassBox {
  box-sizing: border-box;
  border-radius: 4px;
  display: block;
  width: 50px;
  height: 50px;
  border: 1px solid;
  border-color: inherit;
  line-height: 50px;
  text-align: center;
  vertical-align: top;
}

.TPassBox-mask::before {
  content: '';
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 4px;
  background: currentColor;
  color: #808080;
}

html[data-theme="dark"] .TPassBox-mask::before {
  color: #808080;
}

.TPassBoxes,
.TPassBox {
  transition: border-color 0.1s;
}
.Spinner {
  contain: strict;
  display: block;
  margin: 0 auto;
  width: 24px;
  height: 24px;
  line-height: 24px;
}

.Spinner-loading {
  display: inline-block;
  width: 16px;
  height: 16px;
  margin: 0 auto;
  border-radius: 100px;
  border: 4px solid #F1403C;
  border-top-color: transparent;
  -webkit-animation: rotate 0.8s infinite linear;
          animation: rotate 0.8s infinite linear;
}

html[data-theme="dark"] .Spinner-loading {
  border: 4px solid #B7302D;
}

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

  100% {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}

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

  100% {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}
.Payment {
  font-size: 14px;
  text-align: center;
  color: #646464;
  margin-top: 16px;
}
  html[data-theme="dark"] .Payment {
  color: #999999;
}

.Payment-placeholder {
  height: 20px;
  padding: 70px;
  text-align: center;
}

.Payment-placehoder--empty {
  margin-bottom: -16px;
}

.PaymentsList {
  text-align: left;
  margin: 0 -16px -16px;
  line-height: 50px;
}

.PaymentsList .Popover {
    position: absolute;
    right: 26px;
  }

.Payment-Popover {
  border: none;
  padding-left: 4px;
  padding-right: 0;
}

.Payment-Topline,
.Payment-Bottomline {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  height: 1px;
  color: #EBEBEB;
  background: currentColor;
  width: 353px;
  margin-left: 23px;
}

html[data-theme="dark"] .Payment-Topline, html[data-theme="dark"] .Payment-Bottomline {
  color: #444444;
}

.PaymentWay {
  font-size: 14px;
  color: #999999;
  margin-left: 23px;
  margin-right: 118px;
}

html[data-theme="dark"] .PaymentWay {
  color: #646464;
}

.Payment-select-list {
  width: auto;
  min-width: 187px;
}

.Popover-targetContainer-verification {
  width: auto;
  min-width: 187px;
}

.PaymentItem svg {
    margin-right: 4px;
  }

.PaymentItem:hover {
    background: #F6F6F6;
  }

html[data-theme="dark"] .PaymentItem:hover {
    background: #2E2E2E;
}

.PaymentItem .icon {
    vertical-align: -4px;
    margin-right: 6px;
  }

.PaymentItem--disabled {
  color: #999999;
  pointer-events: none;
}

html[data-theme="dark"] .PaymentItem--disabled {
  color: #646464;
}

.Payment-wechatPay,
.Payment-balancePay {
  line-height: 40px;
  padding-top: 20px;
  padding-bottom: 8px;
}

.Payment-wechatPay .icon, .Payment-balancePay .icon {
    margin-right: 6px;
  }

.Payment-wechatPayTitle,
.Payment-balancePayTitle {
  font-size: 24px;
  color: #444444;
  line-height: 33px;
  flex-direction: row;
  align-items: center;
  justify-content: center;
}

html[data-theme="dark"] .Payment-wechatPayTitle, html[data-theme="dark"] .Payment-balancePayTitle {
  color: #808080;
}

.PaymentIconWechat {
  color: #999999;
}

html[data-theme="dark"] .PaymentIconWechat {
  color: #646464;
}

.PaymentIconWallet {
  color: #0084FF;
}

.PaymentItem--disabled .PaymentIconWallet {
    color: #999999;
  }

html[data-theme="dark"] .PaymentItem--disabled .PaymentIconWallet {
    color: #646464;
}

html[data-theme="dark"] .PaymentIconWallet {
  color: #3A76D0;
}

.Payment-CheckedButton {
  display: block;
  margin: 19px 24px 0 22px;
  height: 44px;
  width: 353px;
  border-radius: 4px;
  background: #0084FF;
  border: 1px solid #0084FF;
  color: #FFFFFF;
  font-size: 16px;
}

.Payment-CheckedButton:hover {
    background-color: #0084FF;
  }

html[data-theme="dark"] .Payment-CheckedButton:hover {
    background-color: #3A76D0;
}

@media (max-width: 690px) {

.Payment-CheckedButton {
    width: 295px;
    margin-bottom: 20px
}
  }

html[data-theme="dark"] .Payment-CheckedButton {
  background: #3A76D0;
}

html[data-theme="dark"] .Payment-CheckedButton {
  border: 1px solid #3A76D0;
}

html[data-theme="dark"] .Payment-CheckedButton {
  color: #1A1A1A;
}

.Payment-balancePaySms {
  flex-wrap: wrap;
  flex-direction: row;
  position: relative;
}

.Payment-balancePaySmsText {
  flex: 100%;
}

.Payment-sms {
  flex: 100%;
}

.Payment-sendSms {
  position: absolute;
  right: 0;
  top: 44px;
  border: none;
  line-height: 33px;
  color: currentColor;
  background: none;
}

.Payment-sendSms:hover {
    text-decoration: underline;
    cursor: pointer;
  }

.Payment-sendSms[disabled] {
    color: #999999;
    cursor: not-allowed;
  }

html[data-theme="dark"] .Payment-sendSms[disabled] {
    color: #646464;
}

.Payment-qrWrapper,
.Payment-qrPlaceholder {
  margin: 0 auto;
  width: 115px;
  height: 115px;
  color: #999999;
}

.Payment-qrWrapper i, .Payment-qrPlaceholder i {
    margin: 20px;
  }

.Payment-qrWrapper img, .Payment-qrPlaceholder img {
    width: 115px;
    height: 115px;
  }

html[data-theme="dark"] .Payment-qrWrapper, html[data-theme="dark"] .Payment-qrPlaceholder {
  color: #646464;
}

.Payment-qrPlaceholder {
  padding-top: 30px;
}

.Payment-qrPlaceholder img {
  position: absolute;
  bottom: 0;
  opacity: 0.01;
}

.Payment-balancePayFooter {
  padding: 20px 0 0;
  flex-direction: row;
}

.Payment-balancePayConfirmBtn {
  width: 60px;
  padding: 0;
}

.Payment-balancePayForget {
  font-size: 13px;
  line-height: 24px;
  color: #8590A6;
  margin-top: 20px;
}

html[data-theme="dark"] .Payment-balancePayForget {
  color: #606A80;
}

.Payment-errorTip {
  flex: 1;
  color: #F1403C;
  text-align: center;
  line-height: 36px;
}

html[data-theme="dark"] .Payment-errorTip {
  color: #B7302D;
}

.Payment-errorInput {
  border-color: #F1403C;
}

.Payment-errorInput .TPass-wrapper {
    color: #F1403C;
  }

html[data-theme="dark"] .Payment-errorInput .TPass-wrapper {
    color: #B7302D;
}

html[data-theme="dark"] .Payment-errorInput {
  border-color: #B7302D;
}

.Payment-errorInput input {
  outline-color: #F1403C;
}

html[data-theme="dark"] .Payment-errorInput input {
  outline-color: #B7302D;
}

/* 支付密码 */
.Payment-tpass {
  position: relative;
  margin-top: 41px;
}
.Payment-tpass .TPass-wrapper {
    color: #BFBFBF;
  }
html[data-theme="dark"] .Payment-tpass .TPass-wrapper {
    color: #808080;
}

.Payment-progressing .TPass-wrapper {
    visibility: hidden;
  }

.Payment-balancePaySpinner {
  margin-top: -24px;
  -webkit-transform: translateY(-4px);
          transform: translateY(-4px);
}

.Payment-email {
  color: #0084FF;
}

html[data-theme="dark"] .Payment-email {
  color: #3A76D0;
}

.Payment-description {
  font-size: 14px;
  color: #8590A6;
  line-height: 24px;
  margin-top: 2px;
}

html[data-theme="dark"] .Payment-description {
  color: #606A80;
}
.Reward-TipjarDialogModal {
  width: 400px;
}

.Reward-TipjarDialog {
  display: flex;
  flex-direction: column;
  flex-shrink: 0;
  align-items: stretch;
}

.Reward-TipjarDialog-user {
  font-size: 18px;
  color: #444444;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
  flex-direction: row;
  padding: 16px 0 0;
}

html[data-ios] .Reward-TipjarDialog-user {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .Reward-TipjarDialog-user {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

.Reward-TipjarDialog-user .Reward-UserAvatar {
    margin-right: 16px;
    display: inline-block;
    vertical-align: middle;
  }

.Reward-TipjarDialog-user .Reward-UserAvatar img {
      display: block;
      border-radius: 2px;
    }

html[data-theme="dark"] .Reward-TipjarDialog-user {
  color: #808080;
}

.Reward-Avatar {
  width: 36px;
  height: 36px;
}

.Reward-TipjarDialog-tagLine {
  height: 30px;
  font-size: 14px;
  margin-top: 20px;
  line-height: 30px;
  background: #F6F6F6;
  border-radius: 4px;
  padding: 5px 10px;
  color: #444444;
  margin-bottom: 20px;
  position: relative;
}

html[data-theme="dark"] .Reward-TipjarDialog-tagLine {
  background: #2E2E2E;
}

html[data-theme="dark"] .Reward-TipjarDialog-tagLine {
  color: #808080;
}

.Reward-TipjarDialog-selectAmount {
  display: flex;
  flex-direction: column;
  flex-shrink: 0;
  align-items: stretch;
}

.Reward-TipjarDialog-amountList {
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-between;
  display: flex;
}

.Reward-TipjarDialog-amountList .Button {
    width: 28%;
    margin: 0 0 24px;
    font-size: 14px;
  }

.Reward-TipjarDialog-amountList .Button--red {
    border-color: #F1403C;
    color: #F1403C;
  }

html[data-theme="dark"] .Reward-TipjarDialog-amountList .Button--red {
    border-color: #B7302D;
}

html[data-theme="dark"] .Reward-TipjarDialog-amountList .Button--red {
    color: #B7302D;
}

.Reward-TipjarDialog-amountList .Reward-Button-checked {
    background: #F1403C;
    color: #FFFFFF;
  }

/* HACK: 移动端元素被点击（touch）之后会保持在 :hover 状态下，需要覆盖 :hover 的样式 */

.Reward-TipjarDialog-amountList .Reward-Button-checked.Button--red:hover:not(:disabled) {
      background-color: #F1403C;
    }

html[data-theme="dark"] .Reward-TipjarDialog-amountList .Reward-Button-checked.Button--red:hover:not(:disabled) {
      background-color: #B7302D;
}

html[data-theme="dark"] .Reward-TipjarDialog-amountList .Reward-Button-checked {
    background: #B7302D;
}

html[data-theme="dark"] .Reward-TipjarDialog-amountList .Reward-Button-checked {
    color: #1A1A1A;
}

.Reward-TipjarDialog-amountList b {
    margin-right: 0.2em;
    font-size: 16px;
  }

.Reward-TipjarDialog-amountCustom {
  flex-direction: row;
  justify-content: center;
  margin-top: 6px;
}

.Reward-TipjarDialog-amountInput {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  flex-basis: 100%;
}

.Reward-TipjarDialog-amountInput .Button {
    margin-left: 21px;
    height: 34px;
    width: 68px;
    line-height: 34px;
    margin-top: 1px;
  }

.Reward-TipjarDialog-amountInput .SimpleInput {
    flex: 1;
    min-height: 0;
    outline: none;
    padding: 0 4px;
    -webkit-appearance: none;
       -moz-appearance: none;
            appearance: none;
    font-size: 14px;
    line-height: 20px;
    margin-bottom: 2px;
    border: 1px solid #D3D3D3;
    box-shadow: 0 1px 2px 0 rgba(255, 255, 255, 0.12);
    border-radius: 3px;
    width: 261px;
    height: 36px;
  }

.Reward-TipjarDialog-amountInput .SimpleInput::-webkit-input-placeholder {
      color: #8590A6;
    }

.Reward-TipjarDialog-amountInput .SimpleInput:-ms-input-placeholder {
      color: #8590A6;
    }

.Reward-TipjarDialog-amountInput .SimpleInput::-ms-input-placeholder {
      color: #8590A6;
    }

.Reward-TipjarDialog-amountInput .SimpleInput::placeholder {
      color: #8590A6;
    }

html[data-theme="dark"] .Reward-TipjarDialog-amountInput .SimpleInput::-webkit-input-placeholder {
      color: #606A80;
}

html[data-theme="dark"] .Reward-TipjarDialog-amountInput .SimpleInput:-ms-input-placeholder {
      color: #606A80;
}

html[data-theme="dark"] .Reward-TipjarDialog-amountInput .SimpleInput::-ms-input-placeholder {
      color: #606A80;
}

html[data-theme="dark"] .Reward-TipjarDialog-amountInput .SimpleInput::placeholder {
      color: #606A80;
}

html[data-theme="dark"] .Reward-TipjarDialog-amountInput .SimpleInput {
    border: 1px solid #2E2E2E;
}

html[data-theme="dark"] .Reward-TipjarDialog-amountInput .SimpleInput {
    box-shadow: 0 1px 2px 0 rgba(26, 26, 26, 0.12);
}

.TipjarDialog-customButton {
  display: block;
  margin: 0 auto;
  color: #F1403C;
}

html[data-theme="dark"] .TipjarDialog-customButton {
  color: #B7302D;
}

.TipjarDialog-customButton-cheked {
  background: #F1403C;
  border: 1px solid #F1403C;
  border-radius: 3px;
  width: 140px;
  height: 34px;
  font-size: 12px;
  color: #FFFFFF;
  text-align: center;
  margin: 0 auto;
  display: block;
}

.TipjarDialog-customButton-cheked:hover {
    background-color: #F1403C;
  }

html[data-theme="dark"] .TipjarDialog-customButton-cheked:hover {
    background-color: #B7302D;
}

html[data-theme="dark"] .TipjarDialog-customButton-cheked {
  background: #B7302D;
}

html[data-theme="dark"] .TipjarDialog-customButton-cheked {
  border: 1px solid #B7302D;
}

html[data-theme="dark"] .TipjarDialog-customButton-cheked {
  color: #1A1A1A;
}

.Reward-TipjarDialog-error {
  color: #F1403C;
  margin-top: 6px;
  display: none;
  flex: 100%;
  order: 1;
}

html[data-theme="dark"] .Reward-TipjarDialog-error {
  color: #B7302D;
}

@media (max-width: 690px) {
  .Reward-TipjarDialogModal {
    width: 90%;
  }
    .Reward-TipjarDialog-amountList .Button {
      height: 40px;
      width: 87px;
    }

    .Reward-TipjarDialog-amountList b {
      margin-right: 0;
    }
}

/* HACK: 在 body 锁定滚动时，会使用 fixed 定位，为了使 Popover 正常定位，需要配合使用 fixed */
/* @see http://jira.in.zhihu.com/browse/WEBB-328 */
body.scroll-locked .Popover-content {
  position: fixed;
}
.CommercialQuestionTail {
  align-items: center;
  display: flex;
  font-size: 14px;
  color: #0084FF;
}
  html[data-theme="dark"] .CommercialQuestionTail {
  color: #3A76D0;
}

.CommercialQuestionTail-Icon {
  color: #0084FF;
  margin-left: 4px;
}

html[data-theme="dark"] .CommercialQuestionTail-Icon {
  color: #3A76D0;
}
.Label-icon {
  width: 84px;
  height: 20px;
  display: inline-flex;
  align-items: center;
  box-sizing: border-box;
  font-size: 15px;
  margin-right: 4px;
}

.Label-iconImg {
  width: 20px;
  height: 20px;
}

.Label-iconColor--commercial {
    color: rgba(23, 81, 153, 0.72);
  }

html[data-theme="dark"] .Label-iconColor--commercial {
    color: rgba(23, 81, 153, 0.72);
}

.Label-iconColor--positive {
    color: #C2A469;
  }

html[data-theme="dark"] .Label-iconColor--positive {
    color: #806E46;
}
.Labels-item + .Labels-item {
  margin-top: 8px;
}
.PositiveLabelLayout-popover {
  margin-top: 8px !important;
}

.PositiveLabelLayout-popover.is-mobile {
  border: none;
  border-radius: 10px;
  box-shadow: 0 3px 18px rgba(26, 26, 26, 0.2);
}

html[data-theme="dark"] .PositiveLabelLayout-popover.is-mobile {
  box-shadow: 0 3px 18px rgba(0, 0, 0, 0.2);
}

.PositiveLabelLayout-popover .Popover-arrow::after {
  border: none;
  border-radius: 4px;
  box-shadow: 2px 2px 8px rgba(26, 26, 26, 0.2);
}

html[data-theme="dark"] .PositiveLabelLayout-popover .Popover-arrow::after {
  box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.2);
}

.PositiveLabelLayout-list {
  width: 345px;
  padding: 8px 0;
}
.PositiveLabelBar {
  height: 42px;
  padding: 0 12px;
  border-radius: 6px;
  font-size: 14px;
  line-height: 20px;
  color: #C2A469;
  background-color: rgba(194, 164, 105, 0.08);
}
  html[data-theme="dark"] .PositiveLabelBar {
  color: #806E46;
}
  html[data-theme="dark"] .PositiveLabelBar {
  background-color: rgba(128, 110, 70, 0.08);
}

.PositiveLabelBar--link {
  display: block;
  text-decoration: none;
}

.PositiveLabelBar--expandable {
  cursor: pointer;
}

.PositiveLabelBar-content {
  display: flex;
  align-items: center;
  height: 100%;
}

.PositiveLabelBar-icon {
  width: 20px;
  height: 20px;
  margin-right: 4px;
}

.PositiveLabelBar-main {
  overflow: hidden;
  flex: 1;
  white-space: nowrap;
  text-overflow: ellipsis;
  line-height: normal;
}

.PositiveLabelBar-side {
  margin-left: 12px;
  line-height: normal;
}

.PositiveLabelBar-title {
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
}

html[data-ios] .PositiveLabelBar-title {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .PositiveLabelBar-title {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

.PositiveLabelBar-link {
  display: flex;
  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, 0.08);
}
  html[data-theme="dark"] .PositiveLabelRoundtableBar {
  color: #806E46;
}
  html[data-theme="dark"] .PositiveLabelRoundtableBar {
  background-color: rgba(128, 110, 70, 0.08);
}

.PositiveLabelRoundtableBar--link {
  display: block;
  text-decoration: none;
}

.PositiveLabelRoundtableBar-content {
  display: flex;
  align-items: center;
  height: 100%;
}

.PositiveLabelRoundtableBar-icon {
  width: 48px;
  height: 48px;
  margin-left: -4px;
  margin-right: 4px;
}

.PositiveLabelRoundtableBar-main {
  overflow: hidden;
  flex: 1;
}

.PositiveLabelRoundtableBar-side {
  margin-left: 12px;
}

.PositiveLabelRoundtableBar-header {
  display: flex;
  align-items: center;
}

.PositiveLabelRoundtableBar-title {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;

  /* 与设计一致，不支持设备将回退为 700 */

  font-weight: 600;

  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */

  font-synthesis: style;
}

html[data-ios] .PositiveLabelRoundtableBar-title {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .PositiveLabelRoundtableBar-title {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

.PositiveLabelRoundtableBar-badge {
  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: flex;
  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: flex;
  align-items: center;
  height: 100%;
}

.PositiveLabelItem-icon {
  width: 20px;
  height: 20px;
  margin-right: 4px;
}

.PositiveLabelItem-main {
  overflow: hidden;
  flex: 1;
  white-space: nowrap;
  text-overflow: ellipsis;
  line-height: normal;
}

.PositiveLabelItem-side {
  margin-left: 12px;
  line-height: normal;
}

.PositiveLabelItem-title {
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
}

html[data-ios] .PositiveLabelItem-title {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .PositiveLabelItem-title {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

.PositiveLabelItem-linkIcon {
  display: block;
  width: 24px;
  height: 24px;
  margin: -2px;
}
.CircleLabelBar {
  height: 42px;
  padding: 0 12px;
  border-radius: 6px;
  font-size: 14px;
  line-height: 20px;
  color: #175199;
  background-color: rgba(0, 132, 255, 0.08);
}
  html[data-theme="dark"] .CircleLabelBar {
  color: #175199;
}
  html[data-theme="dark"] .CircleLabelBar {
  background-color: rgba(58, 118, 208, 0.08);
}

.CircleLabelBar-content {
  display: flex;
  align-items: center;
  height: 100%;
}

.CircleLabelBar-icon {
  width: 20px;
  height: 20px;
  margin-right: 4px;
}

.CircleLabelBar-main {
  overflow: hidden;
  flex: 1;
  white-space: nowrap;
  text-overflow: ellipsis;
  line-height: normal;
}

.CircleLabelBar-side {
  margin-left: 12px;
  line-height: normal;
}

.CircleLabelBar-title {
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
}

html[data-ios] .CircleLabelBar-title {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .CircleLabelBar-title {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

.CircleLabelBar-link {
  display: flex;
  align-items: center;
}

.CircleLabelBar-linkDescription {
  margin-right: 2px;
}

.CircleLabelBar-linkIcon {
  width: 24px;
  height: 24px;
  margin: -2px;
}
.PaidContentLabel {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 9px 14px;
  font-size: 14px;
  color: #175199;
  opacity: 0.72;
  border-radius: 6px;
  background: rgba(0, 132, 255, 0.08);
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
}
  html[data-ios] .PaidContentLabel {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }
  html[data-android] .PaidContentLabel {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }
  html[data-theme="dark"] .PaidContentLabel {
  color: #175199;
}
  html[data-theme="dark"] .PaidContentLabel {
  background: rgba(58, 118, 208, 0.08);
}

.PaidContentLabel-main {
  display: flex;
  align-items: center;
  line-height: normal;
}

.PaidContentLabel-vipFree {
  color: #B38D59;
  background: rgba(179, 141, 89, 0.08);
}

html[data-theme="dark"] .PaidContentLabel-vipFree {
  color: #735B39;
}

html[data-theme="dark"] .PaidContentLabel-vipFree {
  background: rgba(115, 91, 57, 0.08);
}

.PaidContentLabel-icon {
  width: 18px;
  height: 18px;
  margin-right: 6px;
}
.LabelContainer {
  margin: 10px 0;
}

.LabelContainer-placeholder {
  height: 42px;
}
.ActivityItem-StickyMark {
  padding: 3px;
  line-height: 1;
  font-size: 14px;
  color: #3a76d0;
  border: #3a76d0 solid 1px;
  font-weight: 400;
  border-radius: 2px;
  display: inline-block;
  vertical-align: middle;
  margin: -3px 11px -3px 0;
}

.ActivityItem-StickyMark + a,
.ActivityItem-StickyMark + span {
  vertical-align: middle;
}
.AnswerItem-meta {
  position: relative;
  margin-top: 14px;
}

  .AnswerItem-meta .AnswerItem-sticky {
    font-size: 14px;
    color: #8590A6;
    cursor: default;
  }

  html[data-theme="dark"] .AnswerItem-meta .AnswerItem-sticky {
    color: #606A80;
}

.AnswerItem-selfMenu {
  font-size: 14px;
  color: #8590A6;
}

html[data-theme="dark"] .AnswerItem-selfMenu {
  color: #606A80;
}

.AnswerItem-selfMenuItem {
  line-height: 40px;
}

.AnswerItem-selectMenuItem {
  position: relative;
  padding-left: 44px;
  line-height: 40px;
}

.AnswerItem-selectMenuItem .Icon {
    position: absolute;
    top: 10px;
    left: 20px;
  }

.AnswerItem-commercialBadge {
  display: block;
  background-color: rgba(201, 164, 105, 0.1);
  color: #C2A469;
  font-size: 14px;
  padding: 12px;
  margin-top: 12px;
  border-radius: 4px;
}

html[data-theme="dark"] .AnswerItem-commercialBadge {
  color: #806E46;
}

.AnswerItem-commercialBadge-brand {
  background: rgba(0, 132, 255, 0.08);
  color: rgba(23, 81, 153, 0.72);
}

.AnswerItem-commercialBadge-brand .Zi--BadgeWrite {
    margin-right: 6px;
    vertical-align: text-bottom;
  }

html[data-theme="dark"] .AnswerItem-commercialBadge-brand {
  background: rgba(58, 118, 208, 0.08);
}

html[data-theme="dark"] .AnswerItem-commercialBadge-brand {
  color: rgba(23, 81, 153, 0.72);
}

.AnswerItem-extraInfo {
  margin-top: 10px;
  margin-bottom: -4px;
  font-size: 14px;
  color: #8590A6;
}

html[data-theme="dark"] .AnswerItem-extraInfo {
  color: #606A80;
}

.AnswerItem-statusContent {
  padding: 16px;
  margin: 16px 0;
  background: #F6F6F6;
  border-radius: 4px;
}

html[data-theme="dark"] .AnswerItem-statusContent {
  background: #2E2E2E;
}

.AnswerItem-statusReason {
  font-size: 15px;
  line-height: 26px;
  color: #1A1A1A;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
  margin-bottom: 3px;
}

html[data-ios] .AnswerItem-statusReason {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .AnswerItem-statusReason {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

html[data-theme="dark"] .AnswerItem-statusReason {
  color: #999999;
}

.AnswerItem-statusDescription {
  font-size: 14px;
  line-height: 26px;
  color: #1A1A1A;
}

.AnswerItem-statusDescription .RichContent-inner {
    margin-top: 0;
  }

.AnswerItem-statusDescription .RichContent.is-collapsed .RichContent-inner:hover {
    color: #1A1A1A;
  }

html[data-theme="dark"] .AnswerItem-statusDescription .RichContent.is-collapsed .RichContent-inner:hover {
    color: #999999;
}

.AnswerItem-statusDescription .ContentItem-arrowIcon {
    display: none;
  }

html[data-theme="dark"] .AnswerItem-statusDescription {
  color: #999999;
}

.AnswerItem-statusLink {
  border-bottom: 1px solid #8590A6;
}

.AnswerItem-statusLink:hover,
  .AnswerItem-statusLink:active {
    color: #175199;
    border-bottom: 1px solid #175199;
  }

html[data-theme="dark"] .AnswerItem-statusLink:hover, html[data-theme="dark"] .AnswerItem-statusLink:active {
    color: #175199;
}

html[data-theme="dark"] .AnswerItem-statusLink:hover, html[data-theme="dark"] .AnswerItem-statusLink:active {
    border-bottom: 1px solid #175199;
}

html[data-theme="dark"] .AnswerItem-statusLink {
  border-bottom: 1px solid #606A80;
}

.AnswerItem-complaintLink {
  color: #175199;
  font-weight: normal;
  padding-bottom: 2px;
}

.AnswerItem-complaintLink:hover {
    border-bottom: 1px solid #175199;
  }

html[data-theme="dark"] .AnswerItem-complaintLink:hover {
    border-bottom: 1px solid #175199;
}

html[data-theme="dark"] .AnswerItem-complaintLink {
  color: #175199;
}

.AnswerItem-complaintHelp {
  float: right;
}

.AnswerItem-complaintIcon {
  position: relative;
  top: -1px;
}

.AnswerItem-status {
  padding: 16px;
  margin: 16px 0;
  color: #8590A6;
  background: #EBEBEB;
  border-radius: 4px;
}

.AnswerItem-status a {
    color: #175199;
  }

.AnswerItem-status a:hover {
    border-bottom: 1px solid #175199;
  }

html[data-theme="dark"] .AnswerItem-status a:hover {
    border-bottom: 1px solid #175199;
}

html[data-theme="dark"] .AnswerItem-status a {
    color: #175199;
}

html[data-theme="dark"] .AnswerItem-status {
  color: #606A80;
}

html[data-theme="dark"] .AnswerItem-status {
  background: #444444;
}

.AnswerItem-deleted {
  font-size: 15px;
  color: #8590A6;
  text-align: center;
}

.AnswerItem-deleted a {
    font-size: inherit;
    cursor: pointer;
    color: #175199;
  }

.AnswerItem-deleted a:hover {
    border-bottom: 1px solid #175199;
  }

html[data-theme="dark"] .AnswerItem-deleted a:hover {
    border-bottom: 1px solid #175199;
}

html[data-theme="dark"] .AnswerItem-deleted a {
    color: #175199;
}

html[data-theme="dark"] .AnswerItem-deleted {
  color: #606A80;
}

.AnswerItem-form {
  margin-top: 24px;
}

.AnswerItem-CommercialQuestionTail {
  margin-top: 10px;
}

.AnswerItem-editButton {
  color: #175199;
  cursor: pointer;
}

.AnswerItem-editButton:hover .AnswerItem-editButtonText {
    border-bottom: 1px solid #175199;
  }

html[data-theme="dark"] .AnswerItem-editButton:hover .AnswerItem-editButtonText {
    border-bottom: 1px solid #175199;
}

.AnswerItem-editButton .Icon {
    fill: #175199;
  }

html[data-theme="dark"] .AnswerItem-editButton .Icon {
    fill: #175199;
}

html[data-theme="dark"] .AnswerItem-editButton {
  color: #175199;
}

.AnswerItem-mainAction {
  margin-right: 16px;
  border-color: #0084FF;
  color: #0084FF;
}

.AnswerItem-mainAction--disabled {
    opacity: 0.5;
  }

html[data-theme="dark"] .AnswerItem-mainAction {
  border-color: #3A76D0;
}

html[data-theme="dark"] .AnswerItem-mainAction {
  color: #3A76D0;
}

.Mobile-body .AnswerItem-mainAction {
    margin-right: 12px;
    padding: 0 10px;
    line-height: 28px;
    font-size: 12px;
  }

.Mobile-body .AnswerItem .Icon--comment,
    .Mobile-body .AnswerItem .Icon--star,
    .Mobile-body .AnswerItem .Icon--dots,
    .Mobile-body .AnswerItem .Icon--setting {
      width: 16px !important;
    }

.AnswerItem-authorInfo {
  margin-top: 10px;
}

.AnswerItem-authorInfo--related {
  margin-top: 0;
}

.AnswerItem-brandQuestionPrizeTip {
  margin-top: 8px;
  font-size: 15px;
  color: #8590A6;
}

.AnswerItem-brandQuestionPrizeTip a {
    margin-left: 5px;
    color: #0084FF;
  }

html[data-theme="dark"] .AnswerItem-brandQuestionPrizeTip a {
    color: #3A76D0;
}

html[data-theme="dark"] .AnswerItem-brandQuestionPrizeTip {
  color: #606A80;
}
/* 保持基本一致：~/components/VoteButton.css */
.LikeButton {
  padding: 0 15px;
  text-align: center;
  color: #0084FF;
  background: rgba(0, 132, 255, 0.1);
  border-color: transparent;
  border-radius: 3px;
  box-sizing: border-box;
}
.LikeButton:not(:disabled):hover {
    background-color: rgba(0, 132, 255, 0.15);
  }
html[data-theme="dark"] .LikeButton:not(:disabled):hover {
    background-color: rgba(58, 118, 208, 0.15);
}
.LikeButton:disabled:hover {
    background: #F6F6F6;
  }
html[data-theme="dark"] .LikeButton:disabled:hover {
    background: #2E2E2E;
}
.LikeButton.is-active {
    color: #FFFFFF;
    background: #0084FF;
  }
.LikeButton.is-active:hover {
      background-color: #0084FF;
    }
html[data-theme="dark"] .LikeButton.is-active:hover {
      background-color: #3A76D0;
}
html[data-theme="dark"] .LikeButton.is-active {
    color: #EBEBEB;
}
html[data-theme="dark"] .LikeButton.is-active {
    background: #3A76D0;
}
.LikeButton .Icon {
    margin-right: 7px;
    fill: currentColor;
  }
html[data-theme="dark"] .LikeButton {
  color: #3A76D0;
}
html[data-theme="dark"] .LikeButton {
  background: rgba(58, 118, 208, 0.1);
}
.ArticleItem-authorInfo {
  margin-top: 14px;
}

.ArticleItem-extraInfo {
  margin-top: 8px;
  margin-bottom: -3px;
  font-size: 14px;
  color: #8590A6;
}

html[data-theme="dark"] .ArticleItem-extraInfo {
  color: #606A80;
}

.ArticleItem-image {
  margin-top: 10px;
  width: 100%;
}

.ArticleItem .RichContent-cover-inner img {
  -o-object-fit: cover;
     object-fit: cover;
}

.ArticleItem-status {
  padding: 16px;
  margin: 16px 0;
  color: #8590A6;
  background: #EBEBEB;
  border-radius: 4px;
}

.ArticleItem-status a {
    color: #175199;
  }

.ArticleItem-status a:hover {
    border-bottom: 1px solid #175199;
  }

html[data-theme="dark"] .ArticleItem-status a:hover {
    border-bottom: 1px solid #175199;
}

html[data-theme="dark"] .ArticleItem-status a {
    color: #175199;
}

html[data-theme="dark"] .ArticleItem-status {
  color: #606A80;
}

html[data-theme="dark"] .ArticleItem-status {
  background: #444444;
}
.ColumnItem {
  position: relative;
}

.ColumnItem-more {
  position: absolute;
  top: 0;
  right: 0;
}

.ColumnItem-botton {
  display: block;
  width: 96px;
  line-height: 40px;
}
.EBookItem .ContentItem-title {
  margin-top: 0;
}

.EBookItem-description {
  line-height: 27px;
  margin-top: 12px;
  margin-bottom: 16px;
  color: #1A1A1A;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

html[data-theme="dark"] .EBookItem-description {
  color: #999999;
}

.EBookItem-image {
  border-radius: 3px;
  box-shadow: 0 1px 4px 0 rgba(26, 26, 26, 0.12);
  vertical-align: top;
}

html[data-theme="dark"] .EBookItem-image {
  box-shadow: 0 1px 4px 0 rgba(153, 153, 153, 0.12);
}

.EBookItem-actions {
  margin-top: 4px;
}

.EBookItem-price {
  color: #F1403C;
}

.EBookItem-price del {
    margin-left: 6px;
    color: #8590A6;
  }

html[data-theme="dark"] .EBookItem-price del {
    color: #606A80;
}

html[data-theme="dark"] .EBookItem-price {
  color: #B7302D;
}
.TopicItem-statusLink {
  font-size: 14px;
  color: #175199;
}
  html[data-theme="dark"] .TopicItem-statusLink {
  color: #175199;
}
.FavlistItem-title {
  display: flex;
  align-items: center;
}

.FavlistItem-lockIcon {
  margin-left: 8px;
}

.FavlistItem-follow {
  width: 90px;
}
.RoundtableItem-badge {
  display: inline-block;
  padding: 3px 6px;
  font-size: 12px;
  white-space: nowrap;
  color: #8590A6;
  vertical-align: 1px;
  background-color: #F6F6F6;
  border-radius: 3px;
  line-height: 1;
  margin-left: 8px;
}

  .RoundtableItem-badge .Icon {
    margin-right: 6px;
  }

  html[data-theme="dark"] .RoundtableItem-badge {
  color: #606A80;
}

  html[data-theme="dark"] .RoundtableItem-badge {
  background-color: #2E2E2E;
}
.LiveAvatar-wrapper {
  position: relative;
  display: inline-block;
  overflow: hidden;
  border-radius: 10%;
}

.LiveAvatar-column {
  display: inline-block;
  width: calc(50% - 1px);
  height: 100%;
  overflow: hidden;
}

.LiveAvatar-img {
  display: block;
  border-radius: inherit;
}

.LiveAvatar-img.alignCenter {
    -webkit-transform: translateX(-25%);
            transform: translateX(-25%);
  }

.LiveAvatar-img + .LiveAvatar-img {
  border-top: 2px solid #FFFFFF;
}

html[data-theme="dark"] .LiveAvatar-img + .LiveAvatar-img {
  border-top: 2px solid #1A1A1A;
}

.LiveAvatar-column + .LiveAvatar-column {
  border-left: 2px solid #FFFFFF;
}

html[data-theme="dark"] .LiveAvatar-column + .LiveAvatar-column {
  border-left: 2px solid #1A1A1A;
}
.LiveItem-description {
  display: inline-block;
  line-height: 26px;
  cursor: pointer;
}

  .LiveItem-description.is-expand {
    overflow: auto;
    white-space: pre-wrap;
  }

button.LiveItem-description {
  display: block;
  width: 100%;
  text-align: left;
}

.LiveItem-price {
  color: #F1403C;
}

.LiveItem-price del {
    color: #8590A6;
    margin-left: 3px;
  }

html[data-theme="dark"] .LiveItem-price del {
    color: #606A80;
}

html[data-theme="dark"] .LiveItem-price {
  color: #B7302D;
}

.LiveItem-cover {
  position: relative;
  display: block;
  width: 100%;
  height: 160px;
  border-radius: 4px;
  overflow: hidden;
  -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0);
  margin-bottom: 10px;
}

.LiveItem-cover img {
    width: 100%;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate3d(-50%, -50%, 0);
            transform: translate3d(-50%, -50%, 0);
  }
.ImageGallery {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 101;
  overflow: hidden;
  transition: background-color 200ms ease-in-out;
}

  .ImageGallery.is-active {
    background-color: rgba(26, 26, 26, 0.65);
  }

  html[data-theme="dark"] .ImageGallery.is-active {
    background-color: rgba(0, 0, 0, 0.65);
}

  .ImageGallery .ImageGallery-Content {
    position: absolute;
    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;
  }

  .ImageGallery .ImageGallery-Content .ImageGallery-arrow-left,
    .ImageGallery .ImageGallery-Content .ImageGallery-arrow-right {
      top: 50%;
      -webkit-transform: translateY(-50%);
              transform: translateY(-50%);
    }

.ImageGallery-arrow-left,
.ImageGallery-arrow-right,
.ImageGallery-close {
  position: absolute;
  cursor: pointer;
  width: 72px;
  height: 72px;
}

.ImageGallery-arrow-left::before, .ImageGallery-arrow-right::before, .ImageGallery-close::before {
    content: '';
    position: absolute;
    border-radius: 50%;
    width: 100%;
    height: 100%;
  }

.ImageGallery-arrow-left:hover::before, .ImageGallery-arrow-right:hover::before, .ImageGallery-close:hover::before {
      background: #FFFFFF;
      opacity: 0.1;
    }

html[data-theme="dark"] .ImageGallery-arrow-left:hover::before, html[data-theme="dark"] .ImageGallery-arrow-right:hover::before, html[data-theme="dark"] .ImageGallery-close:hover::before {
      background: #1A1A1A;
}

.ImageGallery-arrow-left:active::before, .ImageGallery-arrow-right:active::before, .ImageGallery-close:active::before {
      background: #FFFFFF;
      opacity: 0.3;
    }

html[data-theme="dark"] .ImageGallery-arrow-left:active::before, html[data-theme="dark"] .ImageGallery-arrow-right:active::before, html[data-theme="dark"] .ImageGallery-close:active::before {
      background: #1A1A1A;
}

.ImageGallery-arrow-left svg, .ImageGallery-arrow-right svg, .ImageGallery-close svg {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
  }

.ImageGallery-arrow-disabled {
  opacity: 0.3;
  cursor: default;
}

.ImageGallery-arrow-disabled:hover::before, .ImageGallery-arrow-disabled:active::before {
      background: transparent;
    }

.ImageGallery-Inner {
  height: 100%;
  box-sizing: border-box;
  display: block;
}

.ImageGallery-CursorZoomIn {
  cursor: -webkit-zoom-in;
}

.ImageGallery-transition {
  transition: all 300ms ease-in-out;
}

.ImageGallery-fixed {
  position: absolute;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  left: 50%;
  top: 50%;
}

.ImageGallery-close {
  position: absolute;
  top: 24px;
  right: 14px;
}
.Image-Wrapper-Preview {
  flex-direction: row;
  margin-right: -2px;
  display: block;
}

  .Image-Wrapper-Preview::after {
    display: block;
    clear: both;
    content: '';
    visibility: hidden;
    height: 0;
  }

  .Image-Wrapper-Preview .Thumbnail-Wrapper {
    float: left;
    box-sizing: border-box;
    position: relative;
    height: 1px;
    margin-bottom: 2px;
    cursor: zoom-in;
  }

  .Image-Wrapper-Preview .Thumbnail-Wrapper span {
      margin-right: 2px;
      position: relative;
      display: block;
      overflow: hidden;
      height: 100%;
    }

  .Image-Wrapper-Preview .Thumbnail-Wrapper span img {
        position: absolute;
      }

  .Image-Wrapper-Preview .Thumbnail-Wrapper .Image-PreviewVague .VagueImage {
        position: static;
      }

  .Image-Wrapper-Preview .Thumbnail-Wrapper .Image-PreviewVague > img {
        position: absolute;
        top: 50%;
        left: 50%;
        width: 100%;
        -webkit-transform: translate3d(-50%, -50%, 0);
                transform: translate3d(-50%, -50%, 0);
      }

  .Image-Wrapper-Preview .Thumbnail-Wrapper .Thumbnail-Surplus-Sign {
      position: absolute;
      left: 0;
      top: 0;
      right: 2px;
      bottom: 0;
      font-size: 32px;
      color: #FFFFFF;
      font-style: normal;
      z-index: 1;
      font-weight: 500;
      letter-spacing: 4px;
      justify-content: center;
      align-items: center;
      display: flex;
    }

  .Image-Wrapper-Preview .Thumbnail-Wrapper .Thumbnail-Surplus-Sign::before {
        content: '';
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        background: #1A1A1A;
        opacity: 0.3;
        z-index: -1;
      }

  html[data-theme="dark"] .Image-Wrapper-Preview .Thumbnail-Wrapper .Thumbnail-Surplus-Sign::before {
        background: #999999;
}

  html[data-theme="dark"] .Image-Wrapper-Preview .Thumbnail-Wrapper .Thumbnail-Surplus-Sign {
      color: #1A1A1A;
}

  .Image-Wrapper-Preview .Thumbnail-Wrapper .Thumbnail-Gif-Sign {
      position: absolute;
      background: rgba(255, 255, 255, 0.55);
      border-radius: 4px;
      border: 1px solid rgba(26, 26, 26, 0.15);
      color: rgba(26, 26, 26, 0.35);
      -webkit-user-select: none;
         -moz-user-select: none;
          -ms-user-select: none;
              user-select: none;
      cursor: pointer;
      width: 28px;
      height: 16px;
      right: 6px;
      bottom: 6px;
      font-weight: 500;
      font-style: normal;
      text-align: center;
      line-height: 18px;
      font-size: 12px;
    }

  html[data-theme="dark"] .Image-Wrapper-Preview .Thumbnail-Wrapper .Thumbnail-Gif-Sign {
      background: rgba(26, 26, 26, 0.55);
}

  html[data-theme="dark"] .Image-Wrapper-Preview .Thumbnail-Wrapper .Thumbnail-Gif-Sign {
      border: 1px solid rgba(153, 153, 153, 0.15);
}

  html[data-theme="dark"] .Image-Wrapper-Preview .Thumbnail-Wrapper .Thumbnail-Gif-Sign {
      color: rgba(153, 153, 153, 0.35);
}
/* 保持基本一致：~/components/VoteButton.css */
.ReactionButton {
  padding: 0 15px;
  color: #0084FF;
  text-align: center;
  background: #F6F6F6;
  border-color: transparent;
  border-radius: 3px;
  box-sizing: border-box;
}
.ReactionButton:disabled:hover {
    background: #F6F6F6;
  }
html[data-theme="dark"] .ReactionButton:disabled:hover {
    background: #2E2E2E;
}
.ReactionButton:not(:disabled):hover {
    background-color: #EBEBEB;
  }
html[data-theme="dark"] .ReactionButton:not(:disabled):hover {
    background-color: #444444;
}
.ReactionButton.is-active {
    color: #FFFFFF;
    background: #0084FF;
  }
.ReactionButton.is-active:hover {
      background-color: #0084FF;
    }
html[data-theme="dark"] .ReactionButton.is-active:hover {
      background-color: #3A76D0;
}
html[data-theme="dark"] .ReactionButton.is-active {
    color: #EBEBEB;
}
html[data-theme="dark"] .ReactionButton.is-active {
    background: #3A76D0;
}
.ReactionButton .Icon {
    margin-right: 7px;
    fill: currentColor;
  }
html[data-theme="dark"] .ReactionButton {
  color: #3A76D0;
}
html[data-theme="dark"] .ReactionButton {
  background: #2E2E2E;
}
.PinItem-authorInfo {
  margin-bottom: 10px;
}

.PinItem-remainContentRichText {
  margin-top: 10px;
  pointer-events: auto;
}

.PinItem-remainContentRichText .link-box {
    display: flex;
    margin: 0;
    padding: 10px;
  }

.PinItem-remainContentRichText .link-box .content {
      padding-left: 0;
    }

.PinItem-remainContentRichText .link-box .thumbnail {
      width: 72px;
      height: 72px;
      border-radius: 4px;
    }

.PinItem-remainContentRichText blockquote {
    cursor: pointer;
  }

.PinItem-3lineBlockquote {
  max-height: 81px;
  display: -webkit-box;
  text-overflow: ellipsis;
  overflow: hidden;
  -webkit-line-clamp: 3;
  /* autoprefixer: ignore next */
  -webkit-box-orient: vertical;
}

.PinItem-contentTitle {
  max-height: 54px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.PinItem-contentUrl {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.PinItem .subtype {
  display: inline-block;
  padding: 1px 6px;
  margin-left: 8px;
  font-size: 12px;
  line-height: normal;
  color: #8590A6;
  vertical-align: 1px;
  background-color: #F6F6F6;
  border-radius: 3px;
}

html[data-theme="dark"] .PinItem .subtype {
  color: #606A80;
}

html[data-theme="dark"] .PinItem .subtype {
  background-color: #2E2E2E;
}

.Thumbnail-Wrapper {
  width: 25%;
}

.PinItem .Voters {
  display: none;
}

.PinItem-content-repin {
  border: 1px solid #EBEBEB;
  box-shadow: 0 1px 3px rgba(26, 26, 26, 0.1);
  background: #FFFFFF;
  margin-top: 20px;
  overflow: visible;
  border-radius: 4px;
  padding: 16px;
  font-size: 15px;
  line-height: 25px;
}

html[data-theme='dark'] .PinItem-content-repin {
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
  }

.PinItem-content-repin blockquote {
    margin: 8px 0;
  }

.PinItem-content-repin .link-text {
    font-size: 14px;
    color: #999999;
    line-height: 16px;
    margin-top: 8px;
    width: 100%;
    border-bottom: none !important;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
  }

html[data-theme="dark"] .PinItem-content-repin .link-text {
    color: #646464;
}

.PinItem-content-repin .RichText-video {
    width: 50%;
    margin: 0;
  }

html[data-theme="dark"] .PinItem-content-repin {
  border: 1px solid #444444;
}

html[data-theme="dark"] .PinItem-content-repin {
  background: #1A1A1A;
}
.ActivityItem-meta {
  display: flex;
}

.ActivityItem-metaTitle {
  flex: 1;
}
.List-headerOptions,
.Profile-writePosts {
  display: flex;
  justify-content: center;
  align-self: center;
}

.Profile-writePosts {
  line-height: 24px;
  margin-right: 20px;
  position: relative;
}

.Profile-writePosts::after {
    content: '';
    position: absolute;
    width: 1px;
    height: 12px;
    background-color: #EBEBEB;
    right: -11px;
    top: 50%;
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
  }

html[data-theme="dark"] .Profile-writePosts::after {
    background-color: #444444;
}

.Profile-writePostsText {
  color: #0084FF;
}

html[data-theme="dark"] .Profile-writePostsText {
  color: #3A76D0;
}
.SubTabs {
  display: inline-block;
}

.SubTabs-item {
  height: 21px;
  padding: 6px 0 7px;
  margin-right: 36px;
}

.SubTabs-item:last-child {
    margin-right: 0;
  }

.SubTabs-item:not(.is-active) {
    font-weight: 400;
  }

.SubTabs .Select-button {
  font-size: 1em;
  font-weight: inherit;
}
.Field {
  padding: 30px 0;
  border-bottom: 1px solid #EBEBEB;
}

  .Field .ButtonGroup .Button + .Button {
      margin-left: 16px;
    }

  html[data-theme="dark"] .Field {
  border-bottom: 1px solid #444444;
}

.Field-label {
  position: absolute;
  font-size: 15px;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
  line-height: 36px;
  color: #444444;
}

html[data-ios] .Field-label {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .Field-label {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

html[data-theme="dark"] .Field-label {
  color: #808080;
}

.Field-content {
  padding: 0 64px 0 140px;
  line-height: 36px;
}

.Field-list {
  margin: 20px -10px 0;
}

.Field-dot {
  margin-right: 10px;
}

.Field-input {
  width: 180px;
}

.Field-longInput {
  width: 495px;
}

.Field-autoComplete {
  display: inline-block;
}

.Field-autoComplete:not(:first-child) {
    margin-left: 16px;
  }

.Field-card {
  position: relative;
  display: flex;
  align-items: center;
  width: 440px;
  padding: 8px 10px;
  line-height: 24px;
  cursor: move;
}

.Field-card span {
    margin-left: 12px;
    font-size: 15px;
    color: #1A1A1A;
  }

html[data-theme="dark"] .Field-card span {
    color: #999999;
}

.Field-hoveredCard {
  background: #F6F6F6;
  border-radius: 4px;
}

html[data-theme="dark"] .Field-hoveredCard {
  background: #2E2E2E;
}

.Field-draggingCard {
  opacity: 1;
}

.Field-delete {
  position: absolute;
  top: 50%;
  right: 10px;
  cursor: pointer;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}

.Field-avatar {
  vertical-align: top;
}

.Field-modify {
  position: absolute;
  margin-left: 16px;
  line-height: inherit;
  transition: opacity 100ms;
}

.Field-modify-hidden:not(:focus) {
  opacity: 0;
}

.Field .MaxLength {
  position: absolute;
  top: 30px;
  right: 12px;
  text-align: right;
}

.Field-education .Field-content {
  padding-right: 52px;
}

.Field-line {
  margin-bottom: 20px;
}

.Field-select:not(:first-child) {
  margin-left: 16px;
}

.Field-select .Select-button {
  height: 34px;
  line-height: 34px;
  display: flex;
  justify-content: space-between;
  padding: 0 5px 0 10px;
  border-color: #EBEBEB;
}

html[data-theme="dark"] .Field-select .Select-button {
  border-color: #444444;
}

.Field-selectList > .Select-option:first-child {
  display: none;
}

.EductaionField-card {
  display: flex;
}

.EductaionField-card > img {
    border-radius: 50%;
  }

.EductaionField-cardContent > div {
  line-height: 1;
}

.EductaionField-card:first-child {
  padding-bottom: 16px;
}

.EductaionField-card:not(:first-child) {
  padding: 16px 10px;
}

.EductaionField-cardYears {
  color: #8590A6;
  margin-bottom: 12px;
  font-size: 14px;
}

html[data-theme="dark"] .EductaionField-cardYears {
  color: #606A80;
}
.ButtonGroup {
  margin-top: 24px;
  vertical-align: top;
}

.ButtonGroup--right {
  display: inline-block;
  margin-top: 0;
  margin-left: 24px;
}
.FullnameField .Field {
    border-bottom: 0;
    padding-top: 14px;
    padding-bottom: 0;
  }

    .FullnameField .Field .MaxLength {
      bottom: 0;
      right: 0;
      top: auto;
    }
  .FullnameField-input {
    width: 420px;
  }
  .FullnameField-buttonGroup {
    display: inline-block;
  }
  .FullnameField-actions {
    position: relative;
    width: 420px;
  }
  .FullnameField-hint {
    background: #FFFFFF;
    bottom: 0;
    color: #8590A6;
    font-size: 14px;
    position: absolute;
    right: 0;
  }
  html[data-theme="dark"] .FullnameField-hint {
    background: #1A1A1A;
}
  html[data-theme="dark"] .FullnameField-hint {
    color: #606A80;
}

.FullnameField-name {
  display: inline-block;
  height: 30px;
  max-width: 400px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.FullnameField-readonly,
.FullnameField-editable {
  font-size: 26px;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
  height: 30px;
  line-height: 30px;
}

html[data-ios] .FullnameField-readonly, html[data-ios] .FullnameField-editable {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .FullnameField-readonly, html[data-android] .FullnameField-editable {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

.FullnameField-readonly {
  align-items: center;
  display: flex;
}

.FullnameField-readonlyHint {
  color: #8590A6;
  font-size: 14px;
  font-weight: normal;
  padding-left: 16px;
}

html[data-theme="dark"] .FullnameField-readonlyHint {
  color: #606A80;
}

.FullnameField-editable {
  display: inline-block;
  padding-right: 80px;
}

.FullnameField-editable .Field-modify {
    font-weight: normal;
  }
.HeadlineField-input {
  width: 540px;
}

.HeadlineField-buttonGroup {
  display: inline-block;
}

.HeadlineField-actions {
  position: relative;
}
.HomepageField-input {
  width: 540px;
}

.HomepageField-buttonGroup {
  display: inline-block;
}

.HomepageField-actions {
  position: relative;
}
.AddButton {
  font-size: 15px;
}

.AddButton-icon {
  fill: #0084FF;
  vertical-align: -4px;
}

html[data-theme="dark"] .AddButton-icon {
  fill: #3A76D0;
}
.TextArea {
  padding: 4px 10px;
  font-family: inherit;
  font-size: 14px;
  font-weight: inherit;
  line-height: 26px;
  background: #F6F6F6;
  border: 1px solid #EBEBEB;
  border-radius: 3px;
  outline: none;
  box-sizing: border-box;
  transition: background 200ms;
  resize: none;
}

  .TextArea:focus {
    background: #FFFFFF;
  }

  html[data-theme="dark"] .TextArea:focus {
    background: #1A1A1A;
}

  .TextArea::-webkit-input-placeholder {
    color: #8590A6;
  }

  .TextArea:-ms-input-placeholder {
    color: #8590A6;
  }

  .TextArea::-ms-input-placeholder {
    color: #8590A6;
  }

  .TextArea::placeholder {
    color: #8590A6;
  }

  html[data-theme="dark"] .TextArea::-webkit-input-placeholder {
    color: #606A80;
}

  html[data-theme="dark"] .TextArea:-ms-input-placeholder {
    color: #606A80;
}

  html[data-theme="dark"] .TextArea::-ms-input-placeholder {
    color: #606A80;
}

  html[data-theme="dark"] .TextArea::placeholder {
    color: #606A80;
}

  html[data-theme="dark"] .TextArea {
  background: #2E2E2E;
}

  html[data-theme="dark"] .TextArea {
  border: 1px solid #444444;
}
.DescriptionField-input {
  width: 540px;
}

.DescriptionField-buttonGroup {
  display: inline-block;
}

.DescriptionField-actions {
  position: relative;
}

.DescriptionField-content {
  word-break: break-all;
}
.PersonalVerificationField-label {
  display: flex;
  position: relative;
}

.PersonalVerificationField-toolTip {
  position: absolute;
}

.PersonalVerificationField-editingWrapper {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.PersonalVerificationField-checkoutLabel {
  display: flex;
  align-items: center;
}

.PersonalVerificationField-helpIcon {
  color: #999999;
  margin-left: 8px;
}

html[data-theme="dark"] .PersonalVerificationField-helpIcon {
  color: #646464;
}

.PersonalVerificationField-checkoutItemWrapper {
  display: flex;
  align-items: center;
}

.PersonalVerificationField-checkoutInput {
  margin-right: 12px;
}

.PersonalVerificationField-checkoutInfo {
  font-size: 15px;
  margin-right: 16px;
  max-width: 400px;
  word-wrap: break-word;
}

.PersonalVerificationField-toggleEditButton {
  font-size: 15px;
  fill: #175199;
}

html[data-theme="dark"] .PersonalVerificationField-toggleEditButton {
  fill: #175199;
}
.ProfileEdit {
  width: 1000px;
  padding: 0 16px;
  margin: 14px auto;
  font-size: 15px;
  color: #1A1A1A;
}
  html[data-theme="dark"] .ProfileEdit {
  color: #999999;
}

.ProfileEdit-fields {
  padding-bottom: 100px;
  margin-top: 10px;
}

.ProfileEdit-headlineInput {
  width: 495px;
}

.ProfileEdit-buttons {
  margin-top: 24px;
}

.ProfileEdit-expandActions {
  bottom: auto;
}

.ProfileEdit-arrowIcon {
  margin: 0 4px 0 8px;
  -webkit-transform: rotate(-90deg);
          transform: rotate(-90deg);
}
/*override List-header style to align left*/
.ProfileCreations-sortTab:first-child {
  padding-left: 0;
}
.Creator-newIcon {
  margin-left: 4px;
}
.CreatorFormFields-fieldWrapper {
  width: 100%;
}

.CreatorFormFields-fieldInput {
  width: 400px;
}

.Mobile-body .CreatorFormFields-fieldInput {
    width: 100%;
  }

.CreatorFormFields-formTextArea {
  background: #FFFFFF;
  height: 96px;
  resize: vertical;
  width: 100%;
}

html[data-theme="dark"] .CreatorFormFields-formTextArea {
  background: #1A1A1A;
}
.CreatorFormFields-extraHint {
  width: 100%;
  display: flex;
  /*给错误提示占位，防止出现错误提示时页面内容抖动*/
  min-height: 21px;
  font-size: 14px;
}

  .CreatorFormFields-extraHint--common {
    color: #8590A6;
  }

  html[data-theme="dark"] .CreatorFormFields-extraHint--common {
    color: #606A80;
}

  .CreatorFormFields-extraHint--error {
    margin-top: 8px;
    justify-content: flex-end;
    color: #F1403C;
  }

  html[data-theme="dark"] .CreatorFormFields-extraHint--error {
    color: #B7302D;
}
.CreatorFormFields-fieldEmailWrapper {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
}

  .Mobile-body .CreatorFormFields-fieldEmailWrapper {
    width: 100%;
  }
.VerificationMockDocument {
  background: #FFFFFF;
  border-radius: 5px;
  /* BK04 */
  color: #646464;
  position: relative;
}
  html[data-theme="dark"] .VerificationMockDocument {
  background: #EBEBEB;
}

.VerificationMockDocumentNameCard {
  height: 140px;
  width: 240px;
}

.VerificationMockDocumentNameCard-logo,
  .VerificationMockDocumentNameCard-title,
  .VerificationMockDocumentNameCard-job,
  .VerificationMockDocumentNameCard-phone {
    position: absolute;
  }

.VerificationMockDocumentNameCard-logo {
    right: 14px;
    top: 19px;
  }

.VerificationMockDocumentNameCard-title {
    font-size: 13px;
    left: 23px;
    top: 24px;
    /* 与设计一致，不支持设备将回退为 700 */
    font-weight: 600;
    /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
    font-synthesis: style;
  }

html[data-ios] .VerificationMockDocumentNameCard-title {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .VerificationMockDocumentNameCard-title {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

.VerificationMockDocumentNameCard-job {
    bottom: 42px;
    font-size: 12px;
    left: 23px;
  }

.VerificationMockDocumentNameCard-phone {
    bottom: 24px;
    font-size: 12px;
    left: 23px;
  }

.VerificationMockDocumentPhoto {
  height: 207px;
  width: 158px;
}

.VerificationMockDocumentPhoto-title {
    font-size: 17px;
    left: 0;
    position: absolute;
    text-align: center;
    top: 17px;
    width: 100%;
    /* 与设计一致，不支持设备将回退为 700 */
    font-weight: 600;
    /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
    font-synthesis: style;
  }

html[data-ios] .VerificationMockDocumentPhoto-title {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .VerificationMockDocumentPhoto-title {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

.VerificationMockDocumentPhoto-photo {
    border: 3px solid rgb(216, 216, 216);
    border-radius: 2px;
    height: 52px;
    left: 56px;
    position: absolute;
    top: 55px;
    width: 40px;
  }

.VerificationMockDocumentPhoto-placeholder1,
  .VerificationMockDocumentPhoto-placeholder2 {
    background: rgb(216, 216, 216);
    height: 3px;
    position: absolute;
  }

.VerificationMockDocumentPhoto-placeholder1 {
    left: 46px;
    top: 140px;
    width: 66px;
  }

.VerificationMockDocumentPhoto-placeholder2 {
    left: 46px;
    top: 153px;
    width: 66px;
  }

.VerificationMockDocumentText {
  height: 207px;
  width: 158px;
}

.VerificationMockDocumentText-title {
    font-size: 17px;
    left: 0;
    position: absolute;
    text-align: center;
    top: 17px;
    width: 100%;
    /* 与设计一致，不支持设备将回退为 700 */
    font-weight: 600;
    /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
    font-synthesis: style;
  }

html[data-ios] .VerificationMockDocumentText-title {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .VerificationMockDocumentText-title {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

.VerificationMockDocumentText-placeholder1,
  .VerificationMockDocumentText-placeholder2,
  .VerificationMockDocumentText-placeholder3,
  .VerificationMockDocumentText-placeholder4 {
    background: rgb(216, 216, 216);
    height: 3px;
    position: absolute;
  }

.VerificationMockDocumentText-placeholder1 {
    left: 45px;
    top: 55px;
    width: 65px;
  }

.VerificationMockDocumentText-placeholder2 {
    left: 20px;
    top: 70px;
    width: 120px;
  }

.VerificationMockDocumentText-placeholder3 {
    left: 74px;
    top: 172px;
    width: 65px;
  }

.VerificationMockDocumentText-placeholder4 {
    left: 74px;
    top: 186px;
    width: 65px;
  }
.MobilePhotoSelector-menuItem {
  align-items: center;
  background: #FFFFFF;
  border-top: 1px solid;
  border-top-color: #D3D3D3;
  color: #1A1A1A;
  cursor: pointer;
  display: flex;
  font-size: 15px;
  justify-content: center;
  height: 44px;
}

  .MobilePhotoSelector-menuItem:first-child {
    border-top: none;
  }

  html[data-theme="dark"] .MobilePhotoSelector-menuItem {
  background: #1A1A1A;
}

  html[data-theme="dark"] .MobilePhotoSelector-menuItem {
  border-top-color: #2E2E2E;
}

  html[data-theme="dark"] .MobilePhotoSelector-menuItem {
  color: #999999;
}
.MobilePhotoUploader {
  background: rgba(0, 0, 0, 0.8);
  display: flex;
  flex-direction: column;
  height: 100%;
  left: 0;
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 1;
}

.MobilePhotoUploader-contentContainer {
  align-items: center;
  flex-grow: 1;
  display: flex;
}

.MobilePhotoUploader-content {
  align-items: center;
  color: #FFFFFF;
  display: flex;
  flex-direction: column;
  flex-grow: 1;
  justify-content: center;
  padding: 0 14px;
}

html[data-theme="dark"] .MobilePhotoUploader-content {
  color: #EBEBEB;
}

.MobilePhotoUploader-title {
  font-size: 18px;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
}

html[data-ios] .MobilePhotoUploader-title {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .MobilePhotoUploader-title {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

.MobilePhotoUploader-hint {
  font-size: 14px;
  margin-top: 15px;
  text-align: center;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
}

html[data-ios] .MobilePhotoUploader-hint {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .MobilePhotoUploader-hint {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

.MobilePhotoUploader-MockDocument {
  margin-top: 40px;
}
.MultiUploadPreviewListImage-closeIcon {
  fill: #FFFFFF;
}
  html[data-theme="dark"] .MultiUploadPreviewListImage-closeIcon {
  fill: #EBEBEB;
}

.MultiUploadPreviewListImage-imageWrapper {
  position: relative;

  width: 88px;
  height: 88px;
  margin: 10px;

  border: 1px solid #D3D3D3;
  border-radius: 6px;
}

html[data-theme="dark"] .MultiUploadPreviewListImage-imageWrapper {

  border: 1px solid #2E2E2E;
}

.MultiUploadPreviewListImage-imageInner {
  display: block;
  cursor: pointer;
  text-align: center;
  width: 100%;
  height: 100%;
}

.MultiUploadPreviewListImage-previewImgContainer {
  width: 100%;
  height: 100%;
  border-radius: 4px;
  -o-object-fit: cover;
     object-fit: cover;
}

.MultiUploadPreviewListImage-closeButtonWrapper {
  position: absolute;
  z-index: 1;
  top: -8px;
  right: -8px;

  display: flex;
  align-items: center;
  justify-content: center;

  width: 20px;
  height: 20px;

  cursor: pointer;

  border-radius: 50%;
  background-color: #F1403C;
}

html[data-theme="dark"] .MultiUploadPreviewListImage-closeButtonWrapper {
  background-color: #B7302D;
}

.MultiUploadPreviewListImage-imageUploadingShade {
  position: absolute;
  background-color: rgba(100, 100, 100, 0.8);
  width: 100%;
  height: 100%;
  border-radius: 6px;
  display: flex;
  color: white;
  align-items: center;
  justify-content: center;
}
.MultiUploadPreviewList-wrapper {
  display: flex;
  flex-wrap: wrap;
}
.MultiUploadButton-addWrapper {
  display: flex;
  align-items: center;
  flex-direction: column;
  justify-content: center;

  width: 88px;
  height: 88px;
  margin: 10px;

  cursor: pointer;

  color: #999999;
  border: 1px dashed #BFBFBF;
  border-radius: 6px;
}
  html[data-theme="dark"] .MultiUploadButton-addWrapper {

  color: #646464;
}
  html[data-theme="dark"] .MultiUploadButton-addWrapper {
  border: 1px dashed #444444;
}

.MultiUploadButton-addText {
  margin-top: 12px;
}
.IdCardImageUploader-addButtonWrapper {
  display: inline-block;
  width: 112px;
  height: 70px;
  position: relative;
  border-radius: 3px;
  border: 1px solid #D3D3D3;
  margin: 10px;
}

  .IdCardImageUploader-addButtonWrapper--editable {
    cursor: pointer;
  }

  html[data-theme="dark"] .IdCardImageUploader-addButtonWrapper {
  border: 1px solid #2E2E2E;
}

.IdCardImageUploader-addButtonPlusIconWrapper {
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: #0084FF;
  left: 44px;
  top: 23px;
}

html[data-theme="dark"] .IdCardImageUploader-addButtonPlusIconWrapper {
  background: #3A76D0;
}

.IdCardImageUploader-addButtonImg {
  width: 112px;
  height: 70px;
}
.IdCardImageUploader-uploadImage {
  margin-top: 6px;
  display: inline-block;
  flex-wrap: wrap;
}

.IdCardImageUploader-uploadImageContent {
  width: 112px;
  height: 70px;
}

.IdCardImageUploader-addButtonImg {
  width: 100%;
  background-size: cover;
}

.CreatorAccountSettings-uploadImageHint {
  justify-content: flex-start;
}
.CreatorFormFields-fieldIdCodeWrapper {
  display: flex;
}

.CreatorFormFields-formSelect .Select-button {
    margin-right: 24px;
  }

.CreatorFormFields-formSelectList {
  max-height: 270px;
}

.CreatorFormFields-fieldInput {
  width: 400px;
}

.CreatorFormFields-uploadImageHint {
  justify-content: flex-start;
}

.CreatorFormFields-fieldIdCodeWrapper .Select-button {
  height: 34px;
  line-height: 32px;
  padding: 0 4px 0 15px;
  border: 1px solid #EBEBEB;
}

html[data-theme="dark"] .CreatorFormFields-fieldIdCodeWrapper .Select-button {
  border: 1px solid #444444;
}

.CreatorFormFields-uploadImageSection
  .IdCardImageUploader-uploadImage:first-child {
  margin: -10px;
}
.CreatorFormFields-vfieldPhoneVerifiedWrap {
    display: flex;
    align-items: center;
    line-height: 34px;
  }
  .CreatorFormFields-fieldPhonePhoneWrap {
    display: flex;
  }
  .Mobile-body .CreatorFormFields-fieldPhonePhoneWrap {
      align-items: center;
      flex-direction: column;
    }
  .CreatorFormFields-fieldPhonePhone {
    width: 300px;
    display: flex;
    border: solid 1px #D3D3D3;
    border-radius: 3px;
    align-items: center;
  }
  .Mobile-body .CreatorFormFields-fieldPhonePhone {
      width: 100%;
    }
  .CreatorFormFields-fieldPhonePhone.is-focus {
      border: 1px solid #8590A6;
    }
  html[data-theme="dark"] .CreatorFormFields-fieldPhonePhone.is-focus {
      border: 1px solid #606A80;
}
  html[data-theme="dark"] .CreatorFormFields-fieldPhonePhone {
    border: solid 1px #2E2E2E;
}
  .CreatorFormFields-fieldPhonePhoneCode {
    width: 100px;
  }
  .CreatorFormFields-fieldPhonePhoneCode .Select-button {
      width: 100%;
      height: 34px;
      line-height: 32px;
      border: none;
      padding-right: 0;
    }
  .Mobile-body .CreatorFormFields-fieldPhonePhoneCode .Select-button {
        height: 38px;
        line-height: 36px;
      }
  .CreatorFormFields-fieldPhonePhoneCode .Select-button svg {
        position: absolute;
        right: 10px;
        top: 50%;
        -webkit-transform: translate(2px, -50%);
                transform: translate(2px, -50%);
      }
  .CreatorFormFields-fieldPhonePhoneCodeList .Select-option {
      height: 34px;
      line-height: 34px;
    }
  .CreatorFormFields-fieldPhonePhoneSpliter {
    height: 21px;
    border-left: solid 1px #EBEBEB;
  }
  html[data-theme="dark"] .CreatorFormFields-fieldPhonePhoneSpliter {
    border-left: solid 1px #444444;
}
  .CreatorFormFields-fieldPhonePhoneNo {
    flex: 1;
    border: none;
  }
  .CreatorFormFields-fieldPhonePhoneNo.is-focus {
      border: 0;
    }
  .CreatorFormFields-fieldPhoneCaptchaWrap {
    margin-top: 20px;
    display: flex;
  }
  .CreatorFormFields-fieldPhoneCaptcha {
    width: 100px;
  }
  .CreatorFormFields-fieldPhoneBtnCheckCaptcha {
    margin-left: 16px;
    width: 62px;
    display: inline-block;
  }
  .Mobile-body .CreatorFormFields-fieldPhoneBtnCheckCaptcha {
      height: 44px;
      flex-shrink: 0;
    }
  .CreatorFormFields-fieldPhoneCaptchaSended,
  .CreatorFormFields-fieldPhoneCaptchaRetry {
    font-size: 14px;
    line-height: 34px;
    margin-left: 16px;
    display: inline-block;
  }
  .Mobile-body .CreatorFormFields-fieldPhoneCaptchaSended, .Mobile-body .CreatorFormFields-fieldPhoneCaptchaRetry {
      line-height: 44px;
    }
  .CreatorFormFields-fieldPhoneCaptchaSended {
    color: #8590A6;
  }
  html[data-theme="dark"] .CreatorFormFields-fieldPhoneCaptchaSended {
    color: #606A80;
}
  .CreatorFormFields-fieldPhoneCaptchaRetry {
    color: #0084FF;
  }
  html[data-theme="dark"] .CreatorFormFields-fieldPhoneCaptchaRetry {
    color: #3A76D0;
}
  .CreatorFormFields-fieldPhoneFieldPhoneNo {
    display: flex;
  }
  .CreatorFormFields-fieldPhoneBtnSendCaptcha {
    width: 114px;
    margin-left: 16px;
  }
  .Mobile-body .CreatorFormFields-fieldPhoneBtnSendCaptcha {
      margin: 0;
      margin-top: 15px;
    }
  .CreatorFormFields-fieldPhoneVerifiedWrap {
    display: flex;
    align-items: center;
    line-height: 34px;
  }
  .CreatorFormFields-fieldPhoneVerifiedPhoneNo {
    font-size: 14px;
    color: #444444;
  }
  html[data-theme="dark"] .CreatorFormFields-fieldPhoneVerifiedPhoneNo {
    color: #808080;
}
  .CreatorFormFields-fieldPhoneBtnEdit {
    display: flex;
    color: #175199;
    font-size: 14px;
    align-items: center;
    cursor: pointer;
    margin-left: 25px;
  }
  .Mobile-body .CreatorFormFields-fieldPhoneBtnEdit {
      /* 与设计一致，不支持设备将回退为 700 */
      font-weight: 600;
      /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
      font-synthesis: style;
    }
  html[data-ios] .Mobile-body .CreatorFormFields-fieldPhoneBtnEdit {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }
  html[data-android] .Mobile-body .CreatorFormFields-fieldPhoneBtnEdit {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }
  html[data-theme="dark"] .CreatorFormFields-fieldPhoneBtnEdit {
    color: #175199;
}
  .CreatorFormFields-fieldPhoneIconVerified {
    margin-left: 2px;
    margin-right: 4px;
    fill: #67C23A;
  }
  html[data-theme="dark"] .CreatorFormFields-fieldPhoneIconVerified {
    fill: #67C23A;
}
  .CreatorFormFields-fieldPhoneIconEdit {
    margin-right: 4px;
  }
.Mobile-body .CreatorFormFields-fieldTypeWrap {
    display: flex;
  }

.CreatorFormFields-fieldTypeError {
  justify-content: normal;
  margin-left: 110px;
}

.Mobile-body .CreatorFormFields-fieldTypeError {
    margin-left: 0;
  }
.CreatorFormFields-fieldWrapper--horizontal {
  display: flex;
  flex-direction: row;
}

  .Mobile-body .CreatorFormFields-fieldWrapper--horizontal {
    flex-direction: column;
  }

.CreatorFormFields-fieldSubHeader {
  font-size: 18px;
  margin-top: 16px;
  margin-bottom: 16px;
  word-break: keep-all;
  margin-right: 40px;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
}

html[data-ios] .CreatorFormFields-fieldSubHeader {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .CreatorFormFields-fieldSubHeader {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

.Mobile-body .CreatorFormFields-fieldSubHeader {
    margin: 20px 0 10px;
  }

.CreatorFormFields-fieldSubHeader--horizontal {
    font-size: 15px;
  }
.CreatorFormFields-uploadComponentWrapper {
  display: flex;
  flex-direction: column;
}

.CreatorFormFields-uploadImage {
  margin-left: -10px;
  margin-top: 6px;
  width: 100%;
  display: flex;
  flex-wrap: wrap;
}

.CreatorFormFields-uploadImageHint {
  justify-content: flex-start;
}
.CreatorInviteForm-extraMaterialModal {
  width: 595px;
}

  .Mobile-body .CreatorInviteForm-extraMaterialModal {
    width: 100%;
    padding: 0 14px;
  }

  .Mobile-body .CreatorInviteForm-extraMaterialModal .Modal-inner {
      border-radius: 8px;
    }

  .Mobile-body .CreatorInviteForm-extraMaterialModal .Modal-title {
      margin-top: 25px;
    }

  .Mobile-body .CreatorInviteForm-extraMaterialModal .MultiUploadPreviewListImage-imageWrapper,
    .Mobile-body .CreatorInviteForm-extraMaterialModal .MultiUploadButton-addWrapper {
      height: 68px;
      width: 68px;
    }

  .Mobile-body .CreatorInviteForm-extraMaterialModal .MultiUploadButton-addText {
      font-size: 12px;
      margin-top: 0;
    }

  .Mobile-body .CreatorInviteForm-extraMaterialModal .CreatorFormFields-fieldSubHeader {
      font-size: 18px;
      margin: 0;
    }

.CreatorInviteForm-extraMaterialFormHeader {
  width: 100%;
  margin-bottom: 24px;
  text-align: center;
}

.CreatorInviteForm-extraMaterialDescription {
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
  margin-top: 20px;
  margin-bottom: 40px;
  line-height: 24px;
}

html[data-ios] .CreatorInviteForm-extraMaterialDescription {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .CreatorInviteForm-extraMaterialDescription {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

.CreatorInviteForm-extraMaterialDescription * {
    font-weight: normal;
  }

.CreatorInviteForm-extraMaterialDescription ul {
    margin-left: 20px;
  }

.CreatorInviteForm-extraMaterialDescription li {
    list-style: disc inside;
  }

.Mobile-body .CreatorInviteForm-extraMaterialDescription {
    margin-bottom: 20px;
  }

.CreatorInviteForm-extraMaterialUploadImage {
  display: flex;
  width: 100%;
}

.CreatorInviteForm-extraMaterialUploadActionButtonGroup {
  display: flex;
  justify-content: center;
}

.Mobile-body .CreatorInviteForm-extraMaterialUploadActionButtonGroup {
    margin-top: 32px;
  }

.Button.CreatorInviteForm-extraMaterialUploadActionButton {
  width: 168px;
  flex: initial;
}
.CreatorInviteForm .Select-button {
    height: 34px;
    line-height: 32px;
    padding: 0 4px 0 15px;
  }

    .Mobile-body .CreatorInviteForm .Select-button {
      height: 38px;
      line-height: 36px;
    }
  .Mobile-body .CreatorInviteForm {
    width: 100%;
  }

.CreatorInviteForm-section {
  width: 694px;
}

.Mobile-body .CreatorInviteForm-section {
    min-height: 100vh;
    padding: 0 14px 36px;
    width: 100%;
  }

.CreatorInviteForm-card,
.CreatorInviteForm-welcome {
  align-items: center;
  display: flex;
  flex-direction: column;
  padding: 96px 0;
}

.CreatorInviteForm-image {
  width: 608px;
}

.Mobile-body .CreatorInviteForm-image {
    margin-top: 60px;
    width: 100%;
  }

.CreatorInviteForm-welcomeHeader {
  font-size: 24px;
  margin-top: 48px;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
}

html[data-ios] .CreatorInviteForm-welcomeHeader {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .CreatorInviteForm-welcomeHeader {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

.CreatorInviteForm-welcomeHint {
  font-size: 14px;
  margin-top: 18px;
}

.CreatorInviteForm-creatorPCImage {
  margin-top: 40px;
  width: 100%;
}

.CreatorInviteForm-descriptionHint {
  font-size: 14px;
  margin-top: 18px;
  text-align: center;
  width: 320px;
}

.CreatorInviteForm-descriptionHint--welcome {
    width: 364px;
  }

.CreatorInviteForm-descriptionHint--forbidden {
    width: 100%;
  }

.Mobile-body .CreatorInviteForm-descriptionHint {
    font-size: 15px;
    line-height: 21px;
    max-width: 315px;
    width: 100%;
  }

.CreatorInviteForm-SubmitSuccessHint {
  width: 320px;
  font-size: 14px;
  margin-top: 18px;
  text-align: center;
}

.CreatorInviteForm-stepButton {
  margin-top: 24px;
  padding: 0;
  width: 220px;
}

.CreatorInviteForm-form {
  align-items: flex-start;
  display: flex;
  flex-direction: column;
  padding: 40px 30px 20px;
}

.Mobile-body .CreatorInviteForm-form .CreatorInviteForm-formLine {
      display: none;
    }

.CreatorInviteForm-formHeader {
  font-size: 26px;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
}

html[data-ios] .CreatorInviteForm-formHeader {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .CreatorInviteForm-formHeader {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

.Mobile-body .CreatorInviteForm-formHeader {
    display: none;
  }

.CreatorInviteForm-formHint {
  color: #646464;
  font-size: 14px;
  margin-top: 24px;
  padding-bottom: 44px;
}

.Mobile-body .CreatorInviteForm-formHint {
    margin-top: 20px;
    padding-bottom: 0;
  }

html[data-theme="dark"] .CreatorInviteForm-formHint {
  color: #999999;
}

.CreatorInviteForm-formLine {
  /* todo: 替换成色组 */
  border-top: 1px solid #f0f2f7;
  margin-top: 10px;
  margin-bottom: 24px;
  width: 100%;
}

.CreatorInviteForm-formSelectList {
  max-height: 270px;
}

.CreatorInviteForm-formSelectList .Select-button {
    margin-right: 24px;
  }

.CreatorInviteForm-formTextArea {
  background: #FFFFFF;
  height: 96px;
  resize: vertical;
  width: 100%;
}

html[data-theme="dark"] .CreatorInviteForm-formTextArea {
  background: #1A1A1A;
}

.CreatorInviteForm-formSubmitButton {
  align-self: flex-end;
  margin-top: 40px;
  width: 114px;
}

.Mobile-body .CreatorInviteForm-formSubmitButton {
    margin-top: 10px;
    width: 100%;
  }

.CreatorInviteForm-refuseButtonGroup {
  display: flex;
  flex-direction: column;
  margin-top: 10px;
}
.CreaotrRightsButton[disabled] {
    background-color: rgba(153, 153, 153, 0.08);
    border: none;
    color: #8590A6;
    cursor: default;
    opacity: 1;
  }
    html[data-theme="dark"] .CreaotrRightsButton[disabled] {
    background-color: rgba(100, 100, 100, 0.08);
}
    html[data-theme="dark"] .CreaotrRightsButton[disabled] {
    color: #606A80;
}
.CreatorUpgradeModal {
  width: 400px;
}

  .CreatorUpgradeModal .Modal-content {
    margin-top: 0;
    padding: 0 0 24px;
  }

  .CreatorUpgradeModal .ModalButtonGroup--vertical .Button {
    box-sizing: border-box;
  }

  /* hack：这是为了压过原来的 Modal 中的选择器等级 */

  .CreatorUpgradeModal .ModalButtonGroup--vertical .Button.CreatorUpgradeModal-levelLinkButton {
      margin-top: 13px;
    }

.CreatorUpgradeModal-content {
  align-items: center;
  display: flex;
  flex-direction: column;
}

.CreatorUpgradeModal-image {
  display: relative;
  padding-bottom: 14px;
}

.CreatorUpgradeModal-liukanshanImage {
  left: 0;
  margin: 0 auto;
  position: absolute;
  right: 0;
  top: 42px;
}

.CreatorUpgradeModal-title {
  font-size: 24px;
  line-height: 33px;
  margin-top: 32px;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
}

html[data-ios] .CreatorUpgradeModal-title {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .CreatorUpgradeModal-title {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

.CreatorUpgradeModal-text {
  margin-top: 16px;
  max-width: 280px;
  text-align: center;
}

.CreatorUpgradeModal-levelLinkButton {
  color: #8590A6;
}

/* hack：这里是在复写 .Button--link 的样式 */

.CreatorUpgradeModal-levelLinkButton:hover {
    color: #8590A6;
  }

html[data-theme="dark"] .CreatorUpgradeModal-levelLinkButton:hover {
    color: #606A80;
}

html[data-theme="dark"] .CreatorUpgradeModal-levelLinkButton {
  color: #606A80;
}
.CreatorPassModal {
  width: 400px;
}

  .CreatorPassModal .Modal-content {
    margin-top: 0;
    padding: 0 0 24px;
  }

  .CreatorPassModal .ModalButtonGroup--vertical .Button {
    box-sizing: border-box;
  }

.CreatorPassModal-content {
  align-items: center;
  display: flex;
  flex-direction: column;
}

.CreatorPassModal-decorateTitle {
  align-items: center;
  color: #FFFFFF;
  display: flex;
  font-size: 24px;
  height: 33px;
  position: absolute;
  top: -24px;
  -webkit-transform: translateY(-100%);
          transform: translateY(-100%);
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
}

html[data-ios] .CreatorPassModal-decorateTitle {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .CreatorPassModal-decorateTitle {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

html[data-theme="dark"] .CreatorPassModal-decorateTitle {
  color: #1A1A1A;
}

.CreatorPassModal-decorateTitle img {
  height: 7px;
  width: 44px;
}

.CreatorPassModal-decorateTitleText {
  margin: 0 16px;
}

.CreatorPassModal-image {
  display: relative;
  padding-bottom: 14px;
}

.CreatorPassModal-liukanshanImage {
  left: 0;
  margin: 0 auto;
  position: absolute;
  right: 0;
  top: 42px;
}

.CreatorPassModal-title {
  font-size: 24px;
  line-height: 33px;
  margin-top: 32px;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
}

html[data-ios] .CreatorPassModal-title {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .CreatorPassModal-title {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

.CreatorPassModal-text {
  margin-top: 16px;
  max-width: 280px;
  text-align: center;
}
.CreatorApplyingModal-body {
  align-items: center;
  display: flex;
  flex-direction: column;
  padding-top: 46px;
}

.CreatorApplyingModal-image {
  height: 128px;
  -o-object-fit: cover;
     object-fit: cover;
  width: 128px;
}

.CreatorApplyingModal-title {
  font-size: 24px;
  line-height: 33px;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
}

html[data-ios] .CreatorApplyingModal-title {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .CreatorApplyingModal-title {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

.CreatorApplyingModal-text {
  margin-top: 16px;
  max-width: 280px;
  text-align: center;
}
.Creator {
  display: flex;
  margin: 0 auto;
  padding: 10px 0;
  width: 1000px;
}

  .Creator--form {
    justify-content: center;
  }

  .Mobile-body .Creator {
    min-height: 100vh;
    padding: 0;
    width: 100%;
  }

.Creator-sideColumn {
  color: #444444;
  flex-shrink: 0;
  margin-right: 10px;
  width: 170px;
}

html[data-theme="dark"] .Creator-sideColumn {
  color: #808080;
}

.Creator-mainColumn {
  flex-grow: 1;
  overflow: hidden;
}

.Creator-menuItem {
  padding-bottom: 10px;
}

.Creator-menuItem--noContent {
    padding-bottom: 0;
  }

.Creator-menuItemHeader {
  color: #8590A6;
  line-height: 50px;
  padding-left: 20px;
}

.Creator-menuItemHeader .Zi {
    margin-right: 10px;
  }

html[data-theme="dark"] .Creator-menuItemHeader {
  color: #606A80;
}

.Creator-menuItem:not(:first-child) {
  border-top: 1px solid #F6F6F6;
}

html[data-theme="dark"] .Creator-menuItem:not(:first-child) {
  border-top: 1px solid #2E2E2E;
}

.Creator-subMenuItem {
  align-items: center;
  color: #444444;
  cursor: pointer;
  display: flex;
  font-size: 15px;
  line-height: 40px;
  padding-left: 50px;
  text-align: left;
}

.Creator-subMenuItem:hover {
    background: #F6F6F6;
    color: #444444;
  }

html[data-theme="dark"] .Creator-subMenuItem:hover {
    background: #2E2E2E;
}

html[data-theme="dark"] .Creator-subMenuItem:hover {
    color: #808080;
}

.Creator-subMenuItem.is-active {
    color: #FFFFFF;
    background: #0084FF;
  }

html[data-theme="dark"] .Creator-subMenuItem.is-active {
    color: #1A1A1A;
}

html[data-theme="dark"] .Creator-subMenuItem.is-active {
    background: #3A76D0;
}

html[data-theme="dark"] .Creator-subMenuItem {
  color: #808080;
}

.Creator-emptyRights {
  align-items: center;
  display: flex;
  flex-direction: column;
  justify-content: center;
  height: 560px;
}

.Creator-emptyRightsIcon {
  color: #0084FF;
}

html[data-theme="dark"] .Creator-emptyRightsIcon {
  color: #3A76D0;
}

.Creator-emptyRightsTitle {
  font-size: 24px;
  margin-top: 22px;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
}

html[data-ios] .Creator-emptyRightsTitle {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .Creator-emptyRightsTitle {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

.Creator-emptyRightsHint {
  font-size: 14px;
  margin-top: 10px;
  max-width: 450px;
  text-align: center;
}

.Creator-emptyRightsHintRequirement {
  color: #808080;
  margin-top: 10px;
}

html[data-theme="dark"] .Creator-emptyRightsHintRequirement {
  color: #808080;
}

.Creator-emptyRightsButton {
  margin-top: 20px;
}

/* 样式覆盖 */
/* TODO: 这些覆盖应该是通用的 */
.Creator .ztext table, .CreatorMobileModal .ztext table, .ToolsRecommendList-Modal .ztext table {
      border-collapse: collapse;
      font-size: 14px;
      text-align: center;
    }
.Creator .ztext table thead, .CreatorMobileModal .ztext table thead, .ToolsRecommendList-Modal .ztext table thead {
        background: rgba(246, 246, 246, 0.5);
        color: #999999;
      }
.Creator .ztext table thead th, .CreatorMobileModal .ztext table thead th, .ToolsRecommendList-Modal .ztext table thead th {
          font-weight: inherit;
        }
html[data-theme="dark"] .Creator .ztext table thead, html[data-theme="dark"] .CreatorMobileModal .ztext table thead, html[data-theme="dark"] .ToolsRecommendList-Modal .ztext table thead {
        background: rgba(46, 46, 46, 0.5);
}
html[data-theme="dark"] .Creator .ztext table thead, html[data-theme="dark"] .CreatorMobileModal .ztext table thead, html[data-theme="dark"] .ToolsRecommendList-Modal .ztext table thead {
        color: #646464;
}
.Creator .ztext table tbody tr:nth-child(even), .CreatorMobileModal .ztext table tbody tr:nth-child(even), .ToolsRecommendList-Modal .ztext table tbody tr:nth-child(even) {
          background: rgba(246, 246, 246, 0.5);
        }
html[data-theme="dark"] .Creator .ztext table tbody tr:nth-child(even), html[data-theme="dark"] .CreatorMobileModal .ztext table tbody tr:nth-child(even), html[data-theme="dark"] .ToolsRecommendList-Modal .ztext table tbody tr:nth-child(even) {
          background: rgba(46, 46, 46, 0.5);
}
.Creator .ztext table th,
      .Creator .ztext table td,
      .CreatorMobileModal .ztext table th,
      .CreatorMobileModal .ztext table td,
      .ToolsRecommendList-Modal .ztext table th,
      .ToolsRecommendList-Modal .ztext table td {
        height: 48px;
        padding: 0 14px;
      }
.Creator .ztext table th:first-child, .Creator .ztext table td:first-child, .CreatorMobileModal .ztext table th:first-child, .CreatorMobileModal .ztext table td:first-child, .ToolsRecommendList-Modal .ztext table th:first-child, .ToolsRecommendList-Modal .ztext table td:first-child {
          padding-left: 34px;
        }
.Creator .ztext table th:last-child, .Creator .ztext table td:last-child, .CreatorMobileModal .ztext table th:last-child, .CreatorMobileModal .ztext table td:last-child, .ToolsRecommendList-Modal .ztext table th:last-child, .ToolsRecommendList-Modal .ztext table td:last-child {
          padding-right: 34px;
        }
.Mobile-body .Creator .Input-wrapper, .Mobile-body .CreatorMobileModal .Input-wrapper, .Mobile-body .ToolsRecommendList-Modal .Input-wrapper {
      height: 44px;
    }
.Mobile-body .Creator input.Input, .Mobile-body .CreatorMobileModal input.Input, .Mobile-body .ToolsRecommendList-Modal input.Input {
      height: 34px;
      line-height: 34px;
    }
.Mobile-body .Creator .Button, .Mobile-body .CreatorMobileModal .Button, .Mobile-body .ToolsRecommendList-Modal .Button {
      line-height: 38px;
    }
.Mobile-body .Creator .Tabs-link, .Mobile-body .CreatorMobileModal .Tabs-link, .Mobile-body .ToolsRecommendList-Modal .Tabs-link {
      color: #999999;
      /* 与设计一致，不支持设备将回退为 700 */
      font-weight: 600;
      /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
      font-synthesis: style;
    }
html[data-ios] .Mobile-body .Creator .Tabs-link, html[data-ios] .Mobile-body .CreatorMobileModal .Tabs-link, html[data-ios] .Mobile-body .ToolsRecommendList-Modal .Tabs-link {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }
html[data-android] .Mobile-body .Creator .Tabs-link, html[data-android] .Mobile-body .CreatorMobileModal .Tabs-link, html[data-android] .Mobile-body .ToolsRecommendList-Modal .Tabs-link {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }
.Mobile-body .Creator .Tabs-link.is-active, .Mobile-body .CreatorMobileModal .Tabs-link.is-active, .Mobile-body .ToolsRecommendList-Modal .Tabs-link.is-active {
        color: #1A1A1A;
      }
html[data-theme="dark"] .Mobile-body .Creator .Tabs-link.is-active, html[data-theme="dark"] .Mobile-body .CreatorMobileModal .Tabs-link.is-active, html[data-theme="dark"] .Mobile-body .ToolsRecommendList-Modal .Tabs-link.is-active {
        color: #999999;
}
html[data-theme="dark"] .Mobile-body .Creator .Tabs-link, html[data-theme="dark"] .Mobile-body .CreatorMobileModal .Tabs-link, html[data-theme="dark"] .Mobile-body .ToolsRecommendList-Modal .Tabs-link {
      color: #646464;
}

/* 公用样式组件 */

/* 链接到外部，比如问题、文章、用户的链接 */
.Creator-entityLink {
  color: #175199;
  cursor: pointer;
}
.Creator-entityLink:hover {
    text-decoration: underline;
  }
html[data-theme="dark"] .Creator-entityLink {
  color: #175199;
}

/* 链接到创作者中心内部，比如「进入功能页」 */
.Creator-internalLink {
  color: #0084FF;
  cursor: pointer;
}
.Creator-internalLink:hover {
    /* BL02 */
    color: #3a76d0;
  }
.Creator-internalLink[disabled] {
    cursor: default;
    color: #999999;
  }
html[data-theme="dark"] .Creator-internalLink[disabled] {
    color: #646464;
}
html[data-theme="dark"] .Creator-internalLink {
  color: #3A76D0;
}

/* 需要 hover 的 disabled 样式链接使用*/
.Creator-fakeDisabledLink {
  color: #8590A6;
  cursor: default;
}
.Creator-fakeDisabledLink:hover {
    color: #8590A6;
    cursor: default;
  }
html[data-theme="dark"] .Creator-fakeDisabledLink:hover {
    color: #606A80;
}
html[data-theme="dark"] .Creator-fakeDisabledLink {
  color: #606A80;
}

/* 一般来说点击会打开一个介绍弹窗 */
.Creator-hintLink {
  color: #808080;
  cursor: pointer;
}
.Creator-hintLink:hover {
    color: #444444;
  }
html[data-theme="dark"] .Creator-hintLink:hover {
    color: #808080;
}
html[data-theme="dark"] .Creator-hintLink {
  color: #808080;
}

.Creator-ButtonGroup {
  display: flex;
}

.Creator-ButtonGroupButton {
  border: 1px solid #EBEBEB;
  color: #8590A6;
  font-size: 14px;
  line-height: 24px;
  width: 140px;
}

.Creator-ButtonGroupButton.Creator-ButtonGroupButton:first-child {
    border-top-left-radius: 2px;
    border-bottom-left-radius: 2px;
  }

.Creator-ButtonGroupButton.Creator-ButtonGroupButton:last-child {
    border-top-right-radius: 2px;
    border-bottom-right-radius: 2px;
  }

.Creator-ButtonGroupButton.Creator-ButtonGroupButton--selected {
    position: relative;
    background: #8590A6;
    border-color: #8590A6;
    color: #FFFFFF;
    z-index: 2;
  }

html[data-theme="dark"] .Creator-ButtonGroupButton.Creator-ButtonGroupButton--selected {
    background: #606A80;
}

html[data-theme="dark"] .Creator-ButtonGroupButton.Creator-ButtonGroupButton--selected {
    border-color: #606A80;
}

html[data-theme="dark"] .Creator-ButtonGroupButton.Creator-ButtonGroupButton--selected {
    color: #1A1A1A;
}

.Creator-ButtonGroupButton + .Creator-ButtonGroupButton {
    margin-left: -1px;
  }

html[data-theme="dark"] .Creator-ButtonGroupButton {
  border: 1px solid #444444;
}

html[data-theme="dark"] .Creator-ButtonGroupButton {
  color: #606A80;
}

.Creator-BounceLoading {
  margin: 60px auto;
}

.Creator-SubTab {
  align-items: center;
  border-bottom: 1px solid #EBEBEB;
  display: flex;
  margin: 0 20px;
  height: 50px;
}

html[data-theme="dark"] .Creator-SubTab {
  border-bottom: 1px solid #444444;
}

.Creator-SubTabItem {
  cursor: pointer;
  margin-right: 40px;
}

.Creator-SubTabItem:last-child {
    margin-right: 0;
  }

.Creator-SubTabItem--active {
    font-weight: bold;
  }
.CreatorDesktopHint {
  align-items: center;
  background: #0084FF;
  border-radius: 6px;
  color: #FFFFFF;
  display: flex;
  font-size: 15px;
  height: 50px;
  position: relative;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
}
  html[data-ios] .CreatorDesktopHint {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }
  html[data-android] .CreatorDesktopHint {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }
  @media (max-width: 320px) {.CreatorDesktopHint {
    font-size: 12px
}
  }
  html[data-theme="dark"] .CreatorDesktopHint {
  background: #3A76D0;
}
  html[data-theme="dark"] .CreatorDesktopHint {
  color: #EBEBEB;
}

.CreatorDesktopHint-LiukanshanImage {
  align-self: flex-end;
  margin-left: 10px;
}

.CreatorDesktopHint-text {
  margin-left: 10px;
}

.CreatorDesktopHint-closeIcon {
  color: rgba(238, 238, 238, 0.6);
  padding: 6px;
  position: absolute;
  right: 0px;
  top: 0px;
}
.AnalyticsWork {
  background: #FFFFFF;
  display: flex;
  flex-direction: column;
  position: relative;
}

  .Mobile-body .AnalyticsWork {
    background: #EBEBEB;
  }

  .Mobile-body .AnalyticsWork--tabFixed {
      padding-top: 51px;
    }

  html[data-theme="dark"] .Mobile-body .AnalyticsWork {
    background: #000000;
}

  html[data-theme="dark"] .AnalyticsWork {
  background: #1A1A1A;
}

.AnalyticsWork-dataUpdateHint {
  color: #999999;
  font-size: 12px;
  line-height: 50px;
  position: absolute;
  right: 20px;
  top: 0;
}

.Mobile-body .AnalyticsWork-dataUpdateHint {
    position: relative;
    left: 14px;
    line-height: 40px;
  }

html[data-theme="dark"] .AnalyticsWork-dataUpdateHint {
  color: #646464;
}

.Mobile-body .AnalyticsWork-TabsContainer--fixed {
      position: fixed;
      top: 0;
      width: 100%;
      z-index: 1;
    }

.AnalyticsWork-CreatorDesktopHintContainer {
  background: #EBEBEB;
  padding: 10px 12px 0;
}

html[data-theme="dark"] .AnalyticsWork-CreatorDesktopHintContainer {
  background: #000000;
}

.AnalyticsWork-Tabs {
  background: #FFFFFF;
}

.Mobile-body .AnalyticsWork-Tabs {
    border-color: #EBEBEB;
    display: flex;
  }

.Mobile-body .AnalyticsWork-Tabs .Tabs-item {
      flex-grow: 1;
      text-align: center;
    }

html[data-theme="dark"] .Mobile-body .AnalyticsWork-Tabs {
    border-color: #444444;
}

html[data-theme="dark"] .AnalyticsWork-Tabs {
  background: #1A1A1A;
}

.AnalyticsWork-entityPage {
  padding: 20px;
}

.Mobile-body .AnalyticsWork-entityPage {
    padding: 0;
  }

.AnalyticsWork-CreatorSection {
  background: #FFFFFF;
  margin-bottom: 20px;
}

.AnalyticsWork-CreatorSection:last-child {
    margin-bottom: 0;
  }

.Mobile-body .AnalyticsWork-CreatorSection {
    margin: 0;
    margin-top: 10px;
  }

.Mobile-body .AnalyticsWork-CreatorSection:first-child {
      margin-top: 0;
    }

html[data-theme="dark"] .AnalyticsWork-CreatorSection {
  background: #1A1A1A;
}

.Mobile-body .AnalyticsWork-CreatorSectionDetail {
    min-height: 100vh;
  }

.AnalyticsWork-countContainer {
  display: flex;
  padding: 40px 0;
}

.AnalyticsWork-countContainer .AnalyticsCount {
    border-right: 1px solid #EBEBEB;
    box-sizing: border-box;
    flex: 1;
  }

.AnalyticsWork-countContainer .AnalyticsCount:last-child {
      border-right: 0;
    }

html[data-theme="dark"] .AnalyticsWork-countContainer .AnalyticsCount {
    border-right: 1px solid #444444;
}

.Mobile-body .AnalyticsWork-countContainer {
    flex-wrap: wrap;
    padding: 10px 0 30px;
  }

.AnalyticsWork-countDeltaContainer {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.AnalyticsWork-detailCountHeader {
  position: relative;
  width: 100%;
}

.AnalyticsWork-detailCountMenu {
  border-bottom: 1px solid;
  border-bottom-color: #EBEBEB;
  display: flex;
}

.Mobile-body .AnalyticsWork-detailCountMenu {
    border-bottom: 0;
  }

.Mobile-body .AnalyticsWork-detailCountMenu .CreatorSectionItem {
      padding: 0 14px;
    }

.Mobile-body .AnalyticsWork-detailCountMenu .CreatorSectionItem.is-active {
      background: #F6F6F6;
      border-radius: 15px;
      line-height: 30px;
    }

html[data-theme="dark"] .Mobile-body .AnalyticsWork-detailCountMenu .CreatorSectionItem.is-active {
      background: #2E2E2E;
}

html[data-theme="dark"] .AnalyticsWork-detailCountMenu {
  border-bottom-color: #444444;
}

.AnalyticsWork-detailCountBodyHeader {
  align-items: center;
  color: #646464;
  display: flex;
  height: 60px;
  padding: 0 24px;
}

.Mobile-body .AnalyticsWork-detailCountBodyHeader {
    padding: 0 14px;
  }

html[data-theme="dark"] .AnalyticsWork-detailCountBodyHeader {
  color: #999999;
}

.AnalyticsWork-detailCountBodyHeaderTitle {
  flex: 1;
}

.AnalyticsWork-detailCountBodyHeaderTool {
  color: #8590A6;
}

html[data-theme="dark"] .AnalyticsWork-detailCountBodyHeaderTool {
  color: #606A80;
}

.AnalyticsWork-detailCountBodyHeaderToolButton {
  cursor: pointer;
}

.AnalyticsWork-detailCountBodyHeaderToolButton .Zi {
    margin-right: 4px;
  }

.Mobile-body .AnalyticsWork-detailRangePicker {
    align-items: center;
    display: flex;
    height: 60px;
    position: absolute;
    right: 0;
    top: 60px;
  }

.AnalyticsWork-detailCountChart {
  border-bottom: 1px solid #EBEBEB;
  padding: 0 24px 30px;
}

.Mobile-body .AnalyticsWork-detailCountChart {
    padding: 0 0 30px;
  }

html[data-theme="dark"] .AnalyticsWork-detailCountChart {
  border-bottom: 1px solid #444444;
}

.AnalyticsWork-entityTable {
  table-layout: fixed;
}

.Mobile-body .AnalyticsWork-DateLimitSelector {
    align-items: center;
    display: flex;
    height: 60px;
  }

.AnalyticsWork-expandRowContainer {
  align-items: center;
  border-top: 1px solid #EBEBEB;
  display: flex;
  flex-direction: column;
  padding-bottom: 24px;
}

.Mobile-body .AnalyticsWork-expandRowContainer {
    border-top: 0;
  }

html[data-theme="dark"] .AnalyticsWork-expandRowContainer {
  border-top: 1px solid #444444;
}

.AnalyticsWork-expandRowChart {
  width: 100%;
}

.AnalyticsWork-titleColumn {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.AnalyticsWork .AnalyticsTable {
  width: 100%;
}

.AnalyticsWork-detailExpand {
  /* 为了让右侧的 icon「悬空在右侧、看起来不占据宽度」 */
  /* 4px (margin) + 6px (icon width) */
  margin-right: -10px;
}

.AnalyticsWork-detailExpand--noData {
    color: #999999;
  }

html[data-theme="dark"] .AnalyticsWork-detailExpand--noData {
    color: #646464;
}

.AnalyticsWork-detailExpand .Zi {
    color: #D3D3D3;
    margin-left: 4px;
  }

html[data-theme="dark"] .AnalyticsWork-detailExpand .Zi {
    color: #2E2E2E;
}
.CreatorPagination {
  color: #8590A6;
  display: flex;
}
  html[data-theme="dark"] .CreatorPagination {
  color: #606A80;
}

.CreatorPagination-arrowButton {
  padding: 0;
  width: 34px;
}

.CreatorPagination-lastButton .Zi {
    -webkit-transform: rotate(-90deg);
            transform: rotate(-90deg);
  }

.CreatorPagination-nextButton .Zi {
    -webkit-transform: rotate(90deg);
            transform: rotate(90deg);
  }

.CreatorPagination-pageNumber {
  align-items: center;
  display: flex;
  padding: 0 20px;
}

.CreatorPagination-Input {
  margin: 0 10px;
  width: 60px;
}
.CreatorTable {
  font-size: 14px;
}

.CreatorTable-tableContainer {
  overflow-y: hidden;
  position: relative;
  /* 这是为了让 fixedTableContainer 的 z-index 不溢出到外部 */
  z-index: 0;
}

.CreatorTable-leftFixedTableContainer {
  box-shadow: 0 5px 20px 0 rgba(68, 68, 68, 0.1);
  left: 0;
  position: absolute;
  top: 0;
  z-index: 1;
}

html[data-theme="dark"] .CreatorTable-leftFixedTableContainer {
  box-shadow: 0 5px 20px 0 rgba(128, 128, 128, 0.1);
}

.CreatorTable-mainTableContainer {
  overflow: scroll;
  -webkit-overflow-scrolling: touch;
}

.CreatorTable-table {
  border-bottom: 1px solid #EBEBEB;
  width: 100%;
}

.CreatorTable-table--noData {
    border-bottom: 0;
  }

html[data-theme="dark"] .CreatorTable-table {
  border-bottom: 1px solid #444444;
}

.CreatorTable-tableHead {
  background: #FFFFFF;
  font-weight: normal;
  color: #8590A6;
  text-align: left;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}

.CreatorTable-tableHead:first-child {
    padding-left: 24px;
  }

.Mobile-body .CreatorTable-tableHead:first-child {
      padding-left: 14px;
    }

.CreatorTable-tableHead:last-child {
    padding-right: 24px;
  }

.CreatorTable-tableHead--hasSorter {
    cursor: pointer;
  }

.CreatorTable-tableHead--hasSorter:last-child {
      /* 24px (normal) - 14px (sorter width) */
      padding-right: 10px;
    }

.CreatorTable-tableHead .Zi {
    margin-left: 2px;
  }

html[data-theme="dark"] .CreatorTable-tableHead {
  background: #1A1A1A;
}

html[data-theme="dark"] .CreatorTable-tableHead {
  color: #606A80;
}

.CreatorTable-tableRow {
  background: #FFFFFF;
  line-height: 48px;
}

/* 这里用 && 是因为夜间模式的样式覆盖有问题 */

.CreatorTable-tableRow.CreatorTable-tableRow--odd,
  .CreatorTable-tableRow.CreatorTable-tableRow--hover:hover {
    background: #F6F6F6;
  }

html[data-theme="dark"] .CreatorTable-tableRow.CreatorTable-tableRow--odd, html[data-theme="dark"] .CreatorTable-tableRow.CreatorTable-tableRow--hover:hover {
    background: #2E2E2E;
}

html[data-theme="dark"] .CreatorTable-tableRow {
  background: #1A1A1A;
}

.CreatorTable-tableData:first-child {
    padding-left: 24px;
  }

.Mobile-body .CreatorTable-tableData:first-child {
      padding-left: 14px;
    }

.CreatorTable-tableData:last-child {
    padding-right: 24px;
  }

.CreatorTable-tableData--hasSorter {
    padding-right: 14px;
  }

.CreatorTable-tableData--hasSorter:last-child {
      /* 10px (header with sorter) + 14px (sorter width) */
      padding-right: 24px;
    }

.CreatorTable-tableData--empty {
    height: 48px;
  }

.CreatorTable-noData {
  align-items: center;
  border-bottom: 1px solid #EBEBEB;
  color: #999999;
  display: flex;
  font-size: 14px;
  justify-content: center;
  text-align: center;
}

html[data-theme="dark"] .CreatorTable-noData {
  border-bottom: 1px solid #444444;
}

html[data-theme="dark"] .CreatorTable-noData {
  color: #646464;
}

.CreatorTable-Pagination {
  justify-content: flex-end;
  padding: 10px 24px;
}

.Mobile-body .CreatorTable-Pagination {
    justify-content: center;
    padding: 10px 0;
  }

.CreatorSorter {
  align-items: center;
  display: inline-flex;
}

.CreatorSorter-icon {
  margin-left: 2px;
  fill: #D3D3D3;
}

.CreatorSorter-icon--ascend path:first-child {
    fill: #0084FF;
  }

html[data-theme="dark"] .CreatorSorter-icon--ascend path:first-child {
    fill: #3A76D0;
}

.CreatorSorter-icon--descend path:last-child {
    fill: #0084FF;
  }

html[data-theme="dark"] .CreatorSorter-icon--descend path:last-child {
    fill: #3A76D0;
}

html[data-theme="dark"] .CreatorSorter-icon {
  fill: #2E2E2E;
}

.CreatorTable-Tooltip .TooltipContent {
    white-space: pre-wrap;
    width: 250px;
  }
.AnalyticsChart {
  position: relative;
}

  /* recharts style reset */

  .AnalyticsChart .recharts-curve.recharts-line-curve {
    stroke-linecap: round;
    stroke-linejoin: round;
  }

.AnalyticsChart-tooltip {
  background: rgba(255, 255, 255, 0.95);
  border: 1px solid #EBEBEB;
  box-shadow: 0 5px 20px 0 rgba(68, 68, 68, 0.1);
  min-width: 210px;
  padding: 24px;
}

.Mobile-body .AnalyticsChart-tooltip {
    border: none;
    border-radius: 8px;
    min-width: 112px;
  }

html[data-theme="dark"] .AnalyticsChart-tooltip {
  background: rgba(26, 26, 26, 0.95);
}

html[data-theme="dark"] .AnalyticsChart-tooltip {
  border: 1px solid #444444;
}

html[data-theme="dark"] .AnalyticsChart-tooltip {
  box-shadow: 0 5px 20px 0 rgba(128, 128, 128, 0.1);
}

.AnalyticsChart-tooltipHeader {
  font-size: 14px;
  margin-bottom: 24px;
  text-align: center;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
}

html[data-ios] .AnalyticsChart-tooltipHeader {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .AnalyticsChart-tooltipHeader {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

.AnalyticsChart-tooltipLineItem {
  display: flex;
  font-size: 12px;
  line-height: 16px;
  margin-bottom: 16px;
}

.AnalyticsChart-tooltipLineItem:last-child {
    margin-bottom: 0;
  }

.AnalyticsChart-tooltipLineItemName {
  flex: 1;
}

.AnalyticsChart-legend {
  color: #8590A6;
  display: flex;
  font-size: 14px;
  justify-content: center;
  margin-left: 12px;
  margin-top: 28px;
}

.Mobile-body .AnalyticsChart-legend {
    justify-content: flex-start;
    margin-left: 26px;
    overflow: scroll;
    -webkit-overflow-scrolling: touch;
  }

html[data-theme="dark"] .AnalyticsChart-legend {
  color: #606A80;
}

.AnalyticsChart-legendItem {
  align-items: center;
  cursor: pointer;
  display: flex;
  margin-right: 20px;
}

.AnalyticsChart-legendItem:last-child {
    margin-right: 0;
  }

.Mobile-body .AnalyticsChart-legendItem {
    flex-shrink: 0;
  }

.AnalyticsChart-legendItemIconContainer {
  align-items: center;
  display: flex;
  height: 20px;
  justify-content: center;
  margin-right: 4px;
  width: 20px;
}

.AnalyticsChart-legendItemInactiveIcon {
  border: 1px solid #BFBFBF;
  border-radius: 50%;
  box-sizing: border-box;
  height: 14px;
  width: 14px;
}

html[data-theme="dark"] .AnalyticsChart-legendItemInactiveIcon {
  border: 1px solid #444444;
}

.AnalyticsChart-hint {
  align-items: center;
  box-sizing: border-box;
  color: #999999;
  display: flex;
  left: 0;
  height: 370px;
  justify-content: center;
  padding: 0 14px;
  position: absolute;
  text-align: center;
  top: 0;
  width: 100%;
}

html[data-theme="dark"] .AnalyticsChart-hint {
  color: #646464;
}
.CreatorSection {
  border: 1px solid;
  border-color: #EBEBEB;
  border-radius: 2px;
  box-shadow: 0 1px 3px 0 rgba(26, 26, 26, 0.1);
}

  .Mobile-body .CreatorSection {
    border: 0;
    border-radius: 0;
    box-shadow: none;
  }

  html[data-theme="dark"] .CreatorSection {
  border-color: #444444;
}

  html[data-theme="dark"] .CreatorSection {
  box-shadow: 0 1px 3px 0 rgba(153, 153, 153, 0.1);
}

.CreatorSection-header {
  border-bottom: 1px solid;
  border-bottom-color: #EBEBEB;
  display: flex;
  padding: 0 24px;
}

.Mobile-body .CreatorSection-header {
    border: 0;
    padding: 0 14px;
  }

html[data-theme="dark"] .CreatorSection-header {
  border-bottom-color: #444444;
}

.CreatorSection .CreatorSectionItem {
  margin-right: 40px;
}

.Mobile-body .CreatorSection .CreatorSectionItem {
    margin-right: 0;
  }
.CreatorSectionItem {
  align-items: center;
  display: flex;
  margin: 15px 0;
  line-height: 30px;
}

  .CreatorSectionItem--clickable {
    cursor: pointer;
  }

  .CreatorSectionItem.is-active {
    /* 与设计一致，不支持设备将回退为 700 */
    font-weight: 600;
    /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
    font-synthesis: style;
  }

  html[data-ios] .CreatorSectionItem.is-active {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

  html[data-android] .CreatorSectionItem.is-active {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

.CreatorSectionItem .Zi {
  color: #BFBFBF;
  margin-left: 4px;
  height: 18px;
  width: 18px;
}

.Mobile-body .CreatorSectionItem .Zi {
    height: 14px;
    width: 14px;
  }

html[data-theme="dark"] .CreatorSectionItem .Zi {
  color: #444444;
}

.CreatorSectionItem-TooltipIconContainer {
  cursor: pointer;
}

.CreatorSectionItem-TooltipContent {
  color: #646464;
  font-size: 15px;
  padding: 12px;
  white-space: pre-wrap;
  width: 250px;
}

.Mobile-body .CreatorSectionItem-TooltipContent {
    border-radius: 8px;
    box-shadow: 0 4px 24px 0 rgba(0, 0, 0, 0.24);
    box-sizing: border-box;
    width: calc(100% - 28px);
  }

html[data-theme="dark"] .CreatorSectionItem-TooltipContent {
  color: #999999;
}
.AnalyticsCount {
  align-items: center;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
}

.AnalyticsCount-title {
  color: #8590A6;
  font-size: 14px;
  line-height: 1;
}

html[data-theme="dark"] .AnalyticsCount-title {
  color: #606A80;
}

.AnalyticsCount-number {
  font-size: 26px;
  line-height: 1;
  margin: 16px 0;
  position: relative;
}
.CreatorCalendar {
  width: 292px;
  padding-bottom: 10px;
}

  .CreatorCalendar--hasBottomTool {
    padding-bottom: 0;
  }

.CreatorCalendar-topTool {
  display: flex;
  padding: 20px 20px 7px;
  position: relative;
}

.CreatorCalendar-topToolDate {
  color: #1A1A1A;
  flex-grow: 1;
  font-size: 20px;
  text-align: center;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
}

html[data-ios] .CreatorCalendar-topToolDate {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .CreatorCalendar-topToolDate {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

html[data-theme="dark"] .CreatorCalendar-topToolDate {
  color: #999999;
}

.CreatorCalendar-topToolButton {
  border: none;
  display: flex;
  color: #8590A6;
  font-size: 12px;
  position: absolute;
  top: 24px;
  width: 24px;
}

.CreatorCalendar-topToolButton--prevYear {
    left: 20px;
  }

.CreatorCalendar-topToolButton--prevMonth {
    left: 44px;
  }

.CreatorCalendar-topToolButton--nextMonth {
    right: 44px;
  }

.CreatorCalendar-topToolButton--nextYear {
    right: 20px;
  }

.CreatorCalendar-topToolButton:hover {
    color: #0084FF;
  }

html[data-theme="dark"] .CreatorCalendar-topToolButton:hover {
    color: #3A76D0;
}

.CreatorCalendar-topToolButton button {
    height: 24px;
  }

html[data-theme="dark"] .CreatorCalendar-topToolButton {
  color: #606A80;
}
.CreatorCalendar-table {
  border-collapse: separate;
  border-spacing: 12px 6px;
  padding: 0 20px 10px;
  table-layout: fixed;
}

.CreatorCalendar-weekName {
  color: #8590A6;
  height: 24px;
  padding: 0;
  font-size: 12px;
}

html[data-theme="dark"] .CreatorCalendar-weekName {
  color: #606A80;
}

.CreatorCalendar-day {
  border-radius: 4px;
  box-sizing: border-box;
  cursor: pointer;
  font-size: 14px;
  height: 24px;
  padding: 0;
  position: relative;
  text-align: center;
  width: 24px;
}

.CreatorCalendar-day.is-hovered {
    background: rgba(0, 132, 255, 0.1);
  }

html[data-theme="dark"] .CreatorCalendar-day.is-hovered {
    background: rgba(58, 118, 208, 0.1);
}

.CreatorCalendar-day.is-today {
    border: 1px solid #0084FF;
    color: #0084FF;
  }

.CreatorCalendar-day.is-today.is-disabled {
      border-color: #BFBFBF;
      color: #BFBFBF;
    }

html[data-theme="dark"] .CreatorCalendar-day.is-today.is-disabled {
      border-color: #444444;
}

html[data-theme="dark"] .CreatorCalendar-day.is-today.is-disabled {
      color: #444444;
}

html[data-theme="dark"] .CreatorCalendar-day.is-today {
    border: 1px solid #3A76D0;
}

html[data-theme="dark"] .CreatorCalendar-day.is-today {
    color: #3A76D0;
}

.CreatorCalendar-day.is-disabled {
    color: #BFBFBF;
    cursor: not-allowed;
  }

.CreatorCalendar-day.is-disabled.is-hovered {
      background: none;
    }

html[data-theme="dark"] .CreatorCalendar-day.is-disabled {
    color: #444444;
}

.CreatorCalendar-day.is-not-this-month {
    color: #BFBFBF;
  }

html[data-theme="dark"] .CreatorCalendar-day.is-not-this-month {
    color: #444444;
}

.CreatorCalendar-day.is-input-date {
    background: #0084FF;
    color: #FFFFFF;
  }

html[data-theme="dark"] .CreatorCalendar-day.is-input-date {
    background: #3A76D0;
}

html[data-theme="dark"] .CreatorCalendar-day.is-input-date {
    color: #1A1A1A;
}

.CreatorCalendar-day.is-in-range::before {
      content: '';
      display: block;
      background: rgba(0, 132, 255, 0.1);
      position: absolute;
      top: 2px;
      bottom: 2px;
      left: -6px;
      right: -6px;
    }

html[data-theme="dark"] .CreatorCalendar-day.is-in-range::before {
      background: rgba(58, 118, 208, 0.1);
}

.CreatorCalendar-bottomTool {
  align-items: center;
  border-top: 1px solid #EBEBEB;
  display: flex;
  height: 46px;
  justify-content: center;
  padding: 0 8px;
}

html[data-theme="dark"] .CreatorCalendar-bottomTool {
  border-top: 1px solid #444444;
}

.CreatorCalendar-todayButton {
  color: #0084FF;
  font-size: 14px;
}

.CreatorCalendar-todayButton[disabled] {
    color: #BFBFBF;
    cursor: not-allowed;
  }

html[data-theme="dark"] .CreatorCalendar-todayButton[disabled] {
    color: #444444;
}

html[data-theme="dark"] .CreatorCalendar-todayButton {
  color: #3A76D0;
}
.CreatorRangePicker {
  display: flex;
}

.CreatorRangePicker-Button {
  padding: 0 16px 0 12px;
}

.CreatorRangePicker-Button .Zi {
    margin-right: 10px;
  }

.CreatorRangePicker-hyphen {
  margin: 0 8px;
}

.CreatorRangePicker-PopoverContent {
  display: flex;
}
.AnalyticsDetailRangePicker {
  display: flex;
  padding: 13px 0;
}

  .AnalyticsDetailRangePicker .Button {
    border-color: #EBEBEB;
  }

  .AnalyticsDetailRangePicker .Button:hover {
      border-color: #8590A6;
    }

  html[data-theme="dark"] .AnalyticsDetailRangePicker .Button:hover {
      border-color: #606A80;
}

  .AnalyticsDetailRangePicker .Button.is-active {
      border-color: #0084FF;
    }

  html[data-theme="dark"] .AnalyticsDetailRangePicker .Button.is-active {
      border-color: #3A76D0;
}

  html[data-theme="dark"] .AnalyticsDetailRangePicker .Button {
    border-color: #444444;
}

.AnalyticsDetailRangePicker-dateLast {
  flex-grow: 1;
}

.AnalyticsDetailRangePicker-dateLast .Button {
    margin-right: 16px;
  }

.AnalyticsDetailRangePicker-dateRange {
  align-items: center;
  display: flex;
}
.CreatorDateInput {
  color: #8590A6;
  display: flex;
  padding: 0 12px;
  position: relative;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
}
  html[data-ios] .CreatorDateInput {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }
  html[data-android] .CreatorDateInput {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }
  .CreatorDateInput .Zi {
    margin-right: 4px;
  }
  html[data-theme="dark"] .CreatorDateInput {
  color: #606A80;
}

.CreatorDateInput-input {
  border: none;
  height: 100%;
  left: 0;
  opacity: 0;
  position: absolute;
  top: 0;
  width: 100%;
  -webkit-appearance: none;
}

.CreatorDateInput-input::-webkit-calendar-picker-indicator {
    position: absolute;
    width: 100%;
    height: 100%;
    opacity: 0;
  }
.CreatorMobileModal {
  background: #FFFFFF;
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
  bottom: 0;
  box-shadow: 0 0 24px 0 rgba(0, 0, 0, 0.24);
  display: flex;
  flex-direction: column;
  max-height: calc(100vh - 65px);
  position: fixed;
  -webkit-transform: translate3d(0, 110%, 0);
          transform: translate3d(0, 110%, 0);
  transition: -webkit-transform 0.3s;
  transition: transform 0.3s;
  transition: transform 0.3s, -webkit-transform 0.3s;
  width: 100%;
  z-index: 1;
}

  .CreatorMobileModal--show {
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
  }

  html[data-theme="dark"] .CreatorMobileModal {
  background: #1A1A1A;
}

.CreatorMobileModal-header {
  align-items: center;
  border-bottom: 1px solid #EBEBEB;
  display: flex;
  flex-shrink: 0;
  height: 44px;
  position: relative;
}

html[data-theme="dark"] .CreatorMobileModal-header {
  border-bottom: 1px solid #444444;
}

.CreatorMobileModal-headerLeft,
.CreatorMobileModal-headerRight {
  align-items: center;
  display: flex;
  height: 44px;
  justify-content: center;
  position: absolute;
  top: 0;
}

.CreatorMobileModal-headerLeft {
  left: 0;
}

.CreatorMobileModal-closeButton {
  align-items: center;
  color: #808080;
  cursor: pointer;
  display: flex;
  height: 44px;
  justify-content: center;
  width: 44px;
}

html[data-theme="dark"] .CreatorMobileModal-closeButton {
  color: #808080;
}

.CreatorMobileModal-headerRight {
  right: 0;
}

.CreatorMobileModal-title {
  font-size: 17px;
  text-align: center;
  width: 100%;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
}

html[data-ios] .CreatorMobileModal-title {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .CreatorMobileModal-title {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

.CreatorMobileModal-body {
  overflow: scroll;
  -webkit-overflow-scrolling: touch;
}
.MobileDetailRangePicker-filterButton {
  align-items: center;
  color: #8590A6;
  display: flex;
  font-size: 15px;
}

  .MobileDetailRangePicker-filterButton .Zi {
    margin-right: 4px;
  }

  html[data-theme="dark"] .MobileDetailRangePicker-filterButton {
  color: #606A80;
}

.MobileDetailRangePicker-MenuContainer {
  font-size: 15px;
  box-shadow: 0 4px 24px 0 rgba(0, 0, 0, 0.24);
  border-radius: 8px;
  width: 140px;
}

.MobileDetailRangePicker-Menu {
  padding: 10px 0;
}

.MobileDetailRangePicker-MenuItem {
  font-size: 15px;
  line-height: 44px;
  text-align: left;
  padding: 0 14px;
}

.MobileDetailRangePicker-MenuItem--selected {
    background: rgba(0, 132, 255, 0.08);
    color: #0084FF;
  }

html[data-theme="dark"] .MobileDetailRangePicker-MenuItem--selected {
    background: rgba(58, 118, 208, 0.08);
}

html[data-theme="dark"] .MobileDetailRangePicker-MenuItem--selected {
    color: #3A76D0;
}

.MobileDetailRangePicker-submitButton {
  color: #0084FF;
  cursor: pointer;
  font-size: 17px;
  padding: 0 19px;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
}

html[data-ios] .MobileDetailRangePicker-submitButton {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .MobileDetailRangePicker-submitButton {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

html[data-theme="dark"] .MobileDetailRangePicker-submitButton {
  color: #3A76D0;
}

.MobileDetailRangePicker-modalBody {
  display: flex;
  padding: 24px 14px;
}

.MobileDetailRangePicker-DateInput {
  flex-grow: 1;
}

.MobileDetailRangePicker-DateInput.is-active {
    border-color: #0084FF;
  }

html[data-theme="dark"] .MobileDetailRangePicker-DateInput.is-active {
    border-color: #3A76D0;
}

.MobileDetailRangePicker-betweenHint {
  align-items: center;
  color: #8590A6;
  display: flex;
  margin: 0 10px;
}

html[data-theme="dark"] .MobileDetailRangePicker-betweenHint {
  color: #606A80;
}
.EntityDataList {
  font-size: 14px;
}

.EntityDataList-list {
  border-bottom: 1px solid;
  border-color: #EBEBEB;
  width: 100%;
}

.EntityDataList-list--noData {
    border-bottom: 0;
  }

html[data-theme="dark"] .EntityDataList-list {
  border-color: #444444;
}

.EntityDataList-item--odd {
    background: rgba(246, 246, 246, 0.5);
  }

html[data-theme="dark"] .EntityDataList-item--odd {
    background: rgba(46, 46, 46, 0.5);
}

.EntityDataList-itemDetail {
  font-size: 14px;
  line-height: 20px;
  padding: 20px 0;
}

.EntityDataList-itemTitleArea {
  display: flex;
}

.EntityDataList-itemTitleLeftArea {
  margin-left: 14px;
}

.EntityDataList-itemTitle {
  color: #1A1A1A;
  font-size: 17px;
  line-height: 24px;
  padding: 0 14px 2px;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
  display: -webkit-box;
  text-overflow: ellipsis;
  overflow: hidden;
  -webkit-line-clamp: 2;
  /* autoprefixer: ignore next */
  -webkit-box-orient: vertical;
}

html[data-ios] .EntityDataList-itemTitle {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .EntityDataList-itemTitle {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

html[data-theme="dark"] .EntityDataList-itemTitle {
  color: #999999;
}

.EntityDataList-itemTitlelink,
.EntityDataList-itemOption {
  color: #0084FF;
  font-size: 12px;
  margin-top: 4px;
  padding: 0 14px;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
}

html[data-ios] .EntityDataList-itemTitlelink, html[data-ios] .EntityDataList-itemOption {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .EntityDataList-itemTitlelink, html[data-android] .EntityDataList-itemOption {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

html[data-theme="dark"] .EntityDataList-itemTitlelink, html[data-theme="dark"] .EntityDataList-itemOption {
  color: #3A76D0;
}

.EntityDataList-itemDataList {
  display: flex;
  flex-wrap: wrap;
  margin-top: 9px;
}

.EntityDataList-itemData {
  align-items: center;
  box-sizing: border-box;
  display: flex;
  flex: 1;
  flex-basis: 50%;
  height: 30px;
  justify-content: space-between;
  max-width: 50%;
  padding: 0 14px;
}

.EntityDataList-itemData:nth-child(odd) {
    border-right: 1px solid #EBEBEB;
  }

html[data-theme="dark"] .EntityDataList-itemData:nth-child(odd) {
    border-right: 1px solid #444444;
}

.EntityDataList-itemDataTitle {
  color: #8590A6;
}

html[data-theme="dark"] .EntityDataList-itemDataTitle {
  color: #606A80;
}

.EntityDataList-itemDataInfo {
  color: #1A1A1A;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
}

html[data-ios] .EntityDataList-itemDataInfo {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .EntityDataList-itemDataInfo {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

html[data-theme="dark"] .EntityDataList-itemDataInfo {
  color: #999999;
}

.EntityDataList-noData {
  align-items: center;
  color: #999999;
  display: flex;
  font-size: 14px;
  justify-content: center;
  text-align: center;
  min-height: 300px;
}

html[data-theme="dark"] .EntityDataList-noData {
  color: #646464;
}

.EntityDataList-Pagination {
  justify-content: flex-end;
  padding: 10px 24px;
}

.Mobile-body .EntityDataList-Pagination {
    justify-content: center;
    padding: 10px 0;
  }
.DateLimitSelector {
  justify-content: center;
  margin: 30px 14px;
}
.MobileDateLimitSelector-button {
  align-items: center;
  color: #8590A6;
  display: flex;
  font-size: 15px;
}

  .MobileDateLimitSelector-button .Zi {
    margin-left: 4px;
  }

  html[data-theme="dark"] .MobileDateLimitSelector-button {
  color: #606A80;
}

.MobileDateLimitSelector-MenuContainer {
  font-size: 15px;
  box-shadow: 0 4px 24px 0 rgba(0, 0, 0, 0.24);
  border-radius: 8px;
  width: 140px;
}

.MobileDateLimitSelector-Menu {
  padding: 10px 0;
}

.MobileDateLimitSelector-MenuItem {
  font-size: 15px;
  line-height: 44px;
  text-align: left;
  padding: 0 14px;
}

.MobileDateLimitSelector-MenuItem--selected {
    background: rgba(0, 132, 255, 0.08);
    color: #0084FF;
  }

html[data-theme="dark"] .MobileDateLimitSelector-MenuItem--selected {
    background: rgba(58, 118, 208, 0.08);
}

html[data-theme="dark"] .MobileDateLimitSelector-MenuItem--selected {
    color: #3A76D0;
}
.Mobile-body .AnalyticsWorkAnswers-Count:nth-child(1),
    .Mobile-body .AnalyticsWorkAnswers-Count:nth-child(2),
    .Mobile-body .AnalyticsWorkAnswers-Count:nth-child(3) {
      flex-basis: 33%;
    }
    .Mobile-body .AnalyticsWorkAnswers-Count:nth-child(3) {
      border-right: 0;
    }
    .Mobile-body .AnalyticsWorkAnswers-Count:nth-child(4),
    .Mobile-body .AnalyticsWorkAnswers-Count:nth-child(5) {
      flex-basis: 50%;
      margin-top: 25px;
    }
.Mobile-body .AnalyticsWorkPins-Count {
    flex-basis: 50%;
  }

    .Mobile-body .AnalyticsWorkPins-Count:nth-child(2) {
      border-right: 0;
    }

    .Mobile-body .AnalyticsWorkPins-Count:nth-child(3),
    .Mobile-body .AnalyticsWorkPins-Count:nth-child(4) {
      margin-top: 25px;
    }
.AnalyticsWorkVideos-video {
  align-items: center;
  display: flex;
  line-height: 20px;
  padding: 18px 0;
}

  .AnalyticsWorkVideos-video--recordIsVideo {
    padding: 12px 0;
  }

.AnalyticsWorkVideos-videoThumbnail {
  flex-shrink: 0;
  height: 50px;
  position: relative;
  width: 90px;
}

.Mobile-body .AnalyticsWorkVideos-videoThumbnail {
    border-radius: 5px;
    height: 70px;
    overflow: hidden;
    width: 105px;
  }

.AnalyticsWorkVideos-video--recordIsVideo .AnalyticsWorkVideos-videoThumbnail {
    height: 44px;
    margin-left: 10px;
    width: 80px;
  }

.Mobile-body .AnalyticsWorkVideos-video--recordIsVideo .AnalyticsWorkVideos-videoThumbnail {
      height: 60px;
      width: 90px;
    }

.AnalyticsWorkVideos-videoThumbnailImage {
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
  width: 100%;
}

.AnalyticsWorkVideos-videoThumbnailInfo {
  background: rgba(0, 0, 0, 0.8);
  color: #FFFFFF;
  font-size: 12px;
  line-height: 14px;
  padding: 0 4px;
  position: absolute;
}

html[data-theme="dark"] .AnalyticsWorkVideos-videoThumbnailInfo {
  color: #EBEBEB;
}

.AnalyticsWorkVideos-videoThumbnailVideoCount {
  left: 0;
  top: 0;
}

.Mobile-body .AnalyticsWorkVideos-videoThumbnailVideoCount {
    left: 4px;
    top: 4px;
  }

.AnalyticsWorkVideos-videoThumbnailVideoDuration {
  bottom: 0;
  left: 0;
}

.Mobile-body .AnalyticsWorkVideos-videoThumbnailVideoDuration {
    bottom: 4px;
    left: 4px;
  }

.AnalyticsWorkVideos-meta {
  margin-left: 10px;
  white-space: normal;
}

.AnalyticsWorkVideos-meta .Creator-entityLink {
    display: -webkit-box;
    text-overflow: ellipsis;
    overflow: hidden;
    -webkit-line-clamp: 2;
    /* autoprefixer: ignore next */
    -webkit-box-orient: vertical;
  }

.AnalyticsWorkVideos-videoPublishDate {
  font-size: 12px;
  color: #808080;
}

html[data-theme="dark"] .AnalyticsWorkVideos-videoPublishDate {
  color: #808080;
}

.AnalyticsWorkVideos-videoTitle {
  display: -webkit-box;
  text-overflow: ellipsis;
  overflow: hidden;
  -webkit-line-clamp: 2;
  /* autoprefixer: ignore next */
  -webkit-box-orient: vertical;
}

.AnalyticsWorkVideos-videoRow {
  border-top: 1px solid #EBEBEB;
}

html[data-theme="dark"] .AnalyticsWorkVideos-videoRow {
  border-top: 1px solid #444444;
}

/* 正在以 EntityDataList 风格渲染 */

.EntityDataList-item.AnalyticsWorkVideos-contentRecordChild {
    padding-left: 14px;
  }

.EntityDataList-item.AnalyticsWorkVideos-contentRecordChild--lastElement {
      padding-bottom: 20px;
    }

.EntityDataList-item.AnalyticsWorkVideos-contentRecordChild .EntityDataList-itemDetail {
      border-left: 2px solid #EBEBEB;
    }

html[data-theme="dark"] .EntityDataList-item.AnalyticsWorkVideos-contentRecordChild .EntityDataList-itemDetail {
      border-left: 2px solid #444444;
}

.EntityDataList-item.AnalyticsWorkVideos-contentRecordChild .EntityDataList-itemDataList {
      display: none;
    }

.AnalyticsWorkVideos-contentRecord--odd {
  background: #F6F6F6;
}

.Mobile-body .AnalyticsWorkVideos-contentRecord--odd {
    background: rgba(246, 246, 246, 0.5);
  }

html[data-theme="dark"] .Mobile-body .AnalyticsWorkVideos-contentRecord--odd {
    background: rgba(46, 46, 46, 0.5);
}

html[data-theme="dark"] .AnalyticsWorkVideos-contentRecord--odd {
  background: #2E2E2E;
}
.AnalyticsFollowers {
  align-items: center;
  display: flex;
  flex-direction: column;
  height: 280px;
  justify-content: center;
}

.AnalyticsFollowers-hint {
  color: #8590A6;
  line-height: 21px;
}

html[data-theme="dark"] .AnalyticsFollowers-hint {
  color: #606A80;
}
.QuestionReviewInfo {
  width: 640px;
  height: 45px;
  background-color: #EBEBEB;
  line-height: 45px;
  color: #8590A6;
  font-size: 15px;
  margin: 10px 0 12px;
  border-radius: 4px;
}

  .QuestionReviewInfo p {
    margin-left: 16px;
  }

  html[data-theme="dark"] .QuestionReviewInfo {
  background-color: #444444;
}

  html[data-theme="dark"] .QuestionReviewInfo {
  color: #606A80;
}
.QuestionRichText {
  font-size: 15px;
  line-height: 25px;
}

  .QuestionRichText--expandable.QuestionRichText--collapsed {
    max-height: 51px;
    overflow: hidden;
    cursor: pointer;
    transition: color 140ms ease-out;
  }

  .QuestionRichText--expandable.QuestionRichText--collapsed .RichText {
      pointer-events: none;
    }

  .QuestionRichText--expandable.QuestionRichText--collapsed:hover {
      color: #646464;
    }

  html[data-theme="dark"] .QuestionRichText--expandable.QuestionRichText--collapsed:hover {
      color: #999999;
}

.QuestionRichText-more:hover {
  color: #808080;
}

.QuestionRichText-more:hover .Icon {
    fill: #999999;
  }

html[data-theme="dark"] .QuestionRichText-more:hover .Icon {
    fill: #646464;
}

html[data-theme="dark"] .QuestionRichText-more:hover {
  color: #808080;
}

.QuestionRichText-more-icon {
  margin-left: 8px;
}

.QuestionRichText--video {
  max-height: 105px !important;
  display: flex;
  margin-top: 8px;
}

.QuestionRichText--image {
  width: 190px;
  height: 105px;
  margin-right: 20px;
  border-radius: 4px;
}

.QuestionRichText--wrapImgae {
  position: relative;
}

.QuestionRichText--wrapImgae::before {
    content: '';
    border: solid 2px #FFFFFF;
    z-index: 2;
    background: rgba(26, 26, 26, 0.3);
    border-radius: 50px;
    height: 48px;
    position: absolute;
    width: 48px;
    left: 70px;
    top: 30px;
    margin: auto;
  }

html[data-theme="dark"] .QuestionRichText--wrapImgae::before {
    border: solid 2px #1A1A1A;
}

html[data-theme="dark"] .QuestionRichText--wrapImgae::before {
    background: rgba(153, 153, 153, 0.3);
}

.QuestionRichText--wrapImgae::after {
    content: '';
    display: block;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 11.5px 0 11.5px 18px;
    border-color: transparent transparent transparent #FFFFFF;
    position: absolute;
    z-index: 3;
    border-radius: 2px;
    opacity: 0.9;
    left: 90px;
    top: 45px;
    margin: auto;
  }

html[data-theme="dark"] .QuestionRichText--wrapImgae::after {
    border-color: transparent transparent transparent #1A1A1A;
}
.CreatorIgnoreReasonMenu-target {
  z-index: 1;
}

.CreatorIgnoreReasonMenu-container {
  box-sizing: border-box;
  font-size: 14px;
  padding: 18px 20px;
  position: relative;
  width: 470px;
}

.CreatorIgnoreReasonMenu-header {
  margin-bottom: 16px;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
}

html[data-ios] .CreatorIgnoreReasonMenu-header {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .CreatorIgnoreReasonMenu-header {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

.CreatorIgnoreReasonMenu-numberHint {
  color: #0084FF;
}

html[data-theme="dark"] .CreatorIgnoreReasonMenu-numberHint {
  color: #3A76D0;
}

.CreatorIgnoreReasonMenu-action {
  color: #8590A6;
  cursor: pointer;
  position: absolute;
  right: 20px;
  top: 18px;
}

html[data-theme="dark"] .CreatorIgnoreReasonMenu-action {
  color: #606A80;
}

.CreatorIgnoreReasonMenu-closeButton {
  /* 让可点击面积变大一些 */
  padding: 8px;
  position: relative;
  right: -4px;
  top: -4px;
}

.CreatorIgnoreReasonMenu-reasonList {
  display: flex;
  flex-wrap: wrap;
  /* 让 reasonList 里的元素尽可能可以用上右侧的空间 */
  margin-right: -20px;
}

.CreatorIgnoreReasonMenu-reason {
  background: #F6F6F6;
  border-radius: 16px;
  color: #646464;
  cursor: pointer;
  line-height: 32px;
  margin: 0 16px 16px 0;
  text-align: center;
  padding: 0 16px;
}

.CreatorIgnoreReasonMenu-reason--selected {
    background: rgba(0, 132, 255, 0.1);
    color: #0084FF;
  }

html[data-theme="dark"] .CreatorIgnoreReasonMenu-reason--selected {
    background: rgba(58, 118, 208, 0.1);
}

html[data-theme="dark"] .CreatorIgnoreReasonMenu-reason--selected {
    color: #3A76D0;
}

html[data-theme="dark"] .CreatorIgnoreReasonMenu-reason {
  background: #2E2E2E;
}

html[data-theme="dark"] .CreatorIgnoreReasonMenu-reason {
  color: #999999;
}

.CreatorIgnoreReasonMenu-submitButton {
  width: 100%;
}
.ToolsQuestionItem {
  border-bottom: 1px solid #EBEBEB;
  padding: 16px 0;
}
  html[data-theme="dark"] .ToolsQuestionItem {
  border-bottom: 1px solid #444444;
}

.ToolsQuestionItem-hint {
  display: flex;
  line-height: 22px;
  color: #8590A6;
}

html[data-theme="dark"] .ToolsQuestionItem-hint {
  color: #606A80;
}

.ToolsQuestionItem-hintLeft {
  flex-grow: 1;
}

.ToolsQuestionItem-hintRight {
  align-items: center;
  display: flex;
}

.ToolsQuestionItem-hintRightSpace {
  white-space: pre;
}

.ToolsQuestionItem-label {
  background-color: rgba(133, 144, 166, 0.2);
  border-radius: 4px;
  color: #8590A6;
  font-size: 12px;
  line-height: 22px;
  padding: 0 6px;
}

html[data-theme="dark"] .ToolsQuestionItem-label {
  background-color: rgba(96, 106, 128, 0.2);
}

html[data-theme="dark"] .ToolsQuestionItem-label {
  color: #606A80;
}

.ToolsQuestionItem-label--blue {
  background-color: rgba(0, 132, 255, 0.1);
  color: #0084FF;
}

html[data-theme="dark"] .ToolsQuestionItem-label--blue {
  background-color: rgba(58, 118, 208, 0.1);
}

html[data-theme="dark"] .ToolsQuestionItem-label--blue {
  color: #3A76D0;
}

.ToolsQuestionItem-label--red {
  background-color: rgba(241, 64, 60, 0.1);
  color: #F1403C;
}

html[data-theme="dark"] .ToolsQuestionItem-label--red {
  background-color: rgba(183, 48, 45, 0.1);
}

html[data-theme="dark"] .ToolsQuestionItem-label--red {
  color: #B7302D;
}

.ToolsQuestionItem-title {
  font-size: 18px;
  margin-top: 10px;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
}

html[data-ios] .ToolsQuestionItem-title {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .ToolsQuestionItem-title {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

.ToolsQuestionItem-title:hover {
    color: #175199;
  }

html[data-theme="dark"] .ToolsQuestionItem-title:hover {
    color: #175199;
}

.ToolsQuestionItem-detail {
  margin-top: 10px;
}

.ToolsQuestionItem-tool {
  display: flex;
  margin-top: 15px;
}

.ToolsQuestionItem-toolLeft {
  flex-grow: 1;
}

.ToolsQuestionItem-toolLeft,
.ToolsQuestionItem-toolRight {
  align-items: center;
  display: flex;
}

.ToolsQuestionItem-toolButton {
  line-height: 26px;
  margin-right: 16px;
  width: 96px;
}

.ToolsQuestionItem-toolButton .Zi {
    margin-right: 6px;
  }

.ToolsQuestionItem-toolButtonText {
  color: #8590A6;
  font-size: 14px;
}

html[data-theme="dark"] .ToolsQuestionItem-toolButtonText {
  color: #606A80;
}

.ToolsQuestionItem-toolHide {
  align-items: center;
  color: #8590A6;
  cursor: pointer;
  display: flex;
  font-size: 14px;
  height: 100%;
}

html[data-theme="dark"] .ToolsQuestionItem-toolHide {
  color: #606A80;
}
.ToolsGoodAtTopic {
  display: flex;
  flex-direction: column;
  height: 100%;
}

.ToolsGoodAtTopic .List-item {
  padding: 20px;
}

.ToolsGoodAtTopic-header {
  align-items: center;
  border-bottom: 1px solid #EBEBEB;
  display: flex;
  height: 55px;
  padding: 0 24px;
}

html[data-theme="dark"] .ToolsGoodAtTopic-header {
  border-bottom: 1px solid #444444;
}

.ToolsGoodAtTopic-body {
  flex: 1;
  overflow-y: scroll;
}

.ToolsGoodAtTopic-title {
  flex-grow: 1;
  line-height: 1;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
}

html[data-ios] .ToolsGoodAtTopic-title {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .ToolsGoodAtTopic-title {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

.ToolsGoodAtTopic-Input {
  width: 238px;
}

.ToolsGoodAtTopic-searchIcon {
  color: #8590A6;
}

html[data-theme="dark"] .ToolsGoodAtTopic-searchIcon {
  color: #606A80;
}

.ToolsGoodAtTopic-noGoodatHint {
  align-items: center;
  color: #8590A6;
  display: flex;
  flex-direction: column;
  font-size: 16px;
  height: 100%;
  justify-content: center;
}

html[data-theme="dark"] .ToolsGoodAtTopic-noGoodatHint {
  color: #606A80;
}

.ToolsGoodAtTopic-topic {
  border-bottom: 1px solid #EBEBEB;
  display: flex;
  margin: 0 24px;
  padding: 16px 0 14px;
}

html[data-theme="dark"] .ToolsGoodAtTopic-topic {
  border-bottom: 1px solid #444444;
}

.ToolsGoodAtTopic-topicList {
  height: 100%;
}

.ToolsGoodAtTopic-topic .TopicLink-avatar {
  flex-shrink: 0;
  margin-right: 16px;
}

.ToolsGoodAtTopic-topicInfo {
  flex-grow: 1;
  overflow: hidden;
}

.ToolsGoodAtTopic-topicName {
  font-size: 18px;
  line-height: 1;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
}

html[data-ios] .ToolsGoodAtTopic-topicName {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .ToolsGoodAtTopic-topicName {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

.ToolsGoodAtTopic-topicExcerpt {
  line-height: 1;
  margin-top: 16px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ToolsGoodAtTopic-topicButton {
  align-self: center;
  flex-shrink: 0;
  margin-left: 36px;
  width: 94px;
}

.ToolsGoodAtTopic-topicButtonGoodat--hovering {
  display: none;
}

.ToolsGoodAtTopic-topicButtonGoodat:hover .ToolsGoodAtTopic-topicButtonGoodat--default {
      display: none;
    }

.ToolsGoodAtTopic-topicButtonGoodat:hover .ToolsGoodAtTopic-topicButtonGoodat--hovering {
      display: inline-block;
    }

.ToolsGoodAtTopic-answerCount {
  color: #8590A6;
  font-size: 14px;
  margin-top: 13px;
}

html[data-theme="dark"] .ToolsGoodAtTopic-answerCount {
  color: #606A80;
}
.ToolsQuestionNew-header {
  align-items: center;
  border-bottom: 1px solid #EBEBEB;
  display: flex;
  height: 50px;
  margin: 0 20px;
}
  html[data-theme="dark"] .ToolsQuestionNew-header {
  border-bottom: 1px solid #444444;
}

.ToolsQuestionNew-title {
  flex-grow: 1;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
}

html[data-ios] .ToolsQuestionNew-title {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .ToolsQuestionNew-title {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

.ToolsQuestionNew-topic {
  color: #8590A6;
  cursor: pointer;
}

html[data-theme="dark"] .ToolsQuestionNew-topic {
  color: #606A80;
}

.ToolsQuestionNew-questionList {
  padding: 0 20px;
}

.ToolsQuestionNew-questionList .PlaceHolder {
    padding: 16px 0;
    width: 640px;
  }

.ToolsQuestionNew-goodatTopicHint {
  align-items: center;
  border-bottom: 1px solid #EBEBEB;
  color: #8590A6;
  display: flex;
  flex-direction: column;
  height: 194px;
  justify-content: center;
}

html[data-theme="dark"] .ToolsQuestionNew-goodatTopicHint {
  border-bottom: 1px solid #444444;
}

html[data-theme="dark"] .ToolsQuestionNew-goodatTopicHint {
  color: #606A80;
}

.ToolsQuestionNew-goodatTopicHintText {
  margin-top: 28px;
}

.ToolsQuestionNew-goodatTopicHintLink {
  color: #175199;
  cursor: pointer;
}

html[data-theme="dark"] .ToolsQuestionNew-goodatTopicHintLink {
  color: #175199;
}
.ToolsQuestionRecommend-header {
  align-items: center;
  border-bottom: 1px solid #EBEBEB;
  display: flex;
  height: 50px;
  margin: 0 20px;
}
  html[data-theme="dark"] .ToolsQuestionRecommend-header {
  border-bottom: 1px solid #444444;
}

.ToolsQuestionRecommend-title {
  flex-grow: 1;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
}

html[data-ios] .ToolsQuestionRecommend-title {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .ToolsQuestionRecommend-title {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

.ToolsQuestionRecommend-topic {
  color: #8590A6;
  cursor: pointer;
}

html[data-theme="dark"] .ToolsQuestionRecommend-topic {
  color: #606A80;
}

.ToolsQuestionRecommend-questionList {
  padding: 0 20px;
}

.ToolsQuestionRecommend-questionList .PlaceHolder {
    padding: 16px 0;
    width: 640px;
  }

.ToolsQuestionRecommend-goodatTopicHint {
  align-items: center;
  border-bottom: 1px solid #EBEBEB;
  color: #8590A6;
  display: flex;
  flex-direction: column;
  height: 194px;
  justify-content: center;
}

html[data-theme="dark"] .ToolsQuestionRecommend-goodatTopicHint {
  border-bottom: 1px solid #444444;
}

html[data-theme="dark"] .ToolsQuestionRecommend-goodatTopicHint {
  color: #606A80;
}

.ToolsQuestionRecommend-goodatTopicHintText {
  margin-top: 28px;
}

.ToolsQuestionRecommend-goodatTopicHintLink {
  color: #175199;
  cursor: pointer;
}

html[data-theme="dark"] .ToolsQuestionRecommend-goodatTopicHintLink {
  color: #175199;
}
.ToolsRecommend-tooltipIcon {
  color: #BFBFBF;
  cursor: pointer;
  margin-left: 4px;
}
  html[data-theme="dark"] .ToolsRecommend-tooltipIcon {
  color: #444444;
}
.ToolsRecommendTimesModal-tableContentTitle {
  width: 310px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ToolsRecommendTimesModal-tableContentDate {
  width: 108px;
  color: #999999;
}

html[data-theme="dark"] .ToolsRecommendTimesModal-tableContentDate {
  color: #646464;
}

.ToolsRecommendTimesModal-tableContentTimes {
  margin-left: 53px;
  color: #0084FF;
}

html[data-theme="dark"] .ToolsRecommendTimesModal-tableContentTimes {
  color: #3A76D0;
}

.ToolsRecommendTimesModal-modalTabs {
  width: 100%;
  margin-bottom: 20px;
  display: flex;
  justify-content: center;
}

.ToolsRecommendTimesModal-modalTab {
  cursor: pointer;
}

.ToolsRecommendTimesModal-SelectModalWrapper {
  width: 596px;
}

.ToolsRecommendTimesModal-SelectModalWrapper .Modal-content {
    padding: 0 0 32px;
  }
.ToolsRecommendList {
  padding: 20px;
}

.ToolsRecommendList .CreatorSection:first-child {
  margin-bottom: 20px;
}

.ToolsRecommendList-availableTimesSection .CreatorSection-header {
    align-items: center;
    display: flex;
  }

.ToolsRecommendList-availableTimesSection .CreatorSectionItem {
    flex-grow: 1;
  }

.ToolsRecommendList-availableTimesSectionTime {
  color: #0084FF;
  cursor: pointer;
}

html[data-theme="dark"] .ToolsRecommendList-availableTimesSectionTime {
  color: #3A76D0;
}

.ToolsRecommendList-availableTimesContainer {
  align-items: center;
  display: flex;
  justify-content: center;
  padding: 30px 0 25px;
}

.ToolsRecommendList-availableTimesContent {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  flex: 1;
}

.ToolsRecommendList-availableTimesHint {
  color: #8590A6;
  font-size: 14px;
  margin-bottom: 14px;
}

html[data-theme="dark"] .ToolsRecommendList-availableTimesHint {
  color: #606A80;
}

.ToolsRecommendList-availableTimesNumber {
  color: #444444;
  font-size: 26px;
}

html[data-theme="dark"] .ToolsRecommendList-availableTimesNumber {
  color: #808080;
}

.ToolsRecommendList-latestRewardWrapper {
  display: flex;
  justify-content: center;
  margin: 18px 0;
}

.ToolsRecommendList-latestReward {
  background: rgba(0, 132, 255, 0.08);
  display: inline-flex;
  padding: 4px;
  height: 26px;
  box-sizing: border-box;
  border-radius: 12px;
  align-items: center;
  cursor: pointer;
}

html[data-theme="dark"] .ToolsRecommendList-latestReward {
  background: rgba(58, 118, 208, 0.08);
}

.ToolsRecommendList-availableTimesDivider {
  height: 64px;
  border-left: 1px solid #EBEBEB;
}

html[data-theme="dark"] .ToolsRecommendList-availableTimesDivider {
  border-left: 1px solid #444444;
}

.ToolsRecommendList-latestRewardNewIcon {
  width: 37px;
  height: 18px;
  background: #0084FF;
  color: #FFFFFF;
  padding: 0 4px;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  border-radius: 9px;
}

html[data-theme="dark"] .ToolsRecommendList-latestRewardNewIcon {
  background: #3A76D0;
}

html[data-theme="dark"] .ToolsRecommendList-latestRewardNewIcon {
  color: #1A1A1A;
}

.ToolsRecommendList-latestRewardContent {
  color: #0084FF;
  margin: 0 6px;
}

html[data-theme="dark"] .ToolsRecommendList-latestRewardContent {
  color: #3A76D0;
}

.ToolsRecommendList-latestRewardArrowIcon {
  color: #0084FF;
}

html[data-theme="dark"] .ToolsRecommendList-latestRewardArrowIcon {
  color: #3A76D0;
}

.ToolsRecommendList-Table {
  table-layout: fixed;
}

.ToolsRecommendList-titleColumn {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ToolsRecommendList-Modal {
  height: auto;
}

.ToolsRecommendList-ruleContent {
  margin: 0 24px;
  height: 340px;
  overflow-y: scroll;
}

.ToolsRecommendList-confirmModalContent {
  text-align: center;
}

.ToolsRecommendList-hintLinkDivider {
  height: 17px;
  margin: 0 17px;
  border-left: 1px solid #EBEBEB;
}

html[data-theme="dark"] .ToolsRecommendList-hintLinkDivider {
  border-left: 1px solid #444444;
}

.ToolsRecommendList-hintLink {
  display: flex;
  align-items: center;
  cursor: pointer;
}

.ToolsRecommendList-historyIcon {
  width: 18px;
  height: 18px;
  fill: #808080;
  margin-right: 3px;
}

html[data-theme="dark"] .ToolsRecommendList-historyIcon {
  fill: #808080;
}

.ToolsRecommendList-bannedSection {
  width: 780px;
  height: 48px;
  background: #F1403C;
  box-shadow: 0 1px 3px 0 rgba(153, 153, 153, 0.1);
  display: flex;
  align-items: center;
  color: #FFFFFF;
  font-size: 14px;
  padding: 0 24px;
  border-radius: 4px;
  margin-bottom: 20px;
  box-sizing: border-box;
}

html[data-theme="dark"] .ToolsRecommendList-bannedSection {
  background: #B7302D;
}

html[data-theme="dark"] .ToolsRecommendList-bannedSection {
  box-shadow: 0 1px 3px 0 rgba(100, 100, 100, 0.1);
}

html[data-theme="dark"] .ToolsRecommendList-bannedSection {
  color: #1A1A1A;
}
.ToolsRecommendRecord-Table {
  table-layout: fixed;
}

.ToolsRecommendRecord-titleColumn {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.ToolsQuestionInvited-subTabs {
  align-items: stretch;
  border-bottom: 1px solid #EBEBEB;
  display: flex;
  height: 50px;
  margin: 0 20px;
}
  html[data-theme="dark"] .ToolsQuestionInvited-subTabs {
  border-bottom: 1px solid #444444;
}

.ToolsQuestionInvited-subTabsItem {
  align-items: center;
  cursor: pointer;
  display: flex;
  margin-right: 36px;
}

.ToolsQuestionInvited-subTabsItem--focused .ToolsQuestionInvited-subTabsItemTitle {
      /* 与设计一致，不支持设备将回退为 700 */
      font-weight: 600;
      /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
      font-synthesis: style;
    }

html[data-ios] .ToolsQuestionInvited-subTabsItem--focused .ToolsQuestionInvited-subTabsItemTitle {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .ToolsQuestionInvited-subTabsItem--focused .ToolsQuestionInvited-subTabsItemTitle {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

.ToolsQuestionInvited-subTabsItemTitle {
  margin-right: 8px;
}

.ToolsQuestionInvited-subTabsItemMeta {
  color: #8590A6;
}

html[data-theme="dark"] .ToolsQuestionInvited-subTabsItemMeta {
  color: #606A80;
}

.ToolsQuestionInvited-questionList {
  padding: 0 20px;
}

.ToolsQuestionInvited-questionList .PlaceHolder {
    padding: 16px 0;
    width: 640px;
  }
.CreatorDatePicker {
  display: flex;
}

.CreatorDatePicker-Button {
  padding: 0 12px;
  width: 100%;
}

.CreatorDatePicker-Button .Zi {
    margin-right: 4px;
  }
.CustomPromotion-cardWrapper {
  min-width: 286px; /* 给 pc 端预览时使用，hybrid 尺寸一定会大于这个值所以不会有影响 */
  margin: 40px 16px;
  border: 1px solid #EBEBEB;
  border-radius: 3px;
  position: relative;
}
  html[data-theme="dark"] .CustomPromotion-cardWrapper {
  border: 1px solid #444444;
}

.CustomPromotion-cardWrapperTag {
  position: absolute;
  padding: 0 4px;
  height: 20px;
  line-height: 20px;
  font-size: 10px;
  color: #FFFFFF;
  background-color: #1A1A1A;
  border: 4px solid #FFFFFF;
  border-radius: 8px;
  left: 8px;
  top: -14px;
}

html[data-theme="dark"] .CustomPromotion-cardWrapperTag {
  color: #1A1A1A;
}

html[data-theme="dark"] .CustomPromotion-cardWrapperTag {
  background-color: #999999;
}

html[data-theme="dark"] .CustomPromotion-cardWrapperTag {
  border: 4px solid #1A1A1A;
}

.CustomPromotion-mainContent {
  padding: 12px;
  display: flex;
  justify-content: space-between;
}

.CustomPromotion-mainContent--showWrapperTag {
    padding-top: 20px;
  }

.CustomPromotion-reasonWrapper {
  padding: 10px 12px;
  background: #F6F6F6;
  color: #808080;
  font-size: 12px;
  display: -webkit-box;
  text-overflow: ellipsis;
  word-break: break-word;
  overflow: hidden;
  -webkit-line-clamp: 2;
}

html[data-theme="dark"] .CustomPromotion-reasonWrapper {
  background: #2E2E2E;
}

html[data-theme="dark"] .CustomPromotion-reasonWrapper {
  color: #808080;
}
.Rating {
  display: flex;
}

.Rating-star {
  position: relative;
  width: 16px;
  height: 16px;
}

.Rating-star .Zi {
    position: absolute;
    left: 0;
    top: 0;
    width: 16px;
    height: 16px;
    fill: #ffaa00;
  }

.Rating-star--half .Zi:first-child {
    fill: #d7d7d9;
  }

.Rating-star--half .Zi:last-child {
    clip: rect(0, 8px, 16px, 0);
    -webkit-clip-path: inset(0 8px 0 0);
            clip-path: inset(0 8px 0 0);
  }

.Rating-star--empty path {
    fill: #d7d7d9;
  }
.CustomPromotion-emptyImgWrapper {
  width: 90px;
  height: 60px;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: #D3D3D3;
  border-radius: 8px;
  color: #FFFFFF;
}
  html[data-theme="dark"] .CustomPromotion-emptyImgWrapper {
  background-color: #2E2E2E;
}
  html[data-theme="dark"] .CustomPromotion-emptyImgWrapper {
  color: #EBEBEB;
}
.CustomPromotion-title {
  font-size: 16px;
  line-height: 1.28;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  overflow: hidden;
  word-break: break-all; /* for FF */
  word-break: break-word;
  max-height: 40px;
}

.CustomPromotion-textSection {
  display: flex;
  flex-direction: column;
  justify-content: center;
  width: calc(100% - 70px);
}

.CustomPromotion-textSection--rightImg {
    width: calc(100% - 100px);
  }

.CustomPromotion-statusList {
  margin-top: 2px;
  font-size: 12px;
  color: #999999;
}

.CustomPromotion-statusList *:not(:first-child):before {
    margin: 0 5px;
    content: '\B7';
  }

html[data-theme="dark"] .CustomPromotion-statusList {
  color: #646464;
}

.CustomPromotion-leftImg {
  width: 60px;
  height: 60px;
  -o-object-fit: cover;
     object-fit: cover;
  border-radius: 8px;
}

.CustomPromotion-leftImgWrapper {
  margin-right: 12px;
  display: flex;
}

.CustomPromotion-rightImg {
  width: 90px;
  height: 60px;
  -o-object-fit: cover;
     object-fit: cover;
  border-radius: 8px;
}

.CustomPromotion-rightImgWrapper {
  margin-left: 12px;
  display: flex;
}

.CustomPromotion-ebookImgWrapper {
  width: 60px;
  height: 80px;
  border-radius: 8px;
  overflow: hidden;
}

.CustomPromotion-ebookImg {
  width: 60px;
}

.CustomPromotion-scoreLine {
  margin-top: 3px;
  display: flex;
  height: 20px;
  font-size: 14px;
  color: #8590A6;
}

html[data-theme="dark"] .CustomPromotion-scoreLine {
  color: #606A80;
}

.CustomPromotion-TryTag {
  font-size: 12px;
  padding: 0 3px;
  height: 18px;
  border-radius: 3px;
  background-color: #FF9607;
  color: #FFFFFF;
  text-align: center;
  margin-right: 7px;
}

html[data-theme="dark"] .CustomPromotion-TryTag {
  background-color: #FF9607;
}

html[data-theme="dark"] .CustomPromotion-TryTag {
  color: #1A1A1A;
}

.CustomPromotion-Score {
  margin-top: -12px;
}
.ToolsCustomPromotion-phonePreviewer {
  position: relative;
  width: 320px;
  height: 627px;
}

.ToolsCustomPromotion-phonePreviewerCardWrapper {
  position: absolute;
  top: 85px;
  width: 221px;
}
.ToolsCustomPromotion-SelectModalWrapper {
  width: 596px;
}

.ToolsCustomPromotion-SelectModalWrapper .Modal-content {
  padding: 0 0 32px;
}

.ToolsCustomPromotion-tableContentTitle {
  width: 310px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: #175199;
}

.ToolsCustomPromotion-tableContentTitle--fission {
    width: 212px;
  }

html[data-theme="dark"] .ToolsCustomPromotion-tableContentTitle {
  color: #175199;
}

.ToolsCustomPromotion-infinityContent {
  align-items: center;
  display: flex;
  flex-direction: column;
  margin: 0 auto;
  padding: 20px 0 108px;
  width: 375px;
}

.ToolsCustomPromotion-infinityContent .CustomPromotion-cardWrapper {
    align-self: stretch;
  }

.ToolsCustomPromotion-infinityContentApplyButton {
  margin-top: -22px;
  width: 100px;
}

.ToolsCustomPromotion-infinityContentHint {
  color: #999999;
  font-size: 12px;
  margin-top: 20px;
  text-align: center;
  width: 300px;
}

html[data-theme="dark"] .ToolsCustomPromotion-infinityContentHint {
  color: #646464;
}

.ToolsCustomPromotion-fissionOption {
  width: 60px;
}

.ToolsCustomPromotion-modalTabs {
  width: 100%;
  margin-bottom: 20px;
  display: flex;
  justify-content: center;
}

.ToolsCustomPromotion-tableContentDate {
  color: #999999;
}

html[data-theme="dark"] .ToolsCustomPromotion-tableContentDate {
  color: #646464;
}

.ToolsCustomPromotion-modalTab {
  cursor: pointer;
}

.ToolsCustomPromotion-tableContentWrapper {
  display: flex;
  justify-content: flex-end;
}
.ToolsCustomPromotion-protocolModal {
  height: 546px;
}
.ToolsCustomPromotion-editWrapper {
  margin: 20px;
}

.ToolsCustomPromotion-editHint {
  margin-top: 30px;
  font-size: 14px;
  color: #444444;
}

html[data-theme="dark"] .ToolsCustomPromotion-editHint {
  color: #808080;
}

.ToolsCustomPromotion-editContent {
  display: flex;
  padding-bottom: 40px;
  border-bottom: 1px solid #EBEBEB;
}

html[data-theme="dark"] .ToolsCustomPromotion-editContent {
  border-bottom: 1px solid #444444;
}

.ToolsCustomPromotion-editOptionSection {
  margin-top: 10px;
  width: 410px;
  border: 1px solid #EBEBEB;
  padding: 14px 16px;
  border-radius: 6px;
}

html[data-theme="dark"] .ToolsCustomPromotion-editOptionSection {
  border: 1px solid #444444;
}

.ToolsCustomPromotion-editTitle {
  display: flex;
  justify-content: space-between;
  padding-bottom: 14px;
  align-items: center;
  border-bottom: 1px solid #EBEBEB;
}

html[data-theme="dark"] .ToolsCustomPromotion-editTitle {
  border-bottom: 1px solid #444444;
}

.ToolsCustomPromotion-boldText {
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
  width: 320px;
  overflow: hidden;
  word-wrap: break-word;
  text-overflow: ellipsis;
}

html[data-ios] .ToolsCustomPromotion-boldText {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .ToolsCustomPromotion-boldText {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

.ToolsCustomPromotion-editOptionSectionContent {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 145px;
}

.ToolsCustomPromotion-tab {
  cursor: pointer;
}

.ToolsCustomPromotion-editArea {
  width: 444px;
  margin-left: 20px;
}

.ToolsCustomPromotion-editArea .tablist {
    display: flex;
  }

.ToolsCustomPromotion-editAdd {
  width: 86px;
}

.ToolsCustomPromotion-editDatePickers {
  margin-top: 5px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: #808080;
}

html[data-theme="dark"] .ToolsCustomPromotion-editDatePickers {
  color: #808080;
}

.ToolsCustomPromotion-submitButtonWrapper {
  margin-top: 20px;
}

.ToolsCustomPromotion-submitButton {
  width: 86px;
}

.ToolsCustomPromotion-editOptionSectionSelectedReasonEdit {
  display: flex;
  flex-direction: column;
  justify-content: space-around;
  flex: 1;
}

.ToolsCustomPromotion-editReasonInput {
  margin-top: 5px;
  border: none;
  outline: none;
}

.ToolsCustomPromotion-editReasonInput.is-focus {
    border: none;
  }

.ToolsCustomPromotion-reasonErrorHint {
  color: #F1403C;
  min-height: 21px;
}

html[data-theme="dark"] .ToolsCustomPromotion-reasonErrorHint {
  color: #B7302D;
}

.ToolsCustomPromotion-protocol {
  margin-top: 30px;
  font-size: 12px;
  color: #999999;
}

html[data-theme="dark"] .ToolsCustomPromotion-protocol {
  color: #646464;
}
.ToolsCustomPromotion-protocolButton {
  font-size: 12px;
  color: #0084FF;
}
html[data-theme="dark"] .ToolsCustomPromotion-protocolButton {
  color: #3A76D0;
}

.ToolsCustomPromotion-fissionTab {
  display: flex;
  align-items: center;
}

.ToolsCustomPromotion-newIcon {
  width: 32px;
  height: 15px;
}
.ToolsCustomPromotion-showStatusContent {
  width: 100%;
  padding: 30px;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.ToolsCustomPromotion-showStatusHint {
  text-align: center;
  font-size: 14px;
  color: #999999;
  margin-top: 12px;
  margin-bottom: 24px;
  width: 378px;
}

.ToolsCustomPromotion-showStatusHint--error {
    width: 310px;
    color: #F1403C;
  }

html[data-theme="dark"] .ToolsCustomPromotion-showStatusHint--error {
    color: #B7302D;
}

html[data-theme="dark"] .ToolsCustomPromotion-showStatusHint {
  color: #646464;
}

.ToolsCustomPromotion-showStatusTitle {
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
}

html[data-ios] .ToolsCustomPromotion-showStatusTitle {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .ToolsCustomPromotion-showStatusTitle {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

.ToolsCustomPromotion-showStatusButtonGroup {
  width: 230px;
  display: flex;
  justify-content: space-around;
}

.ToolsCustomPromotion-showStatusPhonePreviewerWrapper {
  margin-top: 33px;
}

.ToolsCustomPromotion-showStatusCancelModalText {
  width: 100%;
  text-align: center;
}

.ToolsCustomPromotion-fissionTableLink {
  color: #999999;
  display: flex;
  align-items: center;
}

html[data-theme="dark"] .ToolsCustomPromotion-fissionTableLink {
  color: #646464;
}

.ToolsCustomPromotion-fissionTableLinkWrapper {
  margin-top: 20px;
  margin-left: 20px;
}
.ProfitRewardPromotion-total {
  border-bottom: 1px solid #EBEBEB;
  display: flex;
  padding: 16px 0;
}
  html[data-theme="dark"] .ProfitRewardPromotion-total {
  border-bottom: 1px solid #444444;
}

.ProfitRewardPromotion-totalItem {
  align-items: center;
  border-right: 1px solid #EBEBEB;
  display: flex;
  flex: 1;
  flex-direction: column;
  height: 80px;
  justify-content: center;
}

.ProfitRewardPromotion-totalItem:last-child {
    border-right: none;
  }

html[data-theme="dark"] .ProfitRewardPromotion-totalItem {
  border-right: 1px solid #444444;
}

.ProfitRewardPromotion-totalItemTitle {
  color: #8590A6;
  font-size: 14px;
  line-height: 1;
}

html[data-theme="dark"] .ProfitRewardPromotion-totalItemTitle {
  color: #606A80;
}

.ProfitRewardPromotion-totalItemNumber {
  font-size: 26px;
  line-height: 1;
  margin-top: 16px;
}
.Creator-Iframe {
  border: none;
  width: 100%;
}
.ProfitCommercialTask-iframe {
  border: none;
  height: 1440px;
  width: 100%;
}
.ExploreAcademy-article {
  border-bottom: 1px solid #EBEBEB;
  margin: 0 20px;
}

  .ExploreAcademy-article--current .ExploreAcademy-articleTitleDot {
      background-color: #0084FF;
    }

  html[data-theme="dark"] .ExploreAcademy-article--current .ExploreAcademy-articleTitleDot {
      background-color: #3A76D0;
}

  .ExploreAcademy-article--current .ExploreAcademy-articleTitleText {
      color: #0084FF;
    }

  html[data-theme="dark"] .ExploreAcademy-article--current .ExploreAcademy-articleTitleText {
      color: #3A76D0;
}

  .ExploreAcademy-article--current .ExploreAcademy-articleContent {
      display: block;
    }

  html[data-theme="dark"] .ExploreAcademy-article {
  border-bottom: 1px solid #444444;
}

.ExploreAcademy-articleTitle {
  align-items: center;
  cursor: pointer;
  display: flex;
  font-size: 16px;
  height: 60px;
}

.ExploreAcademy-articleTitleDot {
  background-color: #8590A6;
  border-radius: 3px;
  color: #1A1A1A;
  height: 6px;
  margin-right: 14px;
  width: 6px;
}

html[data-theme="dark"] .ExploreAcademy-articleTitleDot {
  background-color: #606A80;
}

html[data-theme="dark"] .ExploreAcademy-articleTitleDot {
  color: #999999;
}

.ExploreAcademy-articleTitleText {
  flex-grow: 1;
}

.ExploreAcademy-articleTitleIcon {
  color: #8590A6;
}

html[data-theme="dark"] .ExploreAcademy-articleTitleIcon {
  color: #606A80;
}

.ExploreAcademy-articleContent {
  display: none;
  padding: 0 0 20px 20px;
}
.GrowthLevel-panelSvgWrapper {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.GrowthLevel-generalProcessBarSection {
  width: 100%;
  height: 78px;
  border-bottom: solid 1px rgba(255, 255, 255, 0.18);
}

html[data-theme="dark"] .GrowthLevel-generalProcessBarSection {
  border-bottom: solid 1px rgba(26, 26, 26, 0.18);
}

.GrowthLevel-arrowBorderBox {
  width: 13px;
  height: 13px;
  position: relative;
  background: #2bafff; /*hack 成和背景一致的颜色*/
  border: 1px solid rgba(255, 255, 255, 0.18);
  top: -9px;
  left: calc(50% - 7px);
  border-top: 0;
  border-left: 0;
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
}

html[data-theme="dark"] .GrowthLevel-arrowBorderBox {
  border: 1px solid rgba(26, 26, 26, 0.18);
}

.GrowthLevel-currentProcessSection {
  width: 100%;
  height: 262px;
  display: flex;
  flex-direction: column;
}

.GrowthLevel-currentProcessSectionLevel {
  width: 100%;
  margin-top: 40px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.GrowthLevel-currentProcessSectionLevelText {
  font-size: 28px;
  margin: 0 20px;
  color: #FFFFFF;
}

html[data-theme="dark"] .GrowthLevel-currentProcessSectionLevelText {
  color: #1A1A1A;
}

.GrowthLevel-currentProcessSectionQuote--left {
  -webkit-transform: rotateY(180deg);
          transform: rotateY(180deg);
}

.GrowthLevel-currentProcessSectionBarContainer {
  margin-top: 24px;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #FFFFFF;
  font-size: 16px;
}

html[data-theme="dark"] .GrowthLevel-currentProcessSectionBarContainer {
  color: #1A1A1A;
}

.GrowthLevel-currentProcessSectionBar {
  margin: 3px 12px 0;
}

.GrowthLevel-rightsSection {
  margin-top: 33px;
  width: 100%;
  display: flex;
  justify-content: center;
  color: #FFFFFF;
}

html[data-theme="dark"] .GrowthLevel-rightsSection {
  color: #1A1A1A;
}

.GrowthLevel-rightsSectionDecorator {
  width: 91px;
  height: 2px;
  opacity: 0.9;
  background: linear-gradient(
    to left,
    rgba(255, 255, 255, 0.8),
    rgba(255, 255, 255, 0)
  );
  margin-right: 28px;
}

.GrowthLevel-rightsSectionDecorator--reverse {
    -webkit-transform: rotateY(180deg);
            transform: rotateY(180deg);
    margin-right: 0;
  }

html[data-theme="dark"] .GrowthLevel-rightsSectionDecorator {
  background: linear-gradient(
    to left,
    rgba(26, 26, 26, 0.8),
    rgba(26, 26, 26, 0)
  );
}

.GrowthLevel-rightsSectionIcons {
  margin-top: 18px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.GrowthLevel-rightsSectionIconItem {
  fill: #FFFFFF;
  width: 48px;
  height: 48px;
  margin-right: 28px;
}

html[data-theme="dark"] .GrowthLevel-rightsSectionIconItem {
  fill: #1A1A1A;
}

.GrowthLevel-dividerSection {
  width: 100%;
  height: 17px;
  color: #FFFFFF;
  font-size: 12px;
  display: flex;
  align-items: center;
}

html[data-theme="dark"] .GrowthLevel-dividerSection {
  color: #1A1A1A;
}

.GrowthLevel-dividerSectionText {
  margin: 0 12px;
  opacity: 0.7;
}

.GrowthLevel-dividerSectionLine {
  flex: 1;
  height: 1px;
  opacity: 0.18;
  background: #FFFFFF;
}

html[data-theme="dark"] .GrowthLevel-dividerSectionLine {
  background: #1A1A1A;
}

.GrowthLevel-ownedRightsSection {
  width: 100%;
  height: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
  justify-self: flex-end;
}

.GrowthLevel-ownedRightsSectionIconItem {
  fill: #FFFFFF;
  width: 24px;
  height: 24px;
  margin-right: 24px;
}

.GrowthLevel-ownedRightsSectionIconItem:first-child {
    margin-left: 24px;
  }

html[data-theme="dark"] .GrowthLevel-ownedRightsSectionIconItem {
  fill: #1A1A1A;
}

.GrowthLevel-toolTip .TooltipContent {
  background: #FFFFFF;
}

.GrowthLevel-toolTip .TooltipContent::before {
    border-color: #FFFFFF;
  }

html[data-theme="dark"] .GrowthLevel-toolTip .TooltipContent::before {
    border-color: #1A1A1A;
}

html[data-theme="dark"] .GrowthLevel-toolTip .TooltipContent {
  background: #1A1A1A;
}

.GrowthLevel-toolTipText {
  color: #0084FF;
}

html[data-theme="dark"] .GrowthLevel-toolTipText {
  color: #3A76D0;
}

.GrowthLevel-toolTipText a {
  text-decoration: none;
}

.GrowthLevel-rightsSectionName {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.GrowthLevel-cardContent {
  padding: 20px;
}

.GrowthLevel-panelCard {
  margin-bottom: 20px;
  border: 1px solid #EBEBEB;
}

html[data-theme="dark"] .GrowthLevel-panelCard {
  border: 1px solid #444444;
}

.GrowthLevel-panelCardHeader {
  border-bottom: 1px solid #EBEBEB;
}

html[data-theme="dark"] .GrowthLevel-panelCardHeader {
  border-bottom: 1px solid #444444;
}

.GrowthLevel-container .Card-headerText {
  width: 100%;
  display: flex;
  justify-content: space-between;
}

.GrowthLevel-panelCardHeaderHint {
  font-weight: normal;
  color: #808080;
}

html[data-theme="dark"] .GrowthLevel-panelCardHeaderHint {
  color: #808080;
}

.GrowthLevel-panelCardContent {
  height: 415px;
  background: url(https://static.zhihu.com/heifetz/growth_level_bg.21160237fdb56411020c.png);
  display: flex;
  flex-direction: column;
  align-items: center;
}

.GrowthLevel-bottomSection {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-bottom: 40px;
  margin-top: -100px;
  padding: 0 24px;
}

.GrowthLevel-bottomSection--hasCanApplyHint {
    margin-bottom: 24px;
  }

.GrowthLevel-bottomText {
  margin-bottom: 20px;
  font-size: 15px;
}

.GrowthLevel-canApplyHint {
  align-items: center;
  /* hack: 这个颜色即将被加入色组 */
  background: #f7f8fa;
  border-radius: 2px;
  color: #8590A6;
  display: flex;
  flex-direction: column;
  padding: 24px 0;
  width: 100%;
}

.GrowthLevel-canApplyHint span {
    font-weight: bold;
  }

.GrowthLevel-canApplyHint .GrowthLevel-bottomButton {
    margin-top: 10px;
  }

html[data-theme="dark"] .GrowthLevel-canApplyHint {
  color: #606A80;
}

.GrowthLevel-blueText {
  color: #0084FF;
}

html[data-theme="dark"] .GrowthLevel-blueText {
  color: #3A76D0;
}

.GrowthLevel-bottomButton {
  box-sizing: border-box;
  z-index: 1;
  width: 186px;
}

.GrowthLevel-descriptionContent {
  padding: 20px;
}

.GrowthLevel-ul > li {
  list-style: inside;
}
.AccountRights-title {
  border-bottom: 1px solid #EBEBEB;
  font-size: 16px;
  line-height: 50px;
  padding-left: 20px;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
}
  html[data-ios] .AccountRights-title {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }
  html[data-android] .AccountRights-title {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }
  html[data-theme="dark"] .AccountRights-title {
  border-bottom: 1px solid #444444;
}

.AccountRights-rightsList {
  display: flex;
  flex-wrap: wrap;
  padding: 10px 10px 20px;
}

.AccountRights-rights {
  box-sizing: border-box;
  margin: 10px;
  width: 380px;
}

.AccountRights-rights .CreatorSection-header {
    padding-left: 20px;
    position: relative;
  }

.AccountRights-rightsBody {
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  height: 180px;
  padding: 20px 20px 15px;
}

.AccountRights-rightsTitle {
  align-items: center;
  display: flex;
  height: 60px;
}

.AccountRights-rightsIcon {
  color: #0084FF;
  margin-right: 10px;
}

html[data-theme="dark"] .AccountRights-rightsIcon {
  color: #3A76D0;
}

.AccountRights-rightsName {
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
}

html[data-ios] .AccountRights-rightsName {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .AccountRights-rightsName {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

.AccountRights-rightsRequirement {
  color: #808080;
  flex-grow: 1;
  font-size: 14px;
  margin-top: 10px;
}

html[data-theme="dark"] .AccountRights-rightsRequirement {
  color: #808080;
}

.AccountRights-RightsButton {
  align-self: flex-end;
}

.AccountRights-moreRightsHint {
  align-items: center;
  height: 240px;
  justify-content: center;
  padding: 0;
}

.AccountRights-moreRightsHintImage {
  height: 88px;
  -o-object-fit: cover;
     object-fit: cover;
  width: 88px;
}

.AccountRights-moreRightsHintText {
  color: #808080;
  margin-top: 10px;
}

html[data-theme="dark"] .AccountRights-moreRightsHintText {
  color: #808080;
}

.AccountRights-CanApplyLabel {
  background: rgba(255, 51, 102, 0.09);
  border-radius: 2px;
  color: #FF3366;
  font-size: 12px;
  line-height: 20px;
  padding: 0 8px;
  position: absolute;
  right: 20px;
  top: 20px;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
}

html[data-ios] .AccountRights-CanApplyLabel {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .AccountRights-CanApplyLabel {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

html[data-theme="dark"] .AccountRights-CanApplyLabel {
  background: rgba(217, 33, 85, 0.09);
}

html[data-theme="dark"] .AccountRights-CanApplyLabel {
  color: #D92155;
}
.CreatorSettings-fieldItem {
  display: flex;
  align-items: center;
  min-height: 80px;
}
  .CreatorSettings-fieldItem:not(:first-child) {
    border-top: 1px solid #EBEBEB;
  }
  html[data-theme="dark"] .CreatorSettings-fieldItem:not(:first-child) {
    border-top: 1px solid #444444;
}

.CreatorSettings-fieldItemLabel {
  width: 160px;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
}

html[data-ios] .CreatorSettings-fieldItemLabel {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .CreatorSettings-fieldItemLabel {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

.CreatorSettings-fieldItemContent {
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: space-between;
}
.CreatorSettings-identityAddModal {
  width: 700px;
}

.CreatorSettings-identityAddModalContentWrapper {
  padding-top: 10px;
}

.CreatorSettings-identityAddModalContentWrapper--cardType {
    padding-top: 15px;
  }

.CreatorSettings-identityAddModalButtonGroup {
  justify-content: center;
}

.CreatorSettings-identityAddModalButton {
  width: 168px;
  flex: initial !important;
}

.CreatorSettings-identityHavePhotoHint {
  margin-top: 20px;
}

.CreatorSettings-identityPhotoList {
  margin-left: -10px;
}
.CreatorSettings-fieldUploadImageFieldSection {
  display: flex;
  flex-direction: column;
}

.CreatorSettings-fieldUploadImageFieldWrapper {
  display: flex;
  flex-direction: column;
}

.CreatorSettings-fieldUploadImageFieldHint {
  display: flex;
  margin-left: 130px;
  flex-direction: column;
}

.CreatorSettings-extraMaterialDescription {
  margin-bottom: 40px;
  line-height: 24px;
}

.CreatorSettings-extraMaterialDescription * {
    font-weight: normal;
  }

.CreatorSettings-extraMaterialDescription ul {
    margin-left: 20px;
  }

.CreatorSettings-extraMaterialDescription li {
    list-style: disc inside;
  }

.CreatorSettings-extraMaterialType {
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
  color: #1A1A1A;
}

html[data-ios] .CreatorSettings-extraMaterialType {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .CreatorSettings-extraMaterialType {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

html[data-theme="dark"] .CreatorSettings-extraMaterialType {
  color: #999999;
}
.CreatorSettings-content {
  padding: 20px;
}

.CreatorSettings-innerCard {
  border: 1px solid #EBEBEB;
}

html[data-theme="dark"] .CreatorSettings-innerCard {
  border: 1px solid #444444;
}

.CreatorSettings-innerCardTitle {
  height: 60px;
  padding: 20px;
  display: flex;
  justify-content: space-between;
  box-sizing: border-box;
  border-bottom: 1px solid #EBEBEB;
}

.CreatorSettings-innerCardTitle > *:first-child {
    /* 与设计一致，不支持设备将回退为 700 */
    font-weight: 600;
    /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
    font-synthesis: style;
  }

html[data-ios] .CreatorSettings-innerCardTitle > *:first-child {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .CreatorSettings-innerCardTitle > *:first-child {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

html[data-theme="dark"] .CreatorSettings-innerCardTitle {
  border-bottom: 1px solid #444444;
}

.CreatorSettings-innerCardTitleLeft {
  display: flex;
}

.CreatorSettings-innerCardTitleHint {
  font-weight: normal;
  color: #FF9607;
  margin-left: 10px;
}

html[data-theme="dark"] .CreatorSettings-innerCardTitleHint {
  color: #FF9607;
}

.CreatorSettings-innerCardContent {
  padding: 0 20px;
}

.CreatorSettings-editingField {
  padding-top: 25px;
}

.CreatorSettings-buttonGroup {
  width: 120px;
  display: flex;
  justify-content: space-around;
  margin-top: -20px;
}

.CreatorSettings-statusSection {
  display: flex;
  font-weight: normal;
  font-weight: initial;
}

.CreatorSettings-statusSectionNotPassHint {
  display: flex;
  color: #F1403C;
  margin-right: 5px;
  font-size: 14px;
}

html[data-theme="dark"] .CreatorSettings-statusSectionNotPassHint {
  color: #B7302D;
}

.CreatorSettings-statusSectionReviewingHint {
  color: #999999;
  margin-right: 5px;
  font-size: 14px;
}

html[data-theme="dark"] .CreatorSettings-statusSectionReviewingHint {
  color: #646464;
}

.CreatorSettings-statusSection {
  display: flex;
}

.CreatorSettings-statusTextGroup {
  display: flex;
}

.CreatorSettings-statusTextGroup *:not(:last-child) {
    margin-left: 10px;
  }
.Anonymous-confirm ul {
    padding-left: 2em;
  }

    .Anonymous-confirm ul li {
      list-style: disc;
    }
.Redirector {
  width: 100vw;
  height: 100vh;
  overflow: hidden;
  background-color: #eff2f5;
  display: flex;
  justify-content: center;
  align-items: center;
}

.Redirector-body > div:first-child {
    display: flex;
    font-size: 30px;
    color: #222222;
    line-height: 1.2;
    margin: 0 0 0.33em 0.33em;
    /* 与设计一致，不支持设备将回退为 700 */
    font-weight: 600;
    /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
    font-synthesis: style;
  }

html[data-ios] .Redirector-body > div:first-child {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .Redirector-body > div:first-child {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

.Redirector-content {
  width: 404px;
  box-sizing: border-box;
  padding: 36px 20px;
  border-radius: 4px;
  font-size: 16px;
  background-color: #f7f7f7;
  border: solid 1px #babbbc;
  text-align: center;
}

.Redirector-mobileContent {
  width: unset;
  padding: 24px 20px;
}

.Redirector-mobileContent .Redirector-counter {
    padding: 20px 0;
    margin-bottom: 16px;
  }

.Redirector-title {
  font-size: 18px;
  color: #000000;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
}

html[data-ios] .Redirector-title {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .Redirector-title {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

.Redirector-counter {
  color: #999999;
  padding: 30px 0;
  border-bottom: 1px solid #9a9a9a;
  margin-bottom: 24px;
}

.Redirector-link {
  color: #105cb6;
}
.SpecialQuestionAuthor {
  display: flex;
  align-items: center;
  height: 28px;
  line-height: 28px;
  color: #8590A6;
  font-size: 15px;
}

  .SpecialQuestionAuthor-Author {
    margin-left: 8px;
    color: #175199;
  }

  html[data-theme="dark"] .SpecialQuestionAuthor-Author {
    color: #175199;
}

  .SpecialQuestionAuthor-Badge {
    margin-left: 5px;
  }

  .SpecialQuestionAuthor-Suffix {
    margin-left: 5px;
  }

  html[data-theme="dark"] .SpecialQuestionAuthor {
  color: #606A80;
}

.SpecialQuestionAuthor--mobile {
  height: 22px;
  line-height: 22px;
}
.QuestionAsk-title {
  font-size: 15px;
}

.QuestionAsk-section {
  margin-bottom: 12px;
}

.QuestionAsk-section.QuestionAsk-DetailSection {
    margin-top: 24px;
  }

.QuestionAsk-section .Popover {
    display: block;
  }

.QuestionAsk-section .TagInput {
    line-height: 0;
  }

.QuestionAsk-sectionHeader {
  display: flex;
  align-items: center;
  padding-left: 13px;
  margin-bottom: 8px;
  color: #8590A6;
}

html[data-theme="dark"] .QuestionAsk-sectionHeader {
  color: #606A80;
}

.QuestionAsk-label {
  color: #444444;
}

html[data-theme="dark"] .QuestionAsk-label {
  color: #808080;
}

.QuestionAsk-sectionHeaderRight {
  margin-left: auto;
}

.QuestionAsk-sectionHeaderRight .Editable-control:last-child {
    margin-right: 13px; /* vertical align with search icon */
  }

.QuestionAsk-warning {
  color: #FF9607;
}

html[data-theme="dark"] .QuestionAsk-warning {
  color: #FF9607;
}

.QuestionAsk-Modal {
  width: 595px; /* 工具栏按钮很多，防止折行 */
}

.QuestionAsk-Modal .Modal-footer,
.QuestionAsk-error {
  color: #F1403C;
}

html[data-theme="dark"] .QuestionAsk-Modal .Modal-footer, html[data-theme="dark"] .QuestionAsk-error {
  color: #B7302D;
}

.QuestionAsk-questionItems {
  /* TODO: copied from Input style, maybe we can abstract it! */
  line-height: 26px;
  border: 1px solid #EBEBEB;
  border-radius: 3px;
  box-sizing: border-box;
}

html[data-theme="dark"] .QuestionAsk-questionItems {
  border: 1px solid #444444;
}

.QuestionAsk-questionItem {
  display: flex;
  padding: 8px 0;
  margin-left: -8px;
  margin-right: -8px;
}

.QuestionAsk-questionItem.QuestionAsk-questionItemClose {
    color: #8590A6;
    border-bottom: 1px solid #EBEBEB;
  }

html[data-theme="dark"] .QuestionAsk-questionItem.QuestionAsk-questionItemClose {
    color: #606A80;
}

html[data-theme="dark"] .QuestionAsk-questionItem.QuestionAsk-questionItemClose {
    border-bottom: 1px solid #444444;
}

.QuestionAsk-questionTitle {
  margin-right: 14px;
}

.QuestionAsk-questionAnswerCount {
  margin-left: auto;
  color: #8590A6;
  white-space: nowrap;
}

html[data-theme="dark"] .QuestionAsk-questionAnswerCount {
  color: #606A80;
}

.QuestionAsk-anonymous {
  color: #8590A6;
  cursor: pointer;
}

html[data-theme="dark"] .QuestionAsk-anonymous {
  color: #606A80;
}

.QuestionAsk-anonymousCheckbox {
  margin-right: 8px;
  vertical-align: text-top;
}

.QuestionEdit-reasonSelect {
  margin-right: 8px;
}

.QuestionEdit-why {
  color: #175199;
}

.QuestionEdit-why:hover {
    border-bottom: 1px solid #175199;
  }

html[data-theme="dark"] .QuestionEdit-why:hover {
    border-bottom: 1px solid #175199;
}

html[data-theme="dark"] .QuestionEdit-why {
  color: #175199;
}

.QuestionAsk-orgQuestionIcon {
  margin-left: 8px;
}

.QuestionAsk-brandSelector {
  width: 100%;
}

.QuestionAsk-brandSelector .Select-button {
    position: relative;
    padding: 0 12px;
    width: 100%;
  }

.QuestionAsk-brandSelector .Select-arrow {
    position: absolute;
    top: 12px;
    right: 12px;
  }

.QuestionAsk-brandSelector .Icon {
    margin-left: 5px;
  }

.QuestionAsk-brandSelector--no-arrow .Select-arrow {
    display: none;
  }

.QuestionAsk-brandOption {
  padding: 0 12px;
  width: 488px;
}

.QuestionAsk-brandOption .Icon {
    margin-left: 5px;
  }

.QuestionAsk-buttonGroup {
  display: flex;
  flex-direction: row;
  justify-content: center;
  margin-top: 28px;
}

.QuestionAsk-buttonGroup .Button {
    width: 232px;
    margin-top: 28px;
  }

.QuestionAsk-buttonGroup .Button + .Button {
    margin-left: 24px;
  }

.QuestionAsk-noBrandModal {
  text-align: center;
}

.QuestionAsk-link {
  color: #0084FF;
}

html[data-theme="dark"] .QuestionAsk-link {
  color: #3A76D0;
}

.QuestionAsk-videoAlert,
.QuestionEdit-videoAlert,
.QuestionEdit-onUploadModal,
.QuestionAsk-onUploadModal {
  margin: 50px 16px 0;
  font-size: 20px;
  text-align: center;
  color: #444444;
}

html[data-theme="dark"] .QuestionAsk-videoAlert, html[data-theme="dark"] .QuestionEdit-videoAlert, html[data-theme="dark"] .QuestionEdit-onUploadModal, html[data-theme="dark"] .QuestionAsk-onUploadModal {
  color: #808080;
}

.QuestionEdit-reason {
  display: flex;
  justify-content: space-between;
  align-items: center;
  cursor: pointer;
  line-height: 48px;
  box-shadow: inset 0 -1px 0 0 #F6F6F6;
}

.QuestionEdit-reason:last-child {
    margin-bottom: 16px;
  }

.QuestionEdit-reason svg {
    fill: #8590A6;
  }

html[data-theme="dark"] .QuestionEdit-reason svg {
    fill: #606A80;
}

html[data-theme="dark"] .QuestionEdit-reason {
  box-shadow: inset 0 -1px 0 0 #2E2E2E;
}

.QuestionAsk-Modal .Editable-videoUploader-uploadPosterButton {
  bottom: -90px;
}
.TagInput .Input-wrapper {
    display: block;
  }
  .TagInput .Input {
    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;
  }
.AnswerCard {
  transition: box-shadow 300ms;
}

  .AnswerCard.is-focus {
    position: relative;
    z-index: 1;
    box-shadow: 0 5px 30px rgba(26, 26, 26, 0.16);
  }

  html[data-theme="dark"] .AnswerCard.is-focus {
    box-shadow: 0 5px 30px rgba(153, 153, 153, 0.16);
}
.QuestionButtonGroup {
  display: inline-block;
  margin: 0 -8px;
}

  .QuestionButtonGroup .Button {
    margin: 0 8px;
  }

.QuestionButton-icon {
  vertical-align: text-bottom;
  margin-right: 4px;
}

.MobileQuestionButtonGroup .Button {
    margin-right: 16px;
  }

/* 
 * TODO: PC 顶部邀请回答实验 http://jira.in.zhihu.com/browse/SHEQU-649 
 * 确定使用 C 方案后，修改 QuestionButtonGroup 中的 modify Icon，使用 zhihu-icons，防止下面强制的样式覆盖
 * 如果使用其它方案，删除下面整个 block
 */
.PageHeader .QuestionButtonGroup--withInvite {
  display: flex;
  justify-content: space-between;
  width: 100%;
  margin: 0;
}
.PageHeader .QuestionButtonGroup--withInvite .Button {
    white-space: nowrap;
    width: 88px;
    min-width: 88px;
    margin: 0;
    padding: 0;
    text-align: center;
  }
.PageHeader .QuestionButtonGroup--withInvite .Button:nth-child(2) .Icon--modify {
      width: 12px !important;
    }
.PageHeader .QuestionButtonGroup--withInvite .Button:nth-child(3) {
      width: 96px;
    }
.QuestionMainAction {
  width: 100%;
  height: 50px;
  font-size: 15px;
  border: none;
  border-radius: 0;
}

  .QuestionMainAction:first-child:not(:last-child) {
    border-bottom: 1px solid #EBEBEB;
  }

  html[data-theme="dark"] .QuestionMainAction:first-child:not(:last-child) {
    border-bottom: 1px solid #444444;
}

  .QuestionMainAction:last-child:not(:first-child) {
    border-top: 1px solid #EBEBEB;
  }

  html[data-theme="dark"] .QuestionMainAction:last-child:not(:first-child) {
    border-top: 1px solid #444444;
}

  .QuestionMainAction a {
    color: #175199;
  }

  .QuestionMainAction a:hover {
    border-bottom: 1px solid #175199;
  }

  html[data-theme="dark"] .QuestionMainAction a:hover {
    border-bottom: 1px solid #175199;
}

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

a.QuestionMainAction {
  display: block;
  line-height: 50px;
  color: #8590A6;
  text-align: center;
}

a.QuestionMainAction:hover {
    color: #175199;
  }

html[data-theme="dark"] a.QuestionMainAction:hover {
    color: #175199;
}

html[data-theme="dark"] a.QuestionMainAction {
  color: #606A80;
}
.AutoInviteItem-button--open {
    color: grey;
  }
  .AutoInviteItem-button--closed {
    color: #0084FF;
  }
  html[data-theme="dark"] .AutoInviteItem-button--closed {
    color: #3A76D0;
}

.AutoInviteItem-wrapper--desktop {
    padding: 12px;
    background: #F6F6F6;
    border-radius: 8px;
    margin: 12px 12px 0;
  }

html[data-theme="dark"] .AutoInviteItem-wrapper--desktop {
    background: #2E2E2E;
}

.AutoInviteItem-wrapper--mobile {
    background: #F6F6F6;
    padding: 12px 16px;
  }

html[data-theme="dark"] .AutoInviteItem-wrapper--mobile {
    background: #2E2E2E;
}
.QuestionInvitation {
  display: flex;
  flex-direction: column;
  height: 100%;
}

  .QuestionInvitation .Card-headerText {
    color: #8590A6;
  }

  html[data-theme="dark"] .QuestionInvitation .Card-headerText {
    color: #606A80;
}

  .QuestionInvitation em {
    font-style: normal;
    color: #F1403C;
  }

  html[data-theme="dark"] .QuestionInvitation em {
    color: #B7302D;
}

.QuestionInvitation-title {
  font-size: 16px;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
}

html[data-ios] .QuestionInvitation-title {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .QuestionInvitation-title {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

.QuestionInvitation-content {
  flex: 1;
  overflow-x: hidden;
  overflow-y: auto;
}

.QuestionInvitation-content .ContentItem-title + .QuestionInvitation-content .ContentItem-meta {
    margin-top: 4px;
  }

.QuestionInvitation-content .List-item {
    padding: 12px 24px;
  }

.QuestionInvitation-content .List-item--mobile {
    padding: 12px 16px;
  }

.QuestionInvitation-content .ContentItem-title {
    font-size: 15px;
    line-height: 1.6;
  }

.QuestionInvitation-content .Avatar {
    width: 38px !important;
    height: 38px !important;
  }

.QuestionInvitation-content .UserItem {
    font-size: 15px;
  }

.QuestionInvitation-content .ContentItem-meta {
    font-size: 14px;
  }

.QuestionInvitation-content .ContentItem-extra > .Button {
    width: 80px;
    height: 32px;
    padding: 0;
  }

.QuestionInvitation-content--centered {
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 160px;
}

.QuestionInvitation-content--centered .ContentItem-title + .QuestionInvitation-content--centered .ContentItem-meta {
    margin-top: 4px;
  }

.QuestionInvitation-content--centered .List-item {
    padding: 12px 24px;
  }

.QuestionInvitation-content--centered .List-item--mobile {
    padding: 12px 16px;
  }

.QuestionInvitation-content--centered .ContentItem-title {
    font-size: 15px;
    line-height: 1.6;
  }

.QuestionInvitation-content--centered .Avatar {
    width: 38px !important;
    height: 38px !important;
  }

.QuestionInvitation-content--centered .UserItem {
    font-size: 15px;
  }

.QuestionInvitation-content--centered .ContentItem-meta {
    font-size: 14px;
  }

.QuestionInvitation-content--centered .ContentItem-extra > .Button {
    width: 80px;
    height: 32px;
    padding: 0;
  }

.Invitees {
  max-height: 383px;
  overflow-y: auto;
}

.Invitees-toggler {
  font-size: 15px;
  color: inherit;
}

.Invitees-togglerUsers {
  font-weight: 400;
  color: #1A1A1A;
}

html[data-theme="dark"] .Invitees-togglerUsers {
  color: #999999;
}

.InviteeItem {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 340px;
  padding: 16px;
  box-sizing: border-box;
}

.InviteeItem:not(:last-child)::after {
    position: absolute;
    bottom: 0;
    display: block;
    width: calc(100% - 32px);
    border-bottom: 1px solid #F6F6F6;
    content: '';
  }

html[data-theme="dark"] .InviteeItem:not(:last-child)::after {
    border-bottom: 1px solid #2E2E2E;
}

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

.InviteeItem-image {
  margin-right: 12px;
}

.InviteeItem-title {
  margin: 0;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
}

html[data-ios] .InviteeItem-title {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .InviteeItem-title {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }
.QuestionStatus-notification-closeButton {
  padding-left: 16px;
}

.QuestionStatus-bar {
  position: relative;
  padding: 16px;
  line-height: 28px;
  color: #8590A6;
  text-align: center;
  background-color: rgba(133, 144, 166, 0.08);
  z-index: 5;
}

.QuestionStatus-bar strong,
  .QuestionStatus-bar em {
    font-style: normal;
    /* 与设计一致，不支持设备将回退为 700 */
    font-weight: 600;
    /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
    font-synthesis: style;
    color: #444444;
  }

html[data-ios] .QuestionStatus-bar strong, html[data-ios] .QuestionStatus-bar em {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .QuestionStatus-bar strong, html[data-android] .QuestionStatus-bar em {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

html[data-theme="dark"] .QuestionStatus-bar strong, html[data-theme="dark"] .QuestionStatus-bar em {
    color: #808080;
}

html[data-theme="dark"] .QuestionStatus-bar {
  color: #606A80;
}

html[data-theme="dark"] .QuestionStatus-bar {
  background-color: rgba(96, 106, 128, 0.08);
}

.QuestionStatus-bar-inner {
  width: 1000px;
  padding: 0 24px;
  margin: 0 auto;
  box-sizing: border-box;
}

.QuestionStatus-bar-inner a {
    color: #0084FF;
  }

html[data-theme="dark"] .QuestionStatus-bar-inner a {
    color: #3A76D0;
}

.QuestionStatus-bar-inner + p {
    line-height: 26px;
    font-size: 14px;
    color: #8590A6;
  }

html[data-theme="dark"] .QuestionStatus-bar-inner + p {
    color: #606A80;
}

.QuestionStatus-bar-commercialMuted {
  line-height: 26px;
  font-size: 14px;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
  color: #444444;
}

html[data-ios] .QuestionStatus-bar-commercialMuted {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .QuestionStatus-bar-commercialMuted {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

.QuestionStatus-bar-commercialMuted a {
    color: #0084FF;
  }

html[data-theme="dark"] .QuestionStatus-bar-commercialMuted a {
    color: #3A76D0;
}

.QuestionStatus-bar-commercialMuted + p {
    line-height: 26px;
    font-size: 14px;
    color: #8590A6;
  }

html[data-theme="dark"] .QuestionStatus-bar-commercialMuted + p {
    color: #606A80;
}

html[data-theme="dark"] .QuestionStatus-bar-commercialMuted {
  color: #808080;
}

.QuestionStatus-notification {
  position: absolute;
  z-index: 99;
}

.QuestionStatus-notification-inner {
  display: flex;
}

.QuestionStatus-notification-content {
  flex: 1;
  overflow: hidden;
  text-align: left;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.QuestionStatus-notification-content a {
    display: inline;
    color: #175199;
  }

.QuestionStatus-notification-content a:hover {
      text-decoration: underline;
    }

html[data-theme="dark"] .QuestionStatus-notification-content a {
    color: #175199;
}

.QuestionStatus-notification-actions {
  margin-left: 32px;
}

.QuestionStatus-notification-divider {
  display: inline-block;
  height: 14px;
  margin: 0 12px;
  vertical-align: middle;
  border-right: 1px solid #EBEBEB;
}

html[data-theme="dark"] .QuestionStatus-notification-divider {
  border-right: 1px solid #444444;
}

.QuestionStatus-notification-primary {
  color: #175199;
}

html[data-theme="dark"] .QuestionStatus-notification-primary {
  color: #175199;
}
.QuestionFollowStatus-counts {
  width: 200px;
  margin-left: auto;
}

  .QuestionFollowStatus-counts .NumberBoard-itemInner {
    padding: 0 8px;
  }

.QuestionFollowStatus-people {
  height: 32px;
  margin-top: 10px;
}

.QuestionFollowStatus-people .UserLink {
    display: inline-block;
    vertical-align: middle;
  }

.QuestionFollowStatus-people .UserLink + .UserLink {
    margin-left: -8px;
  }

.QuestionFollowStatus-people .Avatar {
    display: block;
    border: 1px solid #FFFFFF;
    box-shadow: 0 2px 4px rgba(26, 26, 26, 0.1);
  }

html[data-theme="dark"] .QuestionFollowStatus-people .Avatar {
    border: 1px solid #1A1A1A;
}

html[data-theme="dark"] .QuestionFollowStatus-people .Avatar {
    box-shadow: 0 2px 4px rgba(153, 153, 153, 0.1);
}

.QuestionFollowStatus-people-tip {
  margin-right: 8px;
  font-size: 14px;
  color: #8590A6;
  vertical-align: middle;
}

html[data-theme="dark"] .QuestionFollowStatus-people-tip {
  color: #606A80;
}
.QuestionRedirectionCreator-content {
  height: 160px;
}

.QuestionRedirectionCreator .Popover {
  display: block;
}

.QuestionRedirectionCreator .Input {
  height: 30px;
}

.QuestionRedirectionCreator-menu {
  width: 488px;
}
.QuestionHeaderActions {
  display: flex;
  align-items: center;
}

  .QuestionHeaderActions > .Button:not(:first-child), .QuestionHeaderActions > .Popover:not(:first-child) {
      margin-left: 20px;
    }

  @media (max-width: 690px) {

  .QuestionHeaderActions > .Button:not(:first-child), .QuestionHeaderActions > .Popover:not(:first-child) {
        margin-left: 16px
    }
      }
.CircleDiscussion {
  margin-bottom: 10px;
  box-sizing: border-box;
  background: #FFFFFF;
  display: inline-flex;
  justify-content: space-between;
  align-items: center;
  color: #0084FF;
}

  .CircleDiscussion-text {
    font-size: 14px;
    line-height: 1;
  }

  .CircleDiscussion-icon {
    width: 16px;
    height: 16px;
    margin-right: 4px;
  }

  .CircleDiscussion-icon path:last-of-type {
      fill: #0084FF;
    }

  html[data-theme="dark"] .CircleDiscussion-icon path:last-of-type {
      fill: #3A76D0;
}

  html[data-theme="dark"] .CircleDiscussion {
  background: #1A1A1A;
}

  html[data-theme="dark"] .CircleDiscussion {
  color: #3A76D0;
}
.BrandQuestionSymbol {
  flex-shrink: 0;
  display: flex;
  flex-direction: row;
  align-items: center;
  font-size: 15px;
  color: #8590A6;
}
  html[data-theme="dark"] .BrandQuestionSymbol {
  color: #606A80;
}

.BrandQuestionSymbol-brandLink {
  display: flex;
  align-items: center;
}

.BrandQuestionSymbol-brandLink .UserLink-badge {
    margin-left: 0;
    margin-right: 5px;
  }

.BrandQuestionSymbol-name {
  margin-left: 8px;
  margin-right: 5px;
  color: #175199;
}

html[data-theme="dark"] .BrandQuestionSymbol-name {
  color: #175199;
}

.BrandQuestionSymbol-logo {
  border-radius: 28px;
  width: 28px;
  height: 28px;
}

.BrandQustionSymbol-link {
  text-decoration: underline;
}

.BrandQustionSymbol-link:hover {
    color: #175199;
  }

html[data-theme="dark"] .BrandQustionSymbol-link:hover {
    color: #175199;
}

.BrandQustionSymbol-divider {
  margin-left: 16px;
  margin-right: 17px;
  border-left: 1px solid #EBEBEB;
  height: 24px;
  background: #EBEBEB;
}

html[data-theme="dark"] .BrandQustionSymbol-divider {
  border-left: 1px solid #444444;
}

html[data-theme="dark"] .BrandQustionSymbol-divider {
  background: #444444;
}

.BrandQuestionSymbol.is-mobile .BrandQuestionSymbol-logo {
    border-radius: 22px;
    width: 22px;
    height: 22px;
  }
.BrandQuestionPrizes {
  margin-bottom: 15px;
  width: 645px;
}

  .BrandQuestionPrizes-info {
    border: 1px solid #EBEBEB;
    border-radius: 4px;
    width: 100%;
    overflow: hidden;
  }

  html[data-theme="dark"] .BrandQuestionPrizes-info {
    border: 1px solid #444444;
}

  .BrandQuestionPrizes-bar {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    margin-bottom: -1px;
    border-bottom: 1px solid #EBEBEB;
    padding: 8px;
    width: 100%;
    height: 65px;
    background: #F6F6F6;
    box-sizing: border-box;
    cursor: pointer;
  }

  html[data-theme="dark"] .BrandQuestionPrizes-bar {
    border-bottom: 1px solid #444444;
}

  html[data-theme="dark"] .BrandQuestionPrizes-bar {
    background: #2E2E2E;
}

  .BrandQuestionPrizes-desc {
    margin-left: 4px;
  }

  .BrandQuestionPrizes-symbol {
    display: flex;
    flex-direction: row;
    align-items: center;
    height: 20px;
    font-size: 14px;
    color: #8590A6;
  }

  .BrandQuestionPrizes-symbol svg {
      margin-right: 12px;
    }

  .BrandQuestionPrizes-symbol em {
      margin: 0 4px;
      line-height: 20px;
      font-style: normal;
      color: #FF9607;
    }

  html[data-theme="dark"] .BrandQuestionPrizes-symbol em {
      color: #FF9607;
}

  html[data-theme="dark"] .BrandQuestionPrizes-symbol {
    color: #606A80;
}

  .BrandQuestionPrizes-name {
    margin-top: 5px;
    font-size: 17px;
    font-weight: bold;
    color: #1A1A1A;
  }

  html[data-theme="dark"] .BrandQuestionPrizes-name {
    color: #999999;
}

  .BrandQuestionPrizes-images {
    display: flex;
    flex-direction: row;
    align-items: center;
  }

  .BrandQuestionPrizes-images img {
      border: 1px solid #EBEBEB;
      border-radius: 4px;
      margin-right: 8px;
      width: 46px;
      height: 46px;
    }

  html[data-theme="dark"] .BrandQuestionPrizes-images img {
      border: 1px solid #444444;
}

  .BrandQuestionPrizes-images .Icon {
      margin: 0 4px;
    }

  .BrandQuestionPrizes-detail {
    display: flex;
    flex-direction: column;
    padding: 12px;
  }

  .BrandQuestionPrizes-prize {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    height: 46px;
    line-height: 46px;
    font-size: 15px;
  }

  .BrandQuestionPrizes-prize + .BrandQuestionPrizes-prize {
    margin-top: 12px;
  }

  .BrandQuestionPrizes-intro {
    display: flex;
    flex-direction: row;
  }

  .BrandQuestionPrizes-prizeInfo {
    display: flex;
  }

  .BrandQuestionPrizes-prizeImage {
    border: 1px solid #EBEBEB;
    border-radius: 4px;
    margin-right: 12px;
    width: 46px;
    height: 46px;
  }

  html[data-theme="dark"] .BrandQuestionPrizes-prizeImage {
    border: 1px solid #444444;
}

  .BrandQuestionPrizes-prizeName {
    font-weight: bold;
    color: #444444;
  }

  html[data-theme="dark"] .BrandQuestionPrizes-prizeName {
    color: #808080;
}

  .BrandQuestionPrizes-prizeValue {
    margin-left: 8px;
    color: #8590A6;
  }

  html[data-theme="dark"] .BrandQuestionPrizes-prizeValue {
    color: #606A80;
}

  .BrandQuestionPrizes-prizeQuantity {
    font-weight: bold;
  }

  .BrandQuestionPrizes-tips {
    display: flex;
    flex-direction: column;
    margin-top: 11px;
    line-height: 27px;
    font-size: 15px;
    color: #444444;
  }

  .BrandQuestionPrizes-tips a {
      color: #0084FF;
    }

  .BrandQuestionPrizes-tips a.BrandQuestionPrizes-ruleLink {
        color: #175199;
      }

  html[data-theme="dark"] .BrandQuestionPrizes-tips a.BrandQuestionPrizes-ruleLink {
        color: #175199;
}

  html[data-theme="dark"] .BrandQuestionPrizes-tips a {
      color: #3A76D0;
}

  html[data-theme="dark"] .BrandQuestionPrizes-tips {
    color: #808080;
}

  .BrandQuestionPrizes-tipTitle {
    flex-shrink: 0;
    width: 75px;
    font-weight: bold;
  }

  .BrandQuestionPrizes-tip {
    display: flex;
    flex-direction: row;
  }

  .BrandQuestionPrizes-rule {
    margin-top: 3px;
    font-size: 14px;
    color: #8590A6;
  }

  html[data-theme="dark"] .BrandQuestionPrizes-rule {
    color: #606A80;
}

  .BrandQuestionPrizes-split {
    margin: 30px auto;
    border: none;
    width: 240px;
    height: 1px;
    background: #D3D3D3;
  }

  html[data-theme="dark"] .BrandQuestionPrizes-split {
    background: #2E2E2E;
}

  .BrandQuestionPrizes-edit {
    margin-top: 4px;
    margin-bottom: -15px;
    border: none;
    padding: 0;
    color: #0084FF;
  }

  html[data-theme="dark"] .BrandQuestionPrizes-edit {
    color: #3A76D0;
}

  .BrandQuestionPrizes.is-mobile {
    width: 100%;
  }

  .BrandQuestionPrizes.is-mobile .BrandQuestionPrizes-symbol svg {
    margin-right: 6px;
  }

  .BrandQuestionPrizes.is-mobile .BrandQuestionPrizes-desc {
    flex-grow: 1;
  }

  .BrandQuestionPrizes.is-mobile .BrandQuestionPrizes-name {
    max-width: calc(100vw - 121px);
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
  }

  .BrandQuestionPrizes.is-mobile .BrandQuestionPrizes-images {
    margin-left: 4px;
    margin-right: 0;
  }

  .BrandQuestionPrizes.is-mobile .BrandQuestionPrizes-images .Icon {
      margin: 0;
    }

  .BrandQuestionPrizes.is-mobile .BrandQuestionPrizes-intro {
    flex-grow: 1;
  }

  .BrandQuestionPrizes.is-mobile .BrandQuestionPrizes-prizeInfo {
    flex-grow: 1;
    flex-direction: column;
    line-height: 23px;
  }

  .BrandQuestionPrizes.is-mobile .BrandQuestionPrizes-prizeInfo .BrandQuestionPrizes-prizeValue {
      margin-left: 0;
      font-size: 14px;
    }

  .BrandQuestionPrizes.is-mobile .BrandQuestionPrizes-prizeInfo .BrandQuestionPrizes-prizeName {
      max-width: calc(100vw - 150px);
      width: 100%;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

  .BrandQuestionPrizes.is-mobile .BrandQuestionPrizes-prizeInfo .BrandQuestionPrizes-prizeQuantity {
      flex-shrink: 0;
    }

  .BrandQuestionPrizes.is-mobile .BrandQuestionPrizes-tips {
    display: flex;
    flex-direction: column;
    margin-top: 0;
    border-top: 1px solid #EBEBEB;
    padding-top: 2px;
    padding-bottom: 10px;
    line-height: 25px;
  }

  html[data-theme="dark"] .BrandQuestionPrizes.is-mobile .BrandQuestionPrizes-tips {
    border-top: 1px solid #444444;
}

  .BrandQuestionPrizes.is-mobile .BrandQuestionPrizes-tip {
    display: flex;
    flex-direction: column;
    word-wrap: break-word;
    border-bottom: 1px solid #EBEBEB;
    padding: 0 10px;
    padding-bottom: 10px;
  }

  html[data-theme="dark"] .BrandQuestionPrizes.is-mobile .BrandQuestionPrizes-tip {
    border-bottom: 1px solid #444444;
}

  .BrandQuestionPrizes.is-mobile .BrandQuestionPrizes-tipTitle {
    margin-top: 8px;
    font-size: 16px;
    font-weight: bold;
  }

  .BrandQuestionPrizes.is-mobile .BrandQuestionPrizes-rule {
    margin-top: 10px;
    padding: 0 10px;
    line-height: 22px;
  }
.BrandQuestionSettingMenu-item {
  height: 40px;
}
.QuestionRelatedCard {
  padding: 16px 16px 0 16px;
  background: #F6F6F6;
  border-radius: 6px;
  margin: 12px 0 16px;
}
  html[data-theme="dark"] .QuestionRelatedCard {
  background: #2E2E2E;
}

.QuestionRelatedCard-title {
  border-left: 3px solid #0084ff;
  line-height: 16px;
  margin-bottom: 8px;
  padding-left: 8px;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
}

html[data-ios] .QuestionRelatedCard-title {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .QuestionRelatedCard-title {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

.QuestionRelatedCard-content {
  color: #444444;
}

.QuestionRelatedCard-content > a {
    color: #999;
    margin-left: 4px;
  }

.QuestionRelatedCard-content .hash_tag {
    color: #444444;
  }

html[data-theme="dark"] .QuestionRelatedCard-content .hash_tag {
    color: #808080;
}

html[data-theme="dark"] .QuestionRelatedCard-content {
  color: #808080;
}

.QuestionRelatedCard-footer {
  border-top: 1px solid #D3D3D3;
  display: flex;
  justify-content: space-between;
  line-height: 38px;
  margin-top: 12px;
}

html[data-theme="dark"] .QuestionRelatedCard-footer {
  border-top: 1px solid #2E2E2E;
}

.QuestionRelatedCard-from {
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
}

html[data-ios] .QuestionRelatedCard-from {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .QuestionRelatedCard-from {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

.QuestionRelatedCard-follow {
  padding: 0;
  border: none;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
  background: transparent !important;
  text-align: right;
}

html[data-ios] .QuestionRelatedCard-follow {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .QuestionRelatedCard-follow {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

.QuestionRelatedCard-follow svg {
    margin-right: 2px;
  }

.QuestionRelatedCard-follow.Button--grey {
  color: #999999;
}

html[data-theme="dark"] .QuestionRelatedCard-follow.Button--grey {
  color: #646464;
}
.OrgQuestionSymbol {
  height: 60px;
  margin-top: 16px;
  margin-bottom: -16px;
  border-top: 1px solid rgba(23, 81, 153, 0.05);
}
  html[data-theme="dark"] .OrgQuestionSymbol {
  border-top: 1px solid rgba(23, 81, 153, 0.05);
}

.OrgQuestionSymbol-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 1000px;
  height: 100%;
  padding: 0 16px;
  margin: 0 auto;
}

.OrgQuestionSymbol-inner--mobile {
  padding: 0;
}

.OrgQuestionSymbol-main {
  display: flex;
  align-items: center;
  height: 100%;
  font-size: 14px;
  color: #8590A6;
}

html[data-theme="dark"] .OrgQuestionSymbol-main {
  color: #606A80;
}

.OrgQuestionSymbol-avatar {
  margin-right: 12px;
}

.OrgQuestionSymbol-avatar .UserLink,
  .OrgQuestionSymbol-avatar .Popover,
  .OrgQuestionSymbol-avatar .Avatar {
    display: block;
  }

.OrgQuestionSymbol-name {
  flex: 1;
}

.OrgQuestionSymbol-name .UserLink {
    /* 与设计一致，不支持设备将回退为 700 */
    font-weight: 600;
    /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
    font-synthesis: style;
    color: #1A1A1A;
  }

html[data-ios] .OrgQuestionSymbol-name .UserLink {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .OrgQuestionSymbol-name .UserLink {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

html[data-theme="dark"] .OrgQuestionSymbol-name .UserLink {
    color: #999999;
}
.QuestionHeader {
  position: relative;
  min-width: calc(1000px + 16px * 2);
  padding: 16px 0;
  overflow: hidden;
  background: #FFFFFF;
  box-shadow: 0 1px 3px rgba(26, 26, 26, 0.1);
}
  html[data-theme='dark'] .QuestionHeader {
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
  }
  html[data-theme="dark"] .QuestionHeader {
  background: #1A1A1A;
}

.QuestionHeader-content {
  display: flex;
  justify-content: space-between;
  width: 1000px;
  height: 100%;
  padding: 0 16px;
  margin: 0 auto;
}

.PageHeader .QuestionHeader-content {
  align-items: center;
}

.QuestionHeader-main {
  width: 694px;
  padding-left: 20px;
  box-sizing: border-box;
}

.QuestionHeader-side {
  width: 296px;
  padding-right: 20px;
  text-align: right;
}

.QuestionHeader-tags {
  display: flex;
}

.QuestionHeader-specialQuestionAuthor {
  height: 28px;
}

.QuestionHeader-topicDivider {
  margin: 0 16px;
  height: 24px;
  border-left: 1px solid #EBEBEB;
}

html[data-theme="dark"] .QuestionHeader-topicDivider {
  border-left: 1px solid #444444;
}

.QuestionHeader-topics {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  margin-right: -5px;
  padding: 1px 0;
}

.QuestionHeader-topics .QuestionTopic {
    margin: 3px 5px 3px 0;
    vertical-align: middle;
  }

.QuestionHeader-topics .Button {
    margin-left: 12px;
    vertical-align: middle;
  }

.QuestionHeader-title {
  margin-top: 12px;
  margin-bottom: 4px;
  font-size: 22px;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
  line-height: 32px;
  color: #1A1A1A;
}

html[data-ios] .QuestionHeader-title {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .QuestionHeader-title {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

.QuestionHeader-title .Button {
    margin-left: 12px;
    vertical-align: middle;
  }

html[data-theme="dark"] .QuestionHeader-title {
  color: #999999;
}

.PageHeader .QuestionHeader-title {
  margin: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  cursor: pointer;
}

.BrandQuestionPrizes {
  margin-top: 12px;
}

.QuestionHeader-lock {
  vertical-align: middle;
}

.QuestionHeader-detail {
  min-height: 10px;
}

.QuestionHeader-footer {
  padding-bottom: 12px;
  margin-top: 4px;
  margin-bottom: -12px;
  background: #FFFFFF;
}

.QuestionHeader-footer.is-fixed {
    z-index: 3;
    height: 60px;
    padding-bottom: 0;
    margin-top: 0;
    margin-bottom: 0;
    border-top: 1px solid #EBEBEB;
    box-shadow: 0 -1px 3px rgba(23, 81, 153, 0.05);
  }

html[data-theme="dark"] .QuestionHeader-footer.is-fixed {
    border-top: 1px solid #444444;
}

html[data-theme="dark"] .QuestionHeader-footer.is-fixed {
    box-shadow: 0 -1px 3px rgba(23, 81, 153, 0.05);
}

html[data-theme="dark"] .QuestionHeader-footer {
  background: #1A1A1A;
}

.QuestionHeader-footer-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 1000px;
  height: 100%;
  padding: 0 16px;
  margin: 0 auto;
}

.QuestionHeader-footer-main {
  display: flex;
  align-items: center;
  margin-top: 4px;
  min-width: 694px;
  width: auto;
}

.QuestionButtonGroup + .QuestionHeaderActions {
  margin-left: 16px;
}

.QuestionButtonGroup + .BrandQuestionSettingMenu {
  margin: 0 16px;
}

.QuestionHeader-actions {
  display: flex;
  margin-left: 16px;
}

.QuestionHeader-collapse-icon {
  margin-left: 8px;
  -webkit-transform: rotate(180deg);
          transform: rotate(180deg);
}

.QuestionHeader-menu-item--commercial {
  position: relative;
  padding-left: 44px;
  width: 148px;
}

.QuestionHeader-menu-item--commercial .MenuItem-icon {
    margin-left: -18px;
  }

.QuestionHeader-menu {
  font-size: 14px;
}

.QuestionHeader-menu-item {
  line-height: 40px;
}

.QuestionHeader-delete-confirm {
  text-align: center;
}

.PageHeader .QuestionHeader-content--withInvite .QuestionHeader-main {
    width: 694px;
    min-width: 694px;
    padding: 0 20px;
  }

.PageHeader .QuestionHeader-content--withInvite .QuestionHeader-side {
    padding-right: 0;
  }
.QuestionPage {
  position: relative;
}

.QuestionPage-commercialIsMutedCover {
  position: absolute;
  width: 100%;
  height: 100%;
  background: rgba(255, 255, 255, 0.8);
  z-index: 3;
}

html[data-theme="dark"] .QuestionPage-commercialIsMutedCover {
  background: rgba(26, 26, 26, 0.8);
}

.Question-main {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin: 10px auto;
  padding: 0 16px;
  width: 1000px;
  min-height: 100vh;
}

.Question-mainColumn {
  width: 694px;
  padding-bottom: 20px;
}

.Question-sideColumn {
  width: 296px;
}

.Question-sideColumn--sticky .Card:last-of-type {
    margin-bottom: 0;
  }
.Pc-word {
  box-sizing: border-box;
  width: 694px;
  padding: 14px 20px 16px;
  border: 1px solid #f0f2f7;
  background: #fff;
  font-size: 15px;
}
.Pc-word-card {
  position: relative;
}
.Pc-word-card-brand {
  margin-bottom: 11px;
}
.Pc-word-card-brand-wrapper {
  display: flex;
}
.Pc-word-card-brand-wrapper > img {
  width: 20px;
  height: 20px;
  border-radius: 1px;
  background: #fff;
}
.Pc-word-card-brand-wrapper > span {
  margin-left: 14px;
  color: #444;
  font-size: 16px;
}
.Pc-word-card-sign-label {
  position: absolute;
  top: 0;
  right: 0;
  display: flex;
  align-items: center;
  padding: 3px 6px;
  border-radius: 3px;
  color: #8590a6;
  background: #f6f6f6;
  font-size: 13px;
  cursor: pointer;
}
.Pc-word-card-sign-label > svg {
  width: 24px;
  height: 24px;
  -webkit-transform: rotateZ(90deg);
          transform: rotateZ(90deg);
  fill: #8590a6;
}
.Pc-word-card-sign-popup {
  position: fixed;
  border: 1px solid #ebebeb;
  border-radius: 4px;
  background: #fff;
  box-shadow: 0 5px 20px rgba(26, 26, 26, .1);
  opacity: 0;
  z-index: 999;
}
.Pc-word-card-sign-popup-arrow {
  position: absolute;
  left: 60px;
  width: 32px;
  height: 16px;
  overflow: hidden;
  -webkit-transform: translate(-50%, -100%);
          transform: translate(-50%, -100%);
}
.Pc-word-card-sign-popup-arrow::after {
  position: absolute;
  bottom: -8px;
  left: 50%;
  box-sizing: border-box;
  width: 24px;
  height: 24px;
  border: 1px solid #ebebeb;
  margin: -12px;
  background: #fff;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  content: "";
}
.Pc-word-card-sign-popup-menu {
  padding: 6px 0;
}
.Pc-word-card-sign-popup-menu > button,
          .Pc-word-card-sign-popup-menu a {
  display: block;
  box-sizing: border-box;
  width: 100%;
  padding: 0 20px;
  border: none;
  border-radius: 0;
  color: #8590a6;
  background-color: transparent;
  font-size: 14px;
  line-height: 36px;
  text-align: left;
  cursor: pointer;
}
.Pc-word-card-sign-popup--isShowed {
  opacity: 1;
  transition: opacity 0s;
}
.Pc-word-card-sign-popup--isHidden {
  opacity: 0;
  transition: opacity .5s;
}
.Pc-word-card-title {
  margin: 0;
  color: #1e1e1e;
  font-weight: 600;
  font-size: 18px;
  font-synthesis: style;
}
.Pc-word-card-content {
  margin-top: 12px;
  color: #262626;
  line-height: 1.67;
  word-break: break-all;
}
.Pc-word-card-content-cta {
  padding: 0 3px;
  color: #1d5194;
  font-size: 14px;
}
.QuestionAnswers-content {
  margin-bottom: 14px;
}

.QuestionAnswers-answerTipCard {
  margin-bottom: 10px;
  padding: 16px 24px;
  font-size: 15px;
  color: #8590A6;
  text-align: center;
}

.QuestionAnswers-answerTipCard.Card {
    margin-bottom: 10px;
  }

.QuestionAnswers-answerTipCard a {
    font-size: inherit;
    cursor: pointer;
    color: #175199;
  }

.QuestionAnswers-answerTipCard a:hover {
    border-bottom: 1px solid #175199;
  }

html[data-theme="dark"] .QuestionAnswers-answerTipCard a:hover {
    border-bottom: 1px solid #175199;
}

html[data-theme="dark"] .QuestionAnswers-answerTipCard a {
    color: #175199;
}

html[data-theme="dark"] .QuestionAnswers-answerTipCard {
  color: #606A80;
}

.QuestionAnswers-answerList {
  margin-bottom: 10px;
}

.QuestionAnswers-answerTip {
  margin: 40px 0;
  font-size: 14px;
  color: #8590A6;
  text-align: center;
}

.QuestionAnswers-answerTip.Card {
    margin-bottom: 10px;
  }

.QuestionAnswers-answerTip .Button {
    color: #175199;
  }

.QuestionAnswers-answerTip .Button:hover {
    border-bottom: 1px solid #175199;
  }

html[data-theme="dark"] .QuestionAnswers-answerTip .Button:hover {
    border-bottom: 1px solid #175199;
}

html[data-theme="dark"] .QuestionAnswers-answerTip .Button {
    color: #175199;
}

.QuestionAnswers-answerTip .QuestionAnswers-iconLink:hover {
      border-bottom: none;
    }

html[data-theme="dark"] .QuestionAnswers-answerTip {
  color: #606A80;
}

.QuestionAnswers-answerAdd {
  min-height: 282px;
}

.QuestionAnswers-answerAdd.Card {
    margin-bottom: 10px;
  }

.QuestionAnswers-statusWrapper .expand-enter {
    top: 36px;
    z-index: -1;
    transition: opacity 300ms ease-out, top 300ms ease-out;
  }

.QuestionAnswers-statusWrapper .expand-enter-active {
    top: 0;
  }

.QuestionAnswers-statusWrapper .expand-leave {
    position: relative;
    top: 0;
    z-index: -1;
    transition: opacity 300ms ease-out, top 300ms ease-out;
  }

.QuestionAnswers-statusWrapper .expand-leave-active {
    top: 36px;
  }

.QuestionAnswers-answers {
  margin-bottom: 10px;
}

.Answers-none {
  padding: 50px 0;
}

.QuestionAnswers-navs {
  display: flex;
  flex-direction: row;
  align-items: center;
}

.QuestionAnswers-nav {
  display: inline-block;
  height: 50px;
  line-height: 50px;
}

.QuestionAnswers-nav:hover {
    cursor: pointer;
  }

.QuestionAnswers-nav.is--active {
    border-bottom: 3px solid #0084FF;
  }

html[data-theme="dark"] .QuestionAnswers-nav.is--active {
    border-bottom: 3px solid #3A76D0;
}

.QuestionAnswers-nav + .QuestionAnswers-nav {
    margin-left: 33px;
  }

.MoreAnswersCard {
  position: relative;
  margin-top: -10px;
  border-top: none;
  box-shadow: 0 3px 3px -3px rgba(26, 26, 26, 0.2);
}

.MoreAnswersCard::before {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    border-top: 1px solid #F6F6F6;
    margin: 0 16px;
  }

html[data-theme="dark"] .MoreAnswersCard::before {
    border-top: 1px solid #2E2E2E;
}

.MoreAnswersCard .QuestionMainAction {
    color: #175199;
  }

html[data-theme="dark"] .MoreAnswersCard .QuestionMainAction {
    color: #175199;
}

html[data-theme="dark"] .MoreAnswersCard {
  box-shadow: 0 3px 3px -3px rgba(153, 153, 153, 0.2);
}

.QuestionAnswers-answerButton {
  border-color: transparent;
  line-height: 48px;
  font-size: 15px;
}

.QuestionAnswers-answerLink {
  color: #175199;
}

html[data-theme="dark"] .QuestionAnswers-answerLink {
  color: #175199;
}
.CheckItem {
  position: relative;
  display: block;
}

.CheckItem-box {
  position: relative;
  padding: 12px;
  border: 1px solid #F6F6F6;
  border-radius: 3px;
  transition: border-color 200ms ease-out;
}

html[data-theme="dark"] .CheckItem-box {
  border: 1px solid #2E2E2E;
}

.CheckItem-input {
  position: absolute;
  z-index: -1;
  opacity: 1;
}

.CheckItem-icon {
  position: absolute;
  top: 50%;
  right: 12px;
  fill: #0084FF;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}

html[data-theme="dark"] .CheckItem-icon {
  fill: #3A76D0;
}

.CheckItem:hover .CheckItem-box {
    border-color: #175199;
  }

html[data-theme="dark"] .CheckItem:hover .CheckItem-box {
    border-color: #175199;
}

.CheckItem-input:checked + .CheckItem-box {
      border-color: #175199;
    }

.CheckItem-input:checked + .CheckItem-box .CheckItem-inner {
        max-width: calc(100% - 28px);
      }

html[data-theme="dark"] .CheckItem-input:checked + .CheckItem-box {
      border-color: #175199;
}

.CheckItem-input:not(:checked) + .CheckItem-box .CheckItem-icon {
        opacity: 0;
        transition: opacity 200ms;
      }
.TopicBios-loading {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 400px;
}

.TopicBioItem:not(:first-child) {
    margin-top: 16px;
  }

.TopicBioItem .AuthorInfo {
    color: #646464;
  }

html[data-theme="dark"] .TopicBioItem .AuthorInfo {
    color: #999999;
}

.TopicBioItem-title {
  margin-bottom: 8px;
  color: #8590A6;
}

html[data-theme="dark"] .TopicBioItem-title {
  color: #606A80;
}

.TopicBioItem-inner {
  padding: 12px;
  margin-bottom: 8px;
  border: 1px solid #175199;
  border-radius: 3px;
}

html[data-theme="dark"] .TopicBioItem-inner {
  border: 1px solid #175199;
}

.TopicBioItem-modifyButton {
  margin-left: 6px;
  font-size: 14px;
  color: #8590A6;
}

.TopicBioItem-modifyButton:hover {
    color: #175199;
  }

html[data-theme="dark"] .TopicBioItem-modifyButton:hover {
    color: #175199;
}

html[data-theme="dark"] .TopicBioItem-modifyButton {
  color: #606A80;
}

.TopicBioItem-input {
  width: 100%;
  height: auto;
  padding: 0;
  font-size: 14px;
}

.TopicBioItem-input,
  .TopicBioItem-input.is-focus {
    border: none;
  }

.TopicBioItem-input .Input {
    height: auto;
    color: #646464;
  }

html[data-theme="dark"] .TopicBioItem-input .Input {
    color: #999999;
}

.TopicBioItem-inputFooter {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.TopicBioItem-actions {
  text-align: right;
}

.TopicBioItem-actions .Button:not(:first-child) {
    margin-left: 25px;
  }

.TopicBioItem-addButton {
  height: 48px;
  padding: 0 12px;
  text-align: left;
  border: 1px solid #EBEBEB;
}

.TopicBioItem-addButton:hover {
    border-color: #175199;
  }

html[data-theme="dark"] .TopicBioItem-addButton:hover {
    border-color: #175199;
}

.TopicBioItem-addButton .Icon {
    fill: currentColor;
  }

html[data-theme="dark"] .TopicBioItem-addButton {
  border: 1px solid #444444;
}
.AnswerAdd-header {
  display: flex;
  padding: 16px 20px;
}

.AnswerAdd-info {
  overflow: hidden;
}

.AnswerAdd-toggleAnonymous {
  margin-left: auto;
  padding-left: 12px;
  flex-shrink: 0;
}

.AnswerAdd-toggleAnonymous:hover {
    color: #808080;
  }

html[data-theme="dark"] .AnswerAdd-toggleAnonymous:hover {
    color: #808080;
}

.AnswerAdd-topicBiosButton {
  font-size: 14px;
  color: #8590A6;
  white-space: nowrap;
}

.AnswerAdd-topicBiosButton:hover {
    color: #175199;
  }

html[data-theme="dark"] .AnswerAdd-topicBiosButton:hover {
    color: #175199;
}

html[data-theme="dark"] .AnswerAdd-topicBiosButton {
  color: #606A80;
}

.AnswerAdd-bio {
  margin-right: 6px;
  color: #646464;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

html[data-theme="dark"] .AnswerAdd-bio {
  color: #999999;
}
.QuestionMainDivider {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 60px;
  margin: 0 20px;
  color: #8590A6;
  text-align: center;
}

  .QuestionMainDivider::before {
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    margin: 0 20px;
    display: block;
    border-top: 1px solid #EBEBEB;
    content: '';
  }

  html[data-theme="dark"] .QuestionMainDivider::before {
    border-top: 1px solid #444444;
}

  .QuestionMainDivider a {
    color: #175199;
  }

  .QuestionMainDivider a:hover {
    border-bottom: 1px solid #175199;
  }

  html[data-theme="dark"] .QuestionMainDivider a:hover {
    border-bottom: 1px solid #175199;
}

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

  html[data-theme="dark"] .QuestionMainDivider {
  color: #606A80;
}

.QuestionMainDivider-inner {
  position: relative;
  padding: 0 1em;
  background: #FFFFFF;
}

html[data-theme="dark"] .QuestionMainDivider-inner {
  background: #1A1A1A;
}
.CollapsedAnswers-bar {
  display: block;
  width: 100%;
  height: 44px;
  font-size: 14px;
  line-height: 44px;
  color: #646464;
  text-align: left;
  border-top: 1px solid #EBEBEB;
  border-bottom: 1px solid #EBEBEB;
}

  .CollapsedAnswers-bar:not(:last-child) {
    margin-bottom: 14px;
  }

  .CollapsedAnswers-bar .Button {
    color: inherit;
  }

  .CollapsedAnswers-bar .Button:hover {
      color: #175199;
    }

  html[data-theme="dark"] .CollapsedAnswers-bar .Button:hover {
      color: #175199;
}

  html[data-theme="dark"] .CollapsedAnswers-bar {
  color: #999999;
}

  html[data-theme="dark"] .CollapsedAnswers-bar {
  border-top: 1px solid #444444;
}

  html[data-theme="dark"] .CollapsedAnswers-bar {
  border-bottom: 1px solid #444444;
}
.Banner {
  position: relative;
  overflow: hidden;
  transition: height 300ms, margin 300ms, opacity 300ms;
}

  .Banner--hidden {
    margin-bottom: 0;
    opacity: 0;
  }

.Banner-link {
  display: block;
}

.Banner-image {
  display: block;
  width: 100%;
}

.Banner-adsense {
  display: block;
  width: 100%;
  height: 250px;
}

.Banner-close {
  position: absolute;
  top: 12px;
  right: 12px;
  width: 18px;
  height: 18px;
  background-color: #1A1A1A;
  border-radius: 50%;
  transition: opacity 300ms;
}

.Banner-close:hover {
    background-color: #1A1A1A;
  }

html[data-theme="dark"] .Banner-close:hover {
    background-color: #999999;
}

.Banner-close .Icon {
    display: block;
    margin: 0 auto;
    fill: #FFFFFF;
  }

html[data-theme="dark"] .Banner-close .Icon {
    fill: #1A1A1A;
}

html[data-theme="dark"] .Banner-close {
  background-color: #999999;
}

.Banner:not(:hover) .Banner-close {
  opacity: 0;
}
.AppBanner-link {
  display: block;
}

.AppBanner-layout {
  display: flex;
  align-items: center;
  padding: 12px;
}

.AppBanner-qrcode {
  width: 50px;
  height: 50px;
  margin-right: 12px;
}

.AppBanner-qrcode svg {
    display: block;
    width: 100%;
    height: 100%;
  }

.AppBanner-content {
  flex: 1;
}

.AppBanner-title {
  font-size: 16px;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
  line-height: 20px;
  color: #444444;
}

html[data-ios] .AppBanner-title {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .AppBanner-title {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

html[data-theme="dark"] .AppBanner-title {
  color: #808080;
}

.AppBanner-description {
  margin-top: 2px;
  font-size: 14px;
  line-height: 20px;
  color: #444444;
}

html[data-theme="dark"] .AppBanner-description {
  color: #808080;
}

.AppBanner-sticky {
  height: 0;
  opacity: 1;
  visibility: visible;
  transition: opacity 0.3s, visibility 0.3s;
}

.AppBanner-sticky:not(.is-shown) {
    opacity: 0;
    visibility: hidden;
  }
.Recommendations-item {
  font-size: 14px;
  line-height: 24px;
  color: #8590A6;
}

  .Recommendations-item + .Recommendations-item {
    margin-top: 12px;
  }

  .Recommendations-item .Button {
    display: inline;
    color: #175199;
  }

  .Recommendations-item .Button:hover {
    border-bottom: 1px solid #175199;
  }

  html[data-theme="dark"] .Recommendations-item .Button:hover {
    border-bottom: 1px solid #175199;
}

  html[data-theme="dark"] .Recommendations-item .Button {
    color: #175199;
}

  html[data-theme="dark"] .Recommendations-item {
  color: #606A80;
}
.SimilarQuestions-item {
  font-size: 14px;
  line-height: 21px;
  color: #8590A6;
}

  .SimilarQuestions-item + .SimilarQuestions-item {
    margin-top: 10px;
  }

  .SimilarQuestions-item .Button {
    display: inline;
    color: #175199;
  }

  .SimilarQuestions-item .Button:hover {
    border-bottom: 1px solid #175199;
  }

  html[data-theme="dark"] .SimilarQuestions-item .Button:hover {
    border-bottom: 1px solid #175199;
}

  html[data-theme="dark"] .SimilarQuestions-item .Button {
    color: #175199;
}

  html[data-theme="dark"] .SimilarQuestions-item {
  color: #606A80;
}
.RelatedCommodities-image {
  width: 80px;
  height: 64px;
  border-radius: 3px;
  margin-right: 8px;
  -o-object-fit: cover;
     object-fit: cover;
}

.RelatedCommodities-subject {
  color: #1A1A1A;
  font-size: 14px;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

html[data-ios] .RelatedCommodities-subject {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .RelatedCommodities-subject {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

html[data-theme="dark"] .RelatedCommodities-subject {
  color: #999999;
}

.RelatedCommodities-subject-two {
  max-height: 40px;
  display: -webkit-box;
  text-overflow: ellipsis;
  overflow: hidden;
  -webkit-line-clamp: 2;
  /* autoprefixer: ignore next */
  -webkit-box-orient: vertical;
}

.RelatedCommodities-scoreWrapper {
  display: flex;
}

.RelatedCommodities-item {
  display: flex;
  align-items: center;
}

.RelatedCommodities-item:hover .RelatedCommodities-subject {
    color: #175199;
  }

html[data-theme="dark"] .RelatedCommodities-item:hover .RelatedCommodities-subject {
    color: #175199;
}

.RelatedCommodities-item:not(:first-child) {
    position: relative;
    margin-top: 10px;
    padding-top: 10px;
  }

.RelatedCommodities-item:not(:first-child)::before {
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      display: block;
      content: '';

      border-top: 0.5px solid #D3D3D3;
    }

html[data-hairline] .RelatedCommodities-item:not(:first-child)::before {
    border-top: 1px solid #D3D3D3;
    -o-border-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='1' height='1'> <rect x='0' y='0' width='1' height='.5' fill='#d3d3d3'/> </svg>")
      1 0 0 0;
       border-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='1' height='1'> <rect x='0' y='0' width='1' height='.5' fill='#d3d3d3'/> </svg>")
      1 0 0 0;
  }

html[data-theme="dark"] html[data-hairline] .RelatedCommodities-item:not(:first-child)::before {
    border-top: 1px solid #2E2E2E;
}

html[data-theme="dark"] .RelatedCommodities-item:not(:first-child)::before {

      border-top: 0.5px solid #2E2E2E;
}

.RelatedCommodities-content {
  flex: 1;
  display: flex;
  flex-direction: column;
  text-align: left;
  overflow: hidden;
}

.RelatedCommodities-description {
  color: #646464;
  margin-top: 6px;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

html[data-theme="dark"] .RelatedCommodities-description {
  color: #999999;
}

.RelatedCommodities-meta {
  display: flex;
  color: #8590A6;
  margin-top: 4px;
}

.RelatedCommodities-meta .Rating {
    display: inline-block;
    margin-right: 4px;
  }

html[data-theme="dark"] .RelatedCommodities-meta {
  color: #606A80;
}

/* 配色不在色组里 */
.RelatedCommodities-remixListen {
  position: relative;
  background: #fd3;
  color: #b37700;
  padding: 3px 6px 3px 18px;
  line-height: 1;
  border-color: #fd3;
  border-radius: 3px;
}
.RelatedCommodities-remixListen:hover {
    background: #fd3;
  }
.RelatedCommodities-remixListen::before {
    position: absolute;
    left: 6px;
    top: 6px;
    display: block;
    border-width: 4px 8px;
    border-style: solid;
    border-color: transparent;
    border-left-color: #b37700;
    content: '';
  }

.RelatedCommodities-remixMeta,
.RelatedCommodities-bookMeta {
  display: flex;
  width: 100%;
  justify-content: space-between;
}

.RelatedCommodities-bookRead {
  padding: 3px 6px 3px 3px;
  border-radius: 3px;
  line-height: 1;
  color: #FFFFFF;
  background: #0084FF;
}

.RelatedCommodities-bookRead .Zi {
    margin-right: 2px;
  }

html[data-theme="dark"] .RelatedCommodities-bookRead {
  color: #1A1A1A;
}

html[data-theme="dark"] .RelatedCommodities-bookRead {
  background: #3A76D0;
}
.BrandQuestionDesc-header .Card-headerOptions {
  flex-shrink: 0;
}

.BrandQuestionDesc-header,
.BrandQuestionDesc-content {
  padding-left: 12px;
  padding-right: 12px;
}

.BrandQuestionDesc-content {
  font-size: 14px;
  line-height: 24px;
}

.BrandQuestionDesc-learnMore {
  font-size: 14px;
  color: #8590A6;
}

html[data-theme="dark"] .BrandQuestionDesc-learnMore {
  color: #606A80;
}
.Carousel {
  position: relative;
  width: 100%;
  overflow: hidden;
}

.Carousel-scroller,
.Carousel-window {
  width: 100%;
  height: 100%;
}

.Carousel-window {
  display: flex;
  flex-direction: row;
  white-space: nowrap;

  @nest .is-vertical & {
    white-space: normal;
  }
}

.Carousel-window.is-vertical {
    flex-direction: column;
  }

.Carousel-bullets {
  position: absolute;
  z-index: 2;
  left: 50%;
  bottom: 4px;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
}

.Carousel-bullet {
  margin: 0 4px;
  display: inline-block;
  width: 7px;
  height: 7px;
  opacity: 0.4;
  cursor: pointer;
  border-radius: 50%;
  background: #FFFFFF;
  box-shadow: 0 0 8px 0 rgba(26, 26, 26, 0.2);
}

.Carousel-bullet.is-active {
    opacity: 1;
    cursor: default;
  }

html[data-theme="dark"] .Carousel-bullet {
  background: #1A1A1A;
}

html[data-theme="dark"] .Carousel-bullet {
  box-shadow: 0 0 8px 0 rgba(153, 153, 153, 0.2);
}

.Carousel-leftArrow,
.Carousel-rightArrow {
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  width: 28px;
  height: 28px;
  box-sizing: border-box;
  background: rgba(255, 255, 255, 0.5);
  border-radius: 50%;
  transition: background 0.1s ease-in-out;
}

.Carousel-leftArrow:hover, .Carousel-rightArrow:hover {
    background: rgba(255, 255, 255, 0.9);
  }

html[data-theme="dark"] .Carousel-leftArrow:hover, html[data-theme="dark"] .Carousel-rightArrow:hover {
    background: rgba(26, 26, 26, 0.9);
}

.Carousel-leftArrow .Icon--arrow, .Carousel-rightArrow .Icon--arrow {
    width: 6px;
    fill: #444444;
  }

html[data-theme="dark"] .Carousel-leftArrow .Icon--arrow, html[data-theme="dark"] .Carousel-rightArrow .Icon--arrow {
    fill: #808080;
}

html[data-theme="dark"] .Carousel-leftArrow, html[data-theme="dark"] .Carousel-rightArrow {
  background: rgba(26, 26, 26, 0.5);
}

.Carousel-leftArrow {
  left: 16px;
}

.Carousel-leftArrow .Icon--arrow {
    -webkit-transform: rotateZ(90deg);
            transform: rotateZ(90deg);
  }

.Carousel-rightArrow {
  right: 16px;
}

.Carousel-rightArrow .Icon--arrow {
    -webkit-transform: rotateZ(-90deg);
            transform: rotateZ(-90deg);
  }
.AdvancedViewer-header {
    padding: 0 16px;
  }
  .AdvancedViewer-imgField {
    background-color: #EBEBEB;
  }
  html[data-theme="dark"] .AdvancedViewer-imgField {
    background-color: #444444;
}
  .AdvancedViewer-content {
    padding: 0;
  }
  .AdvancedViewer-image {
    width: 100%;
  }
  .AdvancedViewer-image .AdvancedViewer-imgField {
      height: 197.33px;
    }
  .AdvancedViewer-imageText {
    display: flex;
    flex-direction: column;
  }
  .AdvancedViewer-imageText .AdvancedViewer-intro {
      margin: 0 16px;
      border-bottom: 1px solid #EBEBEB;
      padding: 13px 0;
      line-height: 23px;
      word-wrap: break-word;
      overflow: hidden;
    }
  html[data-theme="dark"] .AdvancedViewer-imageText .AdvancedViewer-intro {
      border-bottom: 1px solid #444444;
}
  .AdvancedViewer-imageText .AdvancedViewer-imgField {
      height: 197.33px;
    }
  .AdvancedViewer-commodityItem {
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .AdvancedViewer-commodityItem[hidden] {
      display: none;
    }
  .AdvancedViewer-commodityItem img {
      height: 197.33px;
    }
  .AdvancedViewer-commodityIntro {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 0 16px;
    border-bottom: 1px solid #EBEBEB;
    line-height: 44px;
  }
  html[data-theme="dark"] .AdvancedViewer-commodityIntro {
    border-bottom: 1px solid #444444;
}
  .AdvancedViewer-subTitle {
    color: #8590A6;
  }
  html[data-theme="dark"] .AdvancedViewer-subTitle {
    color: #606A80;
}
  .AdvancedViewer .Carousel-leftArrow,
  .AdvancedViewer .Carousel-rightArrow {
    top: 98px;
  }
  .AdvancedViewer .Carousel-bullets {
    top: 165px;
  }
  .AdvancedViewer .Carousel-bullet {
    width: 6px;
    height: 6px;
    background: #FFFFFF;
  }
  .AdvancedViewer .Carousel-bullet.is-active {
      background: #444444;
    }
  html[data-theme="dark"] .AdvancedViewer .Carousel-bullet.is-active {
      background: #808080;
}
  html[data-theme="dark"] .AdvancedViewer .Carousel-bullet {
    background: #1A1A1A;
}
  .AdvancedViewer-recommended {
    display: flex;
    flex-direction: column;
  }
  .AdvancedViewer-recommendedItem {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    margin: 0 16px;
    padding: 16px 0;
    box-sizing: border-box;
  }
  .AdvancedViewer-recommendedItem .AdvancedViewer-imgField {
      margin-left: 13px;
      width: 81px;
      height: 65px;
      background-position: center center;
      background-size: cover;
    }
  .AdvancedViewer-summary {
    flex-grow: 1;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    width: 1px;
  }
  .AdvancedViewer-summary .AdvancedViewer-wrap {
      display: flex;
      flex-direction: column;
      height: 44px;
      overflow: hidden;
    }
  .AdvancedViewer-summary .AdvancedViewer-title,
    .AdvancedViewer-summary .AdvancedViewer-desc,
    .AdvancedViewer-summary .AdvancedViewer-data {
      line-height: 20px;
      overflow: hidden;
    }
  .AdvancedViewer-summary .AdvancedViewer-title {
      flex-shrink: 0;
      max-height: 44px;
      line-height: 22px;
      font-weight: 500;
      display: -webkit-box;
      text-overflow: ellipsis;
      overflow: hidden;
      -webkit-line-clamp: 2;
      /* autoprefixer: ignore next */
      -webkit-box-orient: vertical;
    }
  .AdvancedViewer-summary .AdvancedViewer-desc {
      flex-shrink: 1;
      max-height: 22px;
      line-height: 22px;
      font-size: 14px;
      color: #646464;
      display: -webkit-box;
      text-overflow: ellipsis;
      overflow: hidden;
      -webkit-line-clamp: 1;
      /* autoprefixer: ignore next */
      -webkit-box-orient: vertical;
    }
  html[data-theme="dark"] .AdvancedViewer-summary .AdvancedViewer-desc {
      color: #999999;
}
  .AdvancedViewer-summary .AdvancedViewer-data {
      font-size: 14px;
      color: #8590A6;
    }
  html[data-theme="dark"] .AdvancedViewer-summary .AdvancedViewer-data {
      color: #606A80;
}
  .AdvancedViewer-recommendedItem .AdvancedViewer-imgField {
    border-radius: 4px;
  }
  .AdvancedViewer-recommendedItem + .AdvancedViewer-recommendedItem {
    border-top: 0.5px solid #EBEBEB;
  }
  html[data-theme="dark"] .AdvancedViewer-recommendedItem + .AdvancedViewer-recommendedItem {
    border-top: 0.5px solid #444444;
}
  .AdvancedViewer-footer {
    padding: 13px 16px;
    box-sizing: border-box;
  }
  .AdvancedViewer-button {
    border-color: #0084FF;
    padding: 0;
    width: 100%;
    color: #0084FF;
  }
  html[data-theme="dark"] .AdvancedViewer-button {
    border-color: #3A76D0;
}
  html[data-theme="dark"] .AdvancedViewer-button {
    color: #3A76D0;
}

.AdvancedViewer.is-mobile .AdvancedViewer-footer {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    border-top: 1px solid #EBEBEB;
    margin: 0 16px;
    padding: 13px 0;
    box-sizing: border-box;
  }

html[data-theme="dark"] .AdvancedViewer.is-mobile .AdvancedViewer-footer {
    border-top: 1px solid #444444;
}

.AdvancedViewer.is-mobile .AdvancedViewer-brand {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    font-size: 14px;
    color: #8590A6;
  }

html[data-theme="dark"] .AdvancedViewer.is-mobile .AdvancedViewer-brand {
    color: #606A80;
}

.AdvancedViewer.is-mobile .AdvancedViewer-logo {
    border-radius: 20px;
    width: 20px;
    height: 20px;
  }

.AdvancedViewer.is-mobile .AdvancedViewer-brandName {
    margin-left: 6px;
  }

.AdvancedViewer.is-mobile .AdvancedViewer-button {
    border: 1px solid #8590A6;
    border-radius: 5px;
    width: 73px;
    height: 26px;
    line-height: 26px;
    font-size: 13px;
    color: #8590A6;
  }

html[data-theme="dark"] .AdvancedViewer.is-mobile .AdvancedViewer-button {
    border: 1px solid #606A80;
}

html[data-theme="dark"] .AdvancedViewer.is-mobile .AdvancedViewer-button {
    color: #606A80;
}

.AdvancedViewer.is-mobile .AdvancedViewer-imageText {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    margin: 0 16px;
    padding: 16px 0;
  }

.AdvancedViewer.is-mobile .AdvancedViewer-imageText .AdvancedViewer-intro {
      flex-grow: 1;
      margin: 0;
      border: none;
      padding: 0;
      height: 80px;
      line-height: 20px;
      font-size: 14px;
      word-wrap: break-word;
      overflow: hidden;
    }

.AdvancedViewer.is-mobile .AdvancedViewer-imageText .AdvancedViewer-imgField {
      flex-shrink: 0;
      margin-left: 18px;
      border-radius: 4px;
      width: 108px;
      height: 72px;
    }

.AdvancedViewer.is-mobile .AdvancedViewer-commodity {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    padding: 16px;
    width: 100%;
    box-sizing: border-box;
  }

.AdvancedViewer.is-mobile .AdvancedViewer-commodityItem {
    display: flex;
    flex-direction: column;
    width: calc((100% - 16px) / 3);
  }

.AdvancedViewer.is-mobile .AdvancedViewer-commodityItem img {
      border-radius: 4px;
      width: 100%;
      height: auto;
    }

.AdvancedViewer.is-mobile .AdvancedViewer-commodityIntro {
    flex-direction: column;
    margin: 0;
    margin-top: 3.3px;
    border-bottom: none;
    line-height: 20px;
  }

.AdvancedViewer.is-mobile .AdvancedViewer-header,
  .AdvancedViewer.is-mobile .AdvancedViewer-recommended {
    border: none;
  }

.AdvancedViewer.is-mobile .AdvancedViewer-recommendedItem .AdvancedViewer-imgField {
      width: 108px;
      height: 72px;
    }

.AdvancedViewer.is-mobile .AdvancedViewer-recommendedItem .AdvancedViewer-desc {
      margin-top: 6px;
      line-height: 16px;
    }

.AdvancedFloatCardViewer {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  border-radius: 8px;
  padding: 10px;
  width: 375px;
  height: 70px;
  background: rgba(235, 235, 235, 0.92);
  box-sizing: border-box;
}

.AdvancedFloatCardViewer-image {
    flex-shrink: 0;
    border-radius: 4px;
    width: 75px;
    height: 50px;
    background-position: center;
    background-size: cover;
    background-color: #EBEBEB;
  }

html[data-theme="dark"] .AdvancedFloatCardViewer-image {
    background-color: #444444;
}

.AdvancedFloatCardViewer-intro {
    flex-grow: 1;
    margin-left: 8px;
    margin-right: 8px;
    max-height: 40px;
    line-height: 20px;
    color: #646464;
    word-wrap: break-word;
    overflow: hidden;
  }

html[data-theme="dark"] .AdvancedFloatCardViewer-intro {
    color: #999999;
}

.AdvancedFloatCardViewer-button {
    flex-shrink: 0;
    border: none;
    border-radius: 28px;
    padding: 5px 8px;
    height: 28px;
    line-height: 18px;
    color: #FFFFFF;
    background: #646464;
    box-sizing: border-box;
  }

.AdvancedFloatCardViewer-button:hover {
      background: #646464;
    }

html[data-theme="dark"] .AdvancedFloatCardViewer-button:hover {
      background: #999999;
}

html[data-theme="dark"] .AdvancedFloatCardViewer-button {
    color: #1A1A1A;
}

html[data-theme="dark"] .AdvancedFloatCardViewer-button {
    background: #999999;
}

html[data-theme="dark"] .AdvancedFloatCardViewer {
  background: rgba(68, 68, 68, 0.92);
}

.AdvancedViewer.is-mobile + .ViewAllInappCard {
  margin-top: 0;
}
.BrandQuestionAuthor {
  display: flex;
  flex-direction: row;
}

  .BrandQuestionAuthor.is-clickable {
    cursor: pointer;
  }

.BrandQuestionAuthor-header {
  padding-left: 12px;
  padding-right: 12px;
}

.BrandQuestionAuthor-icon {
  width: 60px;
  height: 60px;
  border: 1px solid #F6F6F6;
  border-radius: 4px;
  box-sizing: border-box;
}

html[data-theme="dark"] .BrandQuestionAuthor-icon {
  border: 1px solid #2E2E2E;
}

.BrandQuestionAuthor-content {
  display: flex;
  width: calc(100% - 72px);
  margin-left: 12px;
  align-items: flex-start;
  flex-direction: column;
  justify-content: center;
  box-sizing: border-box;
}

.BrandQuestionAuthor-name {
  display: flex;
  flex-direction: row;
  align-items: center;
  font-size: 20px;
  line-height: 20px;
  color: #1A1A1A;
}

html[data-theme="dark"] .BrandQuestionAuthor-name {
  color: #999999;
}

.BrandQuestionAuthor-badge {
  margin-left: 3px;
  vertical-align: baseline;
}

.BrandQuestionAuthor-intro {
  width: 100%;
  margin-top: 10px;
  overflow: hidden;
  font-size: 14px;
  line-height: 14px;
  color: #1A1A1A;
  text-overflow: ellipsis;
  white-space: nowrap;
}

html[data-theme="dark"] .BrandQuestionAuthor-intro {
  color: #999999;
}

.BrandQuestionAuthor-buttons {
  margin: 0 20px;
  padding-top: 16px;
  padding-bottom: 16px;
}

.BrandQuestionAuthor-buttons .Button {
    width: 119px;
  }

.MobileBrandQuestionAuthor .BrandQuestionAuthor-header {
    position: relative;
    height: 44px;
    margin: 0;
    display: flex;
    justify-content: center;
    align-items: flex-end;
    border-bottom: 0;
  }

.MobileBrandQuestionAuthor .BrandQuestionAuthor-header::after {
      content: '';
      display: block;
      position: absolute;
      top: 30px;
      left: 0;
      right: 0;
      margin: 0 20px;
      border-bottom: 1px solid #EBEBEB;
    }

html[data-theme="dark"] .MobileBrandQuestionAuthor .BrandQuestionAuthor-header::after {
      border-bottom: 1px solid #444444;
}

.MobileBrandQuestionAuthor .BrandQuestionAuthor-header {
    align-items: center;
  }

.MobileBrandQuestionAuthor .BrandQuestionAuthor-headerText {
    position: relative;
    z-index: 1;
    padding: 0 20px;
    background: #FFFFFF;
  }

html[data-theme="dark"] .MobileBrandQuestionAuthor .BrandQuestionAuthor-headerText {
    background: #1A1A1A;
}

.Mobile-body .BrandQuestionAuthor-buttons {
    display: flex;
    justify-content: space-between;
  }

.Mobile-body .BrandQuestionAuthor-buttons .Button {
      flex-grow: 1;
    }

.Mobile-body .BrandQuestionAuthor-buttons .Button + .Mobile-body .BrandQuestionAuthor-buttons .Button {
        margin-left: 16px;
      }
.ImageAlias {
  -o-object-fit: cover;
     object-fit: cover;
  vertical-align: top;
  border-radius: 3px;
  -webkit-filter: brightness(0.95);
          filter: brightness(0.95);
}
  html[data-theme='dark'] .ImageAlias {
    -webkit-filter: brightness(0.7);
            filter: brightness(0.7);
  }
.QuestionTopicMeta {
  margin-bottom: 10px;
}

.QuestionTopicMeta-cardMain {
  display: flex;
  padding: 16px 20px 12px;
}

.QuestionTopicMeta-cardImage {
  width: 50px;
  height: 70px;
  border-radius: 3px;
  flex-shrink: 0;
}

.QuestionTopicMeta-cardContent {
  flex: 1;
  margin-left: 12px;
  display: flex;
  flex-direction: column;
  justify-content: space-around;
  overflow: hidden;
}

.QuestionTopicMeta-cardTitle {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  margin-bottom: 4px;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
}

html[data-ios] .QuestionTopicMeta-cardTitle {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .QuestionTopicMeta-cardTitle {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

.QuestionTopicMeta-cardDesc {
  font-size: 14px;
  margin-bottom: 4px;
  color: #646464;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

html[data-theme="dark"] .QuestionTopicMeta-cardDesc {
  color: #999999;
}

.QuestionTopicMeta-cardScore {
  font-size: 14px;
  color: #646464;
}

.QuestionTopicMeta-cardScore:not(:last-child) {
    margin-right: 8px;
  }

.QuestionTopicMeta-cardScore strong {
    color: #FF9607;
    margin-left: 2px;
  }

html[data-theme="dark"] .QuestionTopicMeta-cardScore strong {
    color: #FF9607;
}

html[data-theme="dark"] .QuestionTopicMeta-cardScore {
  color: #999999;
}

.QuestionTopicMeta-cardMore {
  padding: 12px 20px 16px;
  border-top: 1px solid #EBEBEB;
  color: #8590A6;
  font-size: 14px;
}

html[data-theme="dark"] .QuestionTopicMeta-cardMore {
  border-top: 1px solid #444444;
}

html[data-theme="dark"] .QuestionTopicMeta-cardMore {
  color: #606A80;
}

.QuestionTopicMeta-cardMoreInner {
  line-height: 1.6;
  margin-bottom: 8px;
  max-height: 42px;
  display: -webkit-box;
  text-overflow: ellipsis;
  overflow: hidden;
  -webkit-line-clamp: 2;
  /* autoprefixer: ignore next */
  -webkit-box-orient: vertical;
}

.QuestionTopicMeta-cardMoreInner.RichText p {
    margin-bottom: 0;
  }

.QuestionTopicMeta-cardLink {
  color: #175199;
}

html[data-theme="dark"] .QuestionTopicMeta-cardLink {
  color: #175199;
}

/* 商品类话题卡片 */
.QuestionTopicMeta-goods {
  padding: 10px 20px;
}
.QuestionTopicMeta-goods .QuestionTopicMeta-cardContent {
    margin-left: 20px;
  }
.QuestionTopicMeta-goods .QuestionTopicMeta-cardImage {
    width: 70px;
  }
.QuestionTopicMeta-goods .QuestionTopicMeta-cardTitle {
    margin-bottom: 0;
  }
.QuestionAnswer-content {
  padding: 16px 20px;
}
.MoreAnswers .List-header {
    position: relative;
    height: 44px;
    margin: 0;
    display: flex;
    justify-content: center;
    align-items: flex-end;
    border-bottom: 0;
  }

    .MoreAnswers .List-header::after {
      position: absolute;
      content: '';
      display: block;
      top: 30px;
      left: 0;
      right: 0;
      margin: 0 20px;
      border-bottom: 1px solid #EBEBEB;
    }

    html[data-theme="dark"] .MoreAnswers .List-header::after {
      border-bottom: 1px solid #444444;
}
  .MoreAnswers .List-headerText {
    position: relative;
    z-index: 1;
    padding: 0 20px;
    background: #FFFFFF;
    top: -3px;
    color: #8590A6;
    font-weight: 400;
  }
  html[data-theme="dark"] .MoreAnswers .List-headerText {
    background: #1A1A1A;
}
  html[data-theme="dark"] .MoreAnswers .List-headerText {
    color: #606A80;
}
.AnswerAuthor .Card-section:empty {
    display: none;
  }

.AnswerAuthor-user {
  display: flex;
  align-items: center;
}

.AnswerAuthor-user-avatar {
  margin-right: 12px;
}

.AnswerAuthor-user-avatar .UserLink,
  .AnswerAuthor-user-avatar .Popover,
  .AnswerAuthor-user-avatar .Avatar {
    display: block;
  }

.AnswerAuthor-user-content {
  flex: 1;
  overflow: hidden;
}

.AnswerAuthor-user-name,
.AnswerAuthor-user-headline {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.AnswerAuthor-user-name {
  font-size: 20px;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
  line-height: 30px;
  color: #1A1A1A;
}

html[data-ios] .AnswerAuthor-user-name {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .AnswerAuthor-user-name {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

html[data-theme="dark"] .AnswerAuthor-user-name {
  color: #999999;
}

.AnswerAuthor-user-headline {
  font-size: 14px;
  line-height: 20px;
}

.AnswerAuthor-user-headline .RichText {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

.AnswerAuthor-item {
  display: flex;
  font-size: 14px;
  line-height: 24px;
}

.AnswerAuthor-item + .AnswerAuthor-item {
    margin-top: 12px;
  }

.AnswerAuthor-item-icon {
  display: inline-block;
  width: 16px;
  margin-right: 8px;
  text-align: center;
  color: #8590A6;
}

html[data-theme="dark"] .AnswerAuthor-item-icon {
  color: #606A80;
}

.AnswerAuthor-item-value {
  font-size: 14px;
  line-height: 24px;
  color: #8590A6;
}

html[data-theme="dark"] .AnswerAuthor-item-value {
  color: #606A80;
}

.AnswerAuthor-counts {
  font-size: 14px;
  text-align: center;
}

.AnswerAuthor-buttons {
  display: flex;
  margin-top: 16px;
}

.AnswerAuthor-buttons .Button {
    flex: 1;
  }
.AnswerFavlists {
  display: flex;
  height: 100%;
  flex-direction: column;
}

.AnswerFavlists-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 57px;
  padding: 0 20px;
  border-bottom: 1px solid #F6F6F6;
}

html[data-theme="dark"] .AnswerFavlists-header {
  border-bottom: 1px solid #2E2E2E;
}

.AnswerFavlists-title {
  font-size: 16px;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
  color: #1A1A1A;
}

html[data-ios] .AnswerFavlists-title {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .AnswerFavlists-title {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

html[data-theme="dark"] .AnswerFavlists-title {
  color: #999999;
}

.AnswerFavlists-list {
  flex: 1;
  overflow-x: hidden;
  overflow-y: auto;
}
.AnswerCopyrightApplicants {
  display: flex;
  height: 100%;
  flex-direction: column;
}

.AnswerCopyrightApplicants-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 57px;
  padding: 0 20px;
  border-bottom: 1px solid #F6F6F6;
}

html[data-theme="dark"] .AnswerCopyrightApplicants-header {
  border-bottom: 1px solid #2E2E2E;
}

.AnswerCopyrightApplicants-title {
  font-size: 16px;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
  color: #1A1A1A;
}

html[data-ios] .AnswerCopyrightApplicants-title {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .AnswerCopyrightApplicants-title {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

html[data-theme="dark"] .AnswerCopyrightApplicants-title {
  color: #999999;
}

.AnswerCopyrightApplicants-list {
  flex: 1;
  overflow-x: hidden;
  overflow-y: auto;
}

.AnswerCopyrightApplicants-item {
  padding: 16px 0;
  margin: 0 24px;
  border-bottom: 1px solid #F6F6F6;
}

html[data-theme="dark"] .AnswerCopyrightApplicants-item {
  border-bottom: 1px solid #2E2E2E;
}

.AnswerCopyrightApplicants-time {
  align-self: flex-start;
  font-size: 14px;
  color: #8590A6;
}

html[data-theme="dark"] .AnswerCopyrightApplicants-time {
  color: #606A80;
}
.AnswerInfo-title .Button {
    font-size: inherit;
    color: #175199;
  }
    .AnswerInfo-title .Button:hover {
    border-bottom: 1px solid #175199;
  }
    html[data-theme="dark"] .AnswerInfo-title .Button:hover {
    border-bottom: 1px solid #175199;
}
    html[data-theme="dark"] .AnswerInfo-title .Button {
    color: #175199;
}

.AnswerInfo-copyright-applicants {
  padding: 16px;
  margin: 0;
}

.AnswerInfo-copyright-applicant {
  font-size: 14px;
  line-height: 24px;
  color: #8590A6;
}

.AnswerInfo-copyright-applicant + .AnswerInfo-copyright-applicant {
    margin-top: 12px;
  }

.AnswerInfo-copyright-applicant .UserLink a {
    color: #175199;
  }

.AnswerInfo-copyright-applicant .UserLink a:hover {
    border-bottom: 1px solid #175199;
  }

html[data-theme="dark"] .AnswerInfo-copyright-applicant .UserLink a:hover {
    border-bottom: 1px solid #175199;
}

html[data-theme="dark"] .AnswerInfo-copyright-applicant .UserLink a {
    color: #175199;
}

html[data-theme="dark"] .AnswerInfo-copyright-applicant {
  color: #606A80;
}

.AnswerInfo-favlists {
  padding: 4px 20px;
  margin: 0;
}

.AnswerInfo-favlist {
  position: relative;
  padding: 12px 0;
  font-size: 14px;
  line-height: 24px;
  color: #8590A6;
}

.AnswerInfo-favlist:not(:first-child) {
    border-top: 1px solid #F6F6F6;
  }

html[data-theme="dark"] .AnswerInfo-favlist:not(:first-child) {
    border-top: 1px solid #2E2E2E;
}

.AnswerInfo-favlist a {
    display: inline;
    color: #175199;
  }

.AnswerInfo-favlist a:hover {
    border-bottom: 1px solid #175199;
  }

html[data-theme="dark"] .AnswerInfo-favlist a:hover {
    border-bottom: 1px solid #175199;
}

html[data-theme="dark"] .AnswerInfo-favlist a {
    color: #175199;
}

html[data-theme="dark"] .AnswerInfo-favlist {
  color: #606A80;
}

.AnswerInfo-title {
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
}

html[data-ios] .AnswerInfo-title {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .AnswerInfo-title {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

.AnswerInfo-favlist-title {
  max-width: 180px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.AnswerInfo-favlist-followers {
  position: absolute;
  top: 12px;
  right: 0;
}
.ViewAll--bottom {
  margin-top: -10px;
  position: relative;
  box-shadow: 0 3px 3px -3px rgba(26, 26, 26, 0.2);
}

  .ViewAll--bottom::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    margin: 0 16px;
    border-top: 1px solid #F6F6F6;
  }

  html[data-theme="dark"] .ViewAll--bottom::before {
    border-top: 1px solid #2E2E2E;
}

  html[data-theme="dark"] .ViewAll--bottom {
  box-shadow: 0 3px 3px -3px rgba(153, 153, 153, 0.2);
}

.AdvancedViewer.is-mobile + .ViewAll--bottom {
  margin-top: 0;
}

.AdvancedViewer.is-mobile + .ViewAll--bottom::before {
    margin: 0;
  }
.SearchItem-authorName {
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
  font-size: 15px;
}
  html[data-ios] .SearchItem-authorName {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }
  html[data-android] .SearchItem-authorName {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

.Search-statusLink {
  font-size: 14px;
  color: #8590A6;
}

html[data-theme="dark"] .Search-statusLink {
  color: #606A80;
}

.SearchItem-meta {
  margin-top: 5px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.SearchItem-meta .SearchItem-description {
    margin-top: 2px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

.SearchItem-meta.SearchItem-authorInfo {
    margin: 12px 0;
  }

.SearchItem-userTitle {
  display: flex;
}

.SearchItem-userTitle .UserLink-badge {
    display: flex;
    align-items: center;
  }

.Search-statusLink,
.Search-liveStatusLink,
.Search-ebookStatusLink,
.Search-albumStatusLink {
  font-size: 14px;
  color: #8590A6;
  display: inline-flex;
  padding: 0 8px;
}

.Search-statusLink:first-child, .Search-liveStatusLink:first-child, .Search-ebookStatusLink:first-child, .Search-albumStatusLink:first-child {
    padding-left: 0;
  }

html[data-theme="dark"] .Search-statusLink, html[data-theme="dark"] .Search-liveStatusLink, html[data-theme="dark"] .Search-ebookStatusLink, html[data-theme="dark"] .Search-albumStatusLink {
  color: #606A80;
}

.SearchItem-ebookAvatarWrapper {
  display: inline-block;
  width: 60px;
  height: 80px;
  border-radius: 4px;
  overflow: hidden;
}

.SearchItem-ebookAvatarImg {
  width: 60px;
  border-radius: 4px;
}

.SearchItem-albumImg {
  width: 60px;
  border-radius: 4px;
}

.SearchItem-promotion img {
  max-width: 100%;
}

.Search-questionFollowButton {
  min-width: auto;
  padding: 10px;
}

.SearchItem-avatarWrapper {
  border-radius: 4px;
  position: relative;
}

.SearchItem-avatarWrapper:after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.05);
    border-radius: inherit;
    pointer-events: none;
  }

html[data-theme='dark'] .SearchItem-avatarWrapper {
      position: relative;
    }

html[data-theme='dark'] .SearchItem-avatarWrapper::after {
      content: '';
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background-color: rgba(0, 0, 0, 0.3);
      border-radius: inherit;
      pointer-events: none;
    }

.AlbumItem-avatarWrapper {
  display: inline-block;
}
.SearchAlbum-playButton {
  min-width: 96px;
  display: flex;
  align-items: center;
  justify-content: center;
}

  .SearchAlbum-playButton svg {
    margin-right: 5px;
  }
.SearchAlbumModal-openInAppWrapper {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.SearchAlbumModal-subtitle {
  margin-bottom: 20px;
  text-align: center;
}

.SearchAlbumModal-button {
  width: 220px;
  margin-top: 20px;
  box-sizing: border-box;
}

.SearchAlbumModal-qrcode {
  display: flex;
  margin: 0 auto;
}
.MinorHotSpot {
  padding: 8px 0 10px;
}

  .MinorHotSpot-TitleLine {
    display: flex;
    color: #444444;
    font-size: 18px;
    line-height: 18px;
    /* 与设计一致，不支持设备将回退为 700 */
    font-weight: 600;
    /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
    font-synthesis: style;
  }

  html[data-ios] .MinorHotSpot-TitleLine {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

  html[data-android] .MinorHotSpot-TitleLine {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

  .MinorHotSpot-TitleLine--hasPaddingBottom {
      padding-bottom: 2px;
    }

  .MinorHotSpot-TitleLine img {
      height: 18px;
    }

  html[data-theme='dark'] .MinorHotSpot-TitleLine img {
    -webkit-filter: brightness(0.7);
            filter: brightness(0.7);
  }

  .MinorHotSpot-TitleLine h1 {
      margin-left: 8px;
    }

  html[data-theme="dark"] .MinorHotSpot-TitleLine {
    color: #808080;
}

  .MinorHotSpot-Description {
    font-size: 15px;
    line-height: 25px;
    color: #999999;
    margin-top: 8px;
  }

  html[data-theme="dark"] .MinorHotSpot-Description {
    color: #646464;
}

  .MinorHotSpot-Quote {
    width: 16px;
    height: 16px;
    fill: #D3D3D3;
  }

  .MinorHotSpot-Quote--left {
      margin-right: 2px;
    }

  .MinorHotSpot-Quote--right {
      margin-left: 2px;
      vertical-align: bottom;
    }

  html[data-theme="dark"] .MinorHotSpot-Quote {
    fill: #2E2E2E;
}

  .MinorHotSpot-ContentList {
    margin-left: 8px;
    margin-top: 22px;
    border-left: 2px solid #F6F6F6;
    padding-left: 20px;
    padding-bottom: 1px;
  }

  .MinorHotSpot-ContentList--hasPaddingBottom {
      padding-bottom: 16px;
    }

  html[data-theme="dark"] .MinorHotSpot-ContentList {
    border-left: 2px solid #2E2E2E;
}

  .MinorHotSpot-ContentContainer:not(:last-child) {
      margin-bottom: 22px;
    }

  .MinorHotSpot-ShowAll {
    margin: 2px 0 0 8px;
    border-left: 2px dashed #F6F6F6;
    padding-left: 20px;
    color: #175199;
    font-size: 14px;
    cursor: pointer;
  }

  html[data-theme="dark"] .MinorHotSpot-ShowAll {
    border-left: 2px dashed #2E2E2E;
}

  html[data-theme="dark"] .MinorHotSpot-ShowAll {
    color: #175199;
}
.WikiBoxReview {
  justify-self: flex-end;
  align-self: flex-start;
  flex-shrink: 0;
  border-left: 1px solid #EBEBEB;
  margin-left: 28px;
  padding-left: 20px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  width: 72px;
}

  .WikiBoxReview-Score {
    margin-bottom: 2px;
    color: #0084FF;
    line-height: 28px;
    /* 与设计一致，不支持设备将回退为 700 */
    font-weight: 600;
    /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
    font-synthesis: style;
  }

  html[data-ios] .WikiBoxReview-Score {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

  html[data-android] .WikiBoxReview-Score {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

  html[data-theme="dark"] .WikiBoxReview-Score {
    color: #3A76D0;
}

  .WikiBoxReview-ScoreText {
    font-size: 24px;
    margin-right: 2px;
  }

  .WikiBoxReview-Percent {
    font-size: 15px;
  }

  .WikiBoxReview-Text {
    margin-bottom: 4px;
    font-size: 13px;
    line-height: 16px;
    color: #646464;
    /* 与设计一致，不支持设备将回退为 700 */
    font-weight: 600;
    /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
    font-synthesis: style;
  }

  html[data-ios] .WikiBoxReview-Text {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

  html[data-android] .WikiBoxReview-Text {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

  html[data-theme="dark"] .WikiBoxReview-Text {
    color: #999999;
}

  .WikiBoxReview-BigText {
    font-size: 14px;
    margin-bottom: 8px;
  }

  .WikiBoxReview-SubText {
    font-size: 12px;
    line-height: 14px;
    color: #999999;
  }

  html[data-theme="dark"] .WikiBoxReview-SubText {
    color: #646464;
}

  .WikiBoxReview-RecommendText {
    margin-bottom: 6px;
  }

  .WikiBoxReview-LackReviewText {
    margin: 4px 0 8px;
  }

  .WikiBoxReview-MyStatus {
    display: inline-flex;
  }

  .WikiBoxReview-Icon {
    box-sizing: border-box;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    border: 1px solid #EBEBEB;
    background: #FFFFFF;
    cursor: pointer;
  }

  .WikiBoxReview-Icon svg {
      fill: #8590A6;
    }

  html[data-theme="dark"] .WikiBoxReview-Icon svg {
      fill: #606A80;
}

  .WikiBoxReview-Icon--like,
    .WikiBoxReview-Icon--liked {
      margin-right: 6px;
    }

  .WikiBoxReview-Icon--dislike,
    .WikiBoxReview-Icon--disliked {
      -webkit-transform: rotate(180deg);
              transform: rotate(180deg);
    }

  .WikiBoxReview-Icon--liked {
      background: #0084FF;
    }

  .WikiBoxReview-Icon--liked svg {
        fill: #FFFFFF;
      }

  html[data-theme="dark"] .WikiBoxReview-Icon--liked svg {
        fill: #1A1A1A;
}

  html[data-theme="dark"] .WikiBoxReview-Icon--liked {
      background: #3A76D0;
}

  .WikiBoxReview-Icon--disliked {
      background: #646464;
    }

  .WikiBoxReview-Icon--disliked svg {
        fill: #FFFFFF;
      }

  html[data-theme="dark"] .WikiBoxReview-Icon--disliked svg {
        fill: #1A1A1A;
}

  html[data-theme="dark"] .WikiBoxReview-Icon--disliked {
      background: #999999;
}

  html[data-theme="dark"] .WikiBoxReview-Icon {
    border: 1px solid #444444;
}

  html[data-theme="dark"] .WikiBoxReview-Icon {
    background: #1A1A1A;
}

  html[data-theme="dark"] .WikiBoxReview {
  border-left: 1px solid #444444;
}
.WikiBoxFooter {
  display: inline-block;
  padding-top: 8px;
  font-size: 14px;
  line-height: 20px;
  color: #175199;
}
  html[data-theme="dark"] .WikiBoxFooter {
  color: #175199;
}
.WikiBoxHeader {
  display: flex;
  padding-top: 4px;
}

  .WikiBoxHeader-ImageWrapper {
    flex-shrink: 0;
    margin-right: 16px;
    border-radius: 4px;
    width: 100px;
    height: 100px;
    overflow: hidden;
    cursor: pointer;
    position: relative;
  }

  .WikiBoxHeader-ImageWrapper:after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.05);
    border-radius: inherit;
    pointer-events: none;
  }

  html[data-theme='dark'] .WikiBoxHeader-ImageWrapper {
      position: relative;
    }

  html[data-theme='dark'] .WikiBoxHeader-ImageWrapper::after {
      content: '';
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background-color: rgba(0, 0, 0, 0.3);
      border-radius: inherit;
      pointer-events: none;
    }

  .WikiBoxHeader-ImageWrapper--tall {
      height: 134px;
    }

  .WikiBoxHeader-Image {
    display: block;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
  }

  .WikiBoxHeader-Info {
    flex: 1;
  }

  .WikiBoxHeader-TitleWrapper {
    margin-bottom: 8px;
    display: flex;
    align-items: center;
  }

  .WikiBoxHeader-TitleWrapper .SearchItem-type {
      margin-left: 10px;
    }

  .WikiBoxHeader-Title {
    font-size: 16px;
    line-height: 20px;
    color: #F1403C;
    cursor: pointer;
    /* 与设计一致，不支持设备将回退为 700 */
    font-weight: 600;
    /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
    font-synthesis: style;
  }

  html[data-ios] .WikiBoxHeader-Title {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

  html[data-android] .WikiBoxHeader-Title {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

  .WikiBoxHeader-Title em {
      font-style: normal;
    }

  html[data-theme="dark"] .WikiBoxHeader-Title {
    color: #B7302D;
}

  .WikiBoxHeader-Meta {
    font-size: 14px;
    line-height: 22px;
    margin-bottom: 6px;
    color: #1A1A1A;
  }

  html[data-theme="dark"] .WikiBoxHeader-Meta {
    color: #999999;
}

  .WikiBoxHeader-MetaKey {
    color: #8590A6;
  }

  html[data-theme="dark"] .WikiBoxHeader-MetaKey {
    color: #606A80;
}

  .WikiBoxHeader-IntroductionWrapper {
    position: relative;
    font-size: 14px;
    line-height: 22px;
    color: #1A1A1A;
    max-height: 44px;
    display: -webkit-box;
    text-overflow: ellipsis;
    overflow: hidden;
    -webkit-line-clamp: 2;
    /* autoprefixer: ignore next */
    -webkit-box-orient: vertical;
  }

  .WikiBoxHeader-IntroductionWrapper em {
      font-style: normal;
      color: #F1403C;
    }

  html[data-theme="dark"] .WikiBoxHeader-IntroductionWrapper em {
      color: #B7302D;
}

  html[data-theme="dark"] .WikiBoxHeader-IntroductionWrapper {
    color: #999999;
}

  /* 接口数据中可能有多个 p 元素... */

  .WikiBoxHeader-Introduction {
    display: inline;
  }

  .WikiBoxHeader-Introduction p {
      display: inline;
    }

  .WikiBoxHeader-IntroTail {
    position: relative;
    font-size: 14px;
    line-height: 22px;
    color: #175199;
    background: #FFFFFF;
    padding-left: 4px;
  }

  .WikiBoxHeader-IntroTail:before {
      content: '';
      display: inline-block;
      position: absolute;
      left: -22px;
      width: 22px;
      height: 22px;
      background-image: linear-gradient(
        to right,
        rgba(255, 255, 255, 0),
        #FFFFFF
      );
    }

  html[data-theme="dark"] .WikiBoxHeader-IntroTail:before {
      background-image: linear-gradient(
        to right,
        rgba(26, 26, 26, 0),
        #1A1A1A
      );
}

  html[data-theme="dark"] .WikiBoxHeader-IntroTail {
    color: #175199;
}

  html[data-theme="dark"] .WikiBoxHeader-IntroTail {
    background: #1A1A1A;
}

  .WikiBoxHeader-CornerTail {
    position: absolute;
    right: 0;
    bottom: -3px;
  }
.WikiBoxHotList {
  margin-top: 21px;
  border-top: 1px solid #EBEBEB;
  padding-top: 16px;
}

  .WikiBoxHotList-Title {
    font-size: 14px;
    color: #1A1A1A;
    line-height: 22px;
    margin-bottom: 8px;
    /* 与设计一致，不支持设备将回退为 700 */
    font-weight: 600;
    /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
    font-synthesis: style;
  }

  html[data-ios] .WikiBoxHotList-Title {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

  html[data-android] .WikiBoxHotList-Title {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

  html[data-theme="dark"] .WikiBoxHotList-Title {
    color: #999999;
}

  .WikiBoxHotList-Icon {
    margin-right: 3px;
  }

  .WikiBoxHotList-Container {
    display: flex;
  }

  .WikiBoxHotList-Line {
    margin: 4px 20px 4px 8px;
    width: 2px;
    background: #EBEBEB;
  }

  html[data-theme="dark"] .WikiBoxHotList-Line {
    background: #444444;
}

  .WikiBoxHotList-Item {
    font-size: 14px;
    line-height: 22px;
    color: #1A1A1A;
  }

  .WikiBoxHotList-Item:hover,
    .WikiBoxHotList-Item:active {
      color: #646464;
    }

  html[data-theme="dark"] .WikiBoxHotList-Item:hover, html[data-theme="dark"] .WikiBoxHotList-Item:active {
      color: #999999;
}

  .WikiBoxHotList-Item em {
      font-style: normal;
      color: #F1403C;
    }

  html[data-theme="dark"] .WikiBoxHotList-Item em {
      color: #B7302D;
}

  .WikiBoxHotList-Item:not(:last-child) {
      margin-bottom: 6px;
    }

  .WikiBoxHotList-Item span:first-child {
      cursor: pointer;
    }

  html[data-theme="dark"] .WikiBoxHotList-Item {
    color: #999999;
}

  .WikiBoxHotList-ItemMeta {
    margin-left: 10px;
    color: #999999;
  }

  html[data-theme="dark"] .WikiBoxHotList-ItemMeta {
    color: #646464;
}

  html[data-theme="dark"] .WikiBoxHotList {
  border-top: 1px solid #444444;
}
.WikiBoxEssenceContent-TitleWrapper {
    display: flex;
    margin-bottom: 8px;
    font-size: 14px;
    color: #175199;
    line-height: 22px;
    /* 与设计一致，不支持设备将回退为 700 */
    font-weight: 600;
    /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
    font-synthesis: style;
  }
    html[data-ios] .WikiBoxEssenceContent-TitleWrapper {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }
    html[data-android] .WikiBoxEssenceContent-TitleWrapper {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }
    html[data-theme="dark"] .WikiBoxEssenceContent-TitleWrapper {
    color: #175199;
}
  .WikiBoxEssenceContent-Title {
    cursor: pointer;
  }
  .WikiBoxEssenceContent-Title em {
      font-style: normal;
    }
  .WikiBoxEssenceContent-List {
    margin-left: 8px;
    padding-left: 20px;
    border-left: 2px solid #F6F6F6;
  }
  html[data-theme="dark"] .WikiBoxEssenceContent-List {
    border-left: 2px solid #2E2E2E;
}
  .WikiBoxEssenceContent-ItemWrapper {
    width: 100%;
    display: inline-flex;
    font-size: 14px;
    line-height: 22px;
  }
  .WikiBoxEssenceContent-ItemWrapper:first-child {
      margin-bottom: 6px;
    }
  .WikiBoxEssenceContent-Item {
    color: #1A1A1A;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-height: 22px;
    cursor: pointer;
  }
  .WikiBoxEssenceContent-Item:hover,
    .WikiBoxEssenceContent-Item:active {
      color: #646464;
    }
  html[data-theme="dark"] .WikiBoxEssenceContent-Item:hover, html[data-theme="dark"] .WikiBoxEssenceContent-Item:active {
      color: #999999;
}
  .WikiBoxEssenceContent-Item em {
      color: #F1403C;
      font-style: normal;
    }
  html[data-theme="dark"] .WikiBoxEssenceContent-Item em {
      color: #B7302D;
}
  html[data-theme="dark"] .WikiBoxEssenceContent-Item {
    color: #999999;
}
  .WikiBoxEssenceContent-ItemMeta {
    flex-shrink: 0;
    margin-left: 10px;
    color: #999999;
  }
  html[data-theme="dark"] .WikiBoxEssenceContent-ItemMeta {
    color: #646464;
}
.WikiBoxEssenceExtraList {
  margin-top: 16px;
  border-top: 1px solid #EBEBEB;
  padding-top: 16px;
  display: flex;
  color: #175199;
  font-size: 14px;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
  line-height: 22px;
}
  html[data-ios] .WikiBoxEssenceExtraList {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }
  html[data-android] .WikiBoxEssenceExtraList {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }
  .WikiBoxEssenceExtraList-LeadingText {
    color: #999999;
  }
  html[data-theme="dark"] .WikiBoxEssenceExtraList-LeadingText {
    color: #646464;
}
  .WikiBoxEssenceExtraList-Bull {
    margin: 0 0.5em;
  }
  .WikiBoxEssenceExtraList-Item {
    cursor: pointer;
  }
  html[data-theme="dark"] .WikiBoxEssenceExtraList {
  border-top: 1px solid #444444;
}
  html[data-theme="dark"] .WikiBoxEssenceExtraList {
  color: #175199;
}
.WikiBoxEssenceList {
  margin-top: 16px;
  border-top: 1px solid #EBEBEB;
  padding-top: 16px;
}

  .WikiBoxEssenceList-ListItem:not(:first-child) {
      margin-top: 14px;
    }

  html[data-theme="dark"] .WikiBoxEssenceList {
  border-top: 1px solid #444444;
}
.SearchNoContent-wrapper {
  width: 100%;
  height: 400px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.SearchNoContent-content {
  width: 500px;
  height: 200px;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.SearchNoContent-title {
  font-size: 24px;
  margin-bottom: 32px;
}

.SearchNoContent-input {
  width: 488px;
  height: 40px;
  background-color: #F6F6F6;
  margin-bottom: 32px;
  display: flex;
  align-items: center;
}

.SearchNoContent-input .SearchNoContent-focusedInput {
    background-color: #FFFFFF;
  }

html[data-theme="dark"] .SearchNoContent-input .SearchNoContent-focusedInput {
    background-color: #1A1A1A;
}

html[data-theme="dark"] .SearchNoContent-input {
  background-color: #2E2E2E;
}

.SearchNoContent-button {
  width: 220px;
  height: 36px;
}

.SearchNoContent-description {
  font-size: 15px;
  color: #8590A6;
  margin-top: 10px;
}

html[data-theme="dark"] .SearchNoContent-description {
  color: #606A80;
}
.SearchCorrection {
  width: 694px;
  line-height: 23px;
  padding: 16px 20px;
}

.SearchCorrection-correctionQueryString {
  color: #F1403C;
}

html[data-theme="dark"] .SearchCorrection-correctionQueryString {
  color: #B7302D;
}
.SearchMain {
  width: 694px;
  margin-right: 10px;
}

  .SearchMain .Avatar {
    -o-object-fit: cover;
       object-fit: cover;
  }

.SearchSections {
  width: 694px;
}

.SearchSections .List-item {
    padding: 0;
  }

.SearchSections .ContentItem {
    padding: 20px;
  }

.SearchSections .ContentItem:not(:last-child) {
    border-bottom: 1px solid #F6F6F6;
  }

html[data-theme="dark"] .SearchSections .ContentItem:not(:last-child) {
    border-bottom: 1px solid #2E2E2E;
}

.SearchSections .ContentItem-title > div {
    display: flex;
    align-items: center;
  }

.SearchSections .SearchItem-type {
    margin-left: 8px;
  }

.Search-more {
  display: flex;
  align-items: center;
  margin-top: 5px;
  font-size: 14px;
  color: #175199;
}

html[data-theme="dark"] .Search-more {
  color: #175199;
}

/* Web 搜索平移样式调整，新版上线后可合并到旧版样式中 */
.SearchResult-Card {
  box-shadow: none;
  margin-bottom: 12px;
  padding-top: 4px;
}
.SearchResult-Card .SearchItem-type {
    margin-left: 12px;
    padding: 3px 9px;
  }
.SearchResult-Card .Search-more {
    margin-top: 4px;
  }
.SearchResult-Card .SearchItem-meta {
    margin-top: 4px;
    line-height: 24px;
  }
.SearchResult-Card .SearchItem-meta .SearchItem-description {
      margin-top: 0;
    }
.SearchResult-Card .ContentItem-title {
    margin-bottom: 0;
  }
.SearchResult-Card .ContentItem-status {
    margin-top: 0;
    line-height: 24px;
    display: flex;
  }
.SearchResult-Card .RichContent-inner {
    margin-top: 6px;
  }
.SearchResult-Card .ContentItem-head {
    margin-top: -2px;
    margin-right: 20px;
  }
.SearchResult-Card .SearchItem-userTitle {
    display: inline-flex;
  }
.SearchResult-Card .ContentItem-meta {
    margin-top: 4px;
  }
.SearchResult-Card .SearchItem-albumStatus {
    margin-top: 0;
  }
.SearchResult-Card .Rating {
    display: flex;
    padding-top: 3px;
  }
.TopSearch.Card:last-of-type {
  margin-bottom: 0;
}

.TopSearch--new.Card {
  box-shadow: none;
}

.TopSearch-title {
  font-size: 15px;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
  padding: 13px 16px;
  border-bottom: 1px solid #F6F6F6;
}

html[data-ios] .TopSearch-title {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .TopSearch-title {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

html[data-theme="dark"] .TopSearch-title {
  border-bottom: 1px solid #2E2E2E;
}

.TopSearch-items {
  padding: 8px 16px;
}

.TopSearch-item {
  margin: 6px 0;
  overflow: hidden;
}

.TopSearch-itemLink {
  display: inline-flex;
  align-items: center;
  font-size: 14px;
  color: #1A1A1A;
  line-height: 21px;
  width: 100%;
  overflow: hidden;
}

.TopSearch-itemLink:hover {
    color: #175199;
  }

html[data-theme="dark"] .TopSearch-itemLink:hover {
    color: #175199;
}

html[data-theme="dark"] .TopSearch-itemLink {
  color: #999999;
}

.TopSearch-itemText {
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

.TopSearch-hot {
  flex-shrink: 0;
}

.TopSearch-items--spread {
  display: flex;
  flex-wrap: wrap;
  font-size: 15px;
  align-items: center;
}

.TopSearch-items--spread .TopSearch-item {
    flex-basis: 50%;
  }

.TopSearch-items--spread .TopSearch-itemLink {
    color: #175199;
    width: auto;
    max-width: 100%;
    overflow: hidden;
  }

html[data-theme="dark"] .TopSearch-items--spread .TopSearch-itemLink {
    color: #175199;
}

.TopSearch-hot {
  padding-left: 5px;
}
.SearchRecommendationItem {
  display: flex;
  align-items: self-start;
  padding: 16px;
}

  .SearchRecommendationItem > img {
    width: 40px;
    margin-right: 8px;
    border-radius: 4px;
  }

  .SearchRecommendationItem:not(:last-child) {
    border-bottom: 1px solid #F6F6F6;
  }

  html[data-theme="dark"] .SearchRecommendationItem:not(:last-child) {
    border-bottom: 1px solid #2E2E2E;
}

.SearchRecommendationItem-status {
  display: flex;
  font-size: 14px;
  margin-top: 3px;
  color: #8590A6;
}

html[data-theme="dark"] .SearchRecommendationItem-status {
  color: #606A80;
}

.SearchRecommendationItem-title {
  display: inline-block;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
  margin-right: 8px;
  max-width: 142px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  vertical-align: middle;
}

html[data-ios] .SearchRecommendationItem-title {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .SearchRecommendationItem-title {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

.SearchRecommendationItem-title + span {
    vertical-align: middle;
  }

.SearchRecommendationItem-title:hover,
  .SearchRecommendationItem-title:hover em {
    color: #175199;
  }

html[data-theme="dark"] .SearchRecommendationItem-title:hover, html[data-theme="dark"] .SearchRecommendationItem-title:hover em {
    color: #175199;
}

.SearchRecommendationItem-authorName {
  max-width: 60px;
  display: inline-block;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.SearchRecommendations-title {
  padding: 13px 16px;
  font-size: 16px;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
  border-bottom: 1px solid #F6F6F6;
}
  html[data-ios] .SearchRecommendations-title {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }
  html[data-android] .SearchRecommendations-title {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }
  html[data-theme="dark"] .SearchRecommendations-title {
  border-bottom: 1px solid #2E2E2E;
}
.SearchSideBar {
  flex: 1;
}
.SearchTabs {
  width: 100%;
  background-color: #FFFFFF;
  padding-top: 2px;
}

  .SearchTabs.SearchTab-bottomShadow {
    box-shadow: 0 1px 3px rgba(26, 26, 26, 0.1);
  }

  html[data-theme='dark'] .SearchTabs.SearchTab-bottomShadow {
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
  }

  html[data-theme="dark"] .SearchTabs {
  background-color: #1A1A1A;
}

.SearchTabs-inner {
  margin: 0 auto;
  width: 1000px;
  display: flex;
  justify-content: space-between;
}

.SearchTabs-actions {
  width: 694px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.SearchTabs-actions .Tabs {
    border-bottom: 0;
  }

.SearchTabs-selectList {
  width: 104px;
}
.Search-container {
  display: flex;
  align-items: flex-start;
  position: relative;
  width: 1000px;
  min-height: 100vh;
  padding: 0 16px;
  margin: 10px auto;
  color: #1A1A1A;
}

  .Search-container .ContentItem-title {
    font-size: 16px;
  }

  .Search-container .SearchItem-meta {
    font-size: 14px;
    color: #1A1A1A;
  }

  html[data-theme="dark"] .Search-container .SearchItem-meta {
    color: #999999;
}

  .Search-container .VoteButton,
  .Search-container .LikeButton {
    line-height: 26px;
    padding: 0 10px;
  }

  .Search-container .QuestionFollowButton {
    line-height: 26px;
    padding: 0 10px;
    width: auto;
  }

  .Search-container .RichContent .RichContent-inner {
    margin-top: 5px;
  }

  .Search-container .RichContent.is-collapsed .RichContent-inner {
    font-size: 14px;
  }

  .Search-container .ContentItem-actions {
    height: 40px;
    padding-bottom: 6px;
  }

  .Search-container .ContentItem-actions.is-fixed {
    height: 52px;
  }

  .Search-container .ContentItem-action:not(:first-child) {
    margin-left: 16px;
  }

  .Search-container .ContentItem-action.ContentItem-rightButton {
    margin-left: auto;
  }

  .Search-container .ContentItem-extra {
    align-self: auto;
    margin-top: 14px;
  }

  .Search-container .ContentItem-title {
    margin-top: 0;
  }

  .Search-container .RichText b {
    font-weight: 600 !important;
  }

  html[data-theme="dark"] .Search-container {
  color: #999999;
}

.Highlight em {
  font-style: normal;
  color: #F1403C;
}

html[data-theme="dark"] .Highlight em {
  color: #B7302D;
}

.SearchItem-type {
  display: inline-block;
  white-space: nowrap;
  padding: 1px 4px;
  background: #EBEBEB;
  color: #8590A6;
  font-size: 13px;
  font-weight: normal;
  border-radius: 4px;
}

html[data-theme="dark"] .SearchItem-type {
  background: #444444;
}

html[data-theme="dark"] .SearchItem-type {
  color: #606A80;
}
.ContentLayout {
  width: 1000px;
  margin: 10px auto;
  padding: 0 16px;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
}

.ContentLayout-mainColumn {
  margin-right: 10px;
  width: 694px;
}

.ContentLayout-sideColumn {
  width: 296px;
  flex-shrink: 0;
}
.ModifyField-input {
  width: 100%;
}

.ModifyField-modifyButton:not(:first-child) {
    margin-left: 8px;
  }

.ModifyField-actionBar {
  display: flex;
  justify-content: space-between;
  padding: 16px 0;
}

.ModifyField-buttonGroup .Button:not(:last-child) {
    margin-right: 12px;
  }
.TopicCreateMeta {
  text-align: center;
}

.TopicCreateMeta-submit {
  margin-top: 10px;
  width: 200px;
}
.TopicActions {
  display: flex;
  align-items: center;
}

  .TopicActions > * {
    flex-shrink: 0;
  }

.TopicActions-link {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  padding: 4px 10px !important;
}

.TopicActions-followButton {
  margin-right: 12px;
}

.TopicActions-shareMenu {
  margin-left: 12px;
}
/* TODO: style from UserAvatarEditor */
  .TopicCard .UserAvatarEditor-maskInnerText {
    display: none;
  }
  .TopicCard .UserAvatar,
  .TopicCard .UserAvatarEditor-maskInner {
    border-radius: 4px;
    border: 0;
  }
  .TopicCard .UserAvatarEditor-cameraIcon {
    margin-bottom: 0;
  }
  .TopicCard .Avatar {
    max-width: 100px;
    max-height: 100px;
  }

.TopicCard-icon {
  margin-left: 2px;
}

.TopicCard-content {
  padding: 16px 20px;
}

.TopicCard-title {
  font-weight: normal;
  margin-top: 4px;
  margin-bottom: 12px;
}

.TopicCard-titleText {
  display: inline;
  font-size: 22px;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
}

html[data-ios] .TopicCard-titleText {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .TopicCard-titleText {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

.TopicCard-image {
  width: 100px;
  height: 100px;
  border-radius: 4px;
}

.TopicCard-description {
  line-height: 26px;
}

.TopicCard-collapseButton {
  margin-left: 8px;
}

.TopicCard-actions {
  padding: 12px 20px;
  border-top: 1px solid #EBEBEB;
  display: flex;
  justify-content: space-between;
}

html[data-theme="dark"] .TopicCard-actions {
  border-top: 1px solid #444444;
}
.Badge {
  display: inline-block;
  padding: 1px 6px;
  font-size: 12px;
  font-weight: normal;
  color: #8590A6;
  vertical-align: 1px;
  background-color: #F6F6F6;
  border-radius: 3px;
  line-height: 18px;
}
  html[data-theme="dark"] .Badge {
  color: #606A80;
}
  html[data-theme="dark"] .Badge {
  background-color: #2E2E2E;
}
.TopicMetaCard {
  padding: 16px 20px;
}

  .TopicMetaCard--rectangleImage .TopicMetaCard-image {
      height: 186px;
    }

  .TopicMetaCard--rectangleImage .TopicMetaCard-content {
      min-height: 110px;
    }

  .TopicMetaCard--squareImage .TopicMetaCard-image {
      height: 125px;
    }

  .TopicMetaCard--squareImage .TopicMetaCard-content {
      min-height: 50px;
    }

.TopicMetaCard-item {
  position: relative;
}

.TopicMetaCard-image {
  width: 125px;
  height: 186px;
}

.TopicMetaCard-title {
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  font-size: 22px;
}

.TopicMetaCard-label {
  margin-bottom: 10px;
  font-size: 14px;
  color: #8590A6;
}

html[data-theme="dark"] .TopicMetaCard-label {
  color: #606A80;
}

.TopicMetaCard-badgeScore {
  margin-right: 4px;
  color: #FF9607;
}

html[data-theme="dark"] .TopicMetaCard-badgeScore {
  color: #FF9607;
}

.TopicMetaCard-badges {
  margin-bottom: 8px;
}

.TopicMetaCard-badge {
  margin-right: 12px;
}

.TopicMetaCard-badge .Badge {
    font-size: 14px;
    padding: 3px 6px;
  }

.TopicMetaCard-description {
  line-height: 26px;
  font-size: 14px;
}

.TopicMetaCard-wikiDescription {
  height: 52px;
  display: -webkit-box;
  text-overflow: ellipsis;
  overflow: hidden;
  -webkit-line-clamp: 2;
  /* autoprefixer: ignore next */
  -webkit-box-orient: vertical;
}

.TopicMetaCard-actions {
  margin-top: 8px;
}

.TopicMetaCard-content {
  min-height: 110px;
}
.TopicNumberBoard-item {
  padding: 16px 0;
}
.TopicTopWriterBoard-section {
  padding: 0 20px;
}

.TopicTopWriterBoard-author {
  padding: 12px 0;
}

.TopicTopWriterBoard-author:not(:last-child) {
    border-bottom: 1px solid #EBEBEB;
  }

html[data-theme="dark"] .TopicTopWriterBoard-author:not(:last-child) {
    border-bottom: 1px solid #444444;
}

.TopicTopWriterBoard-authorDesc {
  color: #8590A6;
  font-size: 13px;
  display: -webkit-box;
  text-overflow: ellipsis;
  overflow: hidden;
  -webkit-line-clamp: 1;
  /* autoprefixer: ignore next */
  -webkit-box-orient: vertical;
}

html[data-theme="dark"] .TopicTopWriterBoard-authorDesc {
  color: #606A80;
}

.TopicTopWriterBoard-link:hover {
    color: #175199;
  }

html[data-theme="dark"] .TopicTopWriterBoard-link:hover {
    color: #175199;
}
.TopicTag {
  display: inline-block;
}

  .TopicTag .Tag {
    max-width: 256px;
    box-sizing: border-box;
    vertical-align: baseline;
    vertical-align: initial;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

.TopicTagsContainer .TopicTag {
    margin: 0 8px 8px 0;
  }
.TopicRelativeBoard-item:not(:first-child) {
    margin-top: 16px;
  }

.TopicRelativeBoard-title {
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
  margin-bottom: 12px;
}

html[data-ios] .TopicRelativeBoard-title {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .TopicRelativeBoard-title {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

.TopicRelativeBoard-tag {
  display: inline-block;
  margin-right: 8px;
  margin-bottom: 8px;
}

.TopicRelativeBoard-link {
  display: inline-block;
  padding-top: 4px;
  font-size: 14px;
  color: #8590A6;
}

.TopicRelativeBoard-link:hover {
    color: #175199;
  }

html[data-theme="dark"] .TopicRelativeBoard-link:hover {
    color: #175199;
}

html[data-theme="dark"] .TopicRelativeBoard-link {
  color: #606A80;
}
.TopicContributorList {
  display: flex;
  flex-direction: column;
  height: 100%;
}

  .TopicContributorList-content {
    flex: 1;
    overflow-y: scroll;
  }
.TopicContributorBoard-section {
    padding: 0 20px;
  }
  .TopicContributorBoard-author {
    padding: 14px 0 15px;
  }
  .TopicContributorBoard-author:not(:last-child) {
      border-bottom: 1px solid #EBEBEB;
    }
  html[data-theme="dark"] .TopicContributorBoard-author:not(:last-child) {
      border-bottom: 1px solid #444444;
}
  .TopicContributorBoard-author .AuthorInfo-content {
      margin-right: 12px;
    }
  .TopicContributorBoard-authorInfo {
    color: #8590A6;
  }
  html[data-theme="dark"] .TopicContributorBoard-authorInfo {
    color: #606A80;
}
  .TopicContributorBoard-link:hover {
      color: #175199;
    }
  html[data-theme="dark"] .TopicContributorBoard-link:hover {
      color: #175199;
}
.TopicVoteBoard {
  padding: 20px 20px 20px 16px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 15px;
  line-height: 20px;
  color: #8590A6;
}

  .TopicVoteBoard-button {
    box-sizing: border-box;
    height: 32px;
    padding: 0 10px;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: rgba(0, 132, 255, 0.1);
    border-color: transparent;
    outline: none;
  }

  .TopicVoteBoard-button:hover {
      background-color: rgba(0, 132, 255, 0.15);
    }

  html[data-theme="dark"] .TopicVoteBoard-button:hover {
      background-color: rgba(58, 118, 208, 0.15);
}

  .TopicVoteBoard-button svg {
      fill: #0084FF;
    }

  html[data-theme="dark"] .TopicVoteBoard-button svg {
      fill: #3A76D0;
}

  .TopicVoteBoard-button.voted {
      background-color: #0084FF;
    }

  .TopicVoteBoard-button.voted:hover {
        background-color: #0084FF;
      }

  html[data-theme="dark"] .TopicVoteBoard-button.voted:hover {
        background-color: #3A76D0;
}

  .TopicVoteBoard-button.voted svg {
        fill: #FFFFFF;
      }

  html[data-theme="dark"] .TopicVoteBoard-button.voted svg {
        fill: #1A1A1A;
}

  html[data-theme="dark"] .TopicVoteBoard-button.voted {
      background-color: #3A76D0;
}

  html[data-theme="dark"] .TopicVoteBoard-button {
    background-color: rgba(58, 118, 208, 0.1);
}

  .TopicVoteBoard-voteCount {
    display: inline-block;
    margin-left: 4px;
    color: #0084FF;
    letter-spacing: -0.2px;
  }

  .TopicVoteBoard-button.voted .TopicVoteBoard-voteCount {
      color: #FFFFFF;
    }

  html[data-theme="dark"] .TopicVoteBoard-button.voted .TopicVoteBoard-voteCount {
      color: #1A1A1A;
}

  html[data-theme="dark"] .TopicVoteBoard-voteCount {
    color: #3A76D0;
}

  html[data-theme="dark"] .TopicVoteBoard {
  color: #606A80;
}
.TopicCreatorWallEntry-link:hover {
  color: #175199;
}
  html[data-theme="dark"] .TopicCreatorWallEntry-link:hover {
  color: #175199;
}

.TopicCreatorWallEntry-itemList {
  display: flex;
  padding: 16px 22px;
  justify-content: space-between;
}

.TopicCreatorWallEntry-itemContainer {
  position: relative;
}

.TopicCreatorWallEntry-itemMask {
  left: 0;
  top: 0;
  position: absolute;
  width: 38px;
  height: 38px;
  background: rgba(26, 26, 26, 0.4);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  color: #FFFFFF;
}

html[data-theme="dark"] .TopicCreatorWallEntry-itemMask {
  background: rgba(153, 153, 153, 0.4);
}

html[data-theme="dark"] .TopicCreatorWallEntry-itemMask {
  color: #1A1A1A;
}
#TopicMain {
  min-height: 100vh;
}

.Topic-pageHeader {
  width: 1000px;
  height: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin: 0 auto;
}

.Topic-pageHeader .Topic-tabs {
    flex: 1;
  }

.Topic-bar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  background-color: #FFFFFF;
  flex: 1;
}

.Topic-bar--borderTop {
    border-top: 1px solid #EBEBEB;
  }

html[data-theme="dark"] .Topic-bar--borderTop {
    border-top: 1px solid #444444;
}

.Topic-bar--borderBottom {
    border-bottom: 1px solid #EBEBEB;
  }

html[data-theme="dark"] .Topic-bar--borderBottom {
    border-bottom: 1px solid #444444;
}

html[data-theme="dark"] .Topic-bar {
  background-color: #1A1A1A;
}

.Topic-barWrapper {
  background: #FFFFFF;
  overflow: hidden;
  border-radius: 2px 2px 0 0;
  box-shadow: 0 1px 3px rgba(26, 26, 26, 0.1);
  box-sizing: border-box;
}

html[data-theme='dark'] .Topic-barWrapper {
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
  }

.Topic-barWrapper + .Card {
    border-radius: 0 0 2px 2px;
  }

html[data-theme="dark"] .Topic-barWrapper {
  background: #1A1A1A;
}

.Topic-headerLink.Button {
  padding-right: 20px;
}

.Topic-pageHeaderMain {
  display: flex;
  align-items: center;
  width: 694px;
}

.Topic-tabs {
  border-bottom: 0;
}
.TopicIndexModule {
  padding: 0 20px 16px;
}

.TopicIndex-mobileContent .TopicIndexModule-item a {
    color: #175199;
  }

html[data-theme="dark"] .TopicIndex-mobileContent .TopicIndexModule-item a {
    color: #175199;
}

.TopicIndexModule-title {
  border-top: 52px solid transparent;
  margin-top: -52px;
  padding: 16px 0;
  border-bottom: 1px solid #EBEBEB;
  margin-bottom: 8px;
  font-size: 18px;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
}

html[data-ios] .TopicIndexModule-title {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .TopicIndexModule-title {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

html[data-theme="dark"] .TopicIndexModule-title {
  border-bottom: 1px solid #444444;
}

.TopicIndexModule-item {
  padding: 8px 0;
}

.TopicIndexModule-item a:hover {
    color: #175199;
  }

html[data-theme="dark"] .TopicIndexModule-item a:hover {
    color: #175199;
}

.TopicIndexModule-topics {
  margin-top: 8px;
}

.TopicIndexModule-topicsTitle {
  display: inline-block;
  margin-right: 8px;
  overflow: hidden;
  line-height: 30px;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
}

html[data-ios] .TopicIndexModule-topicsTitle {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .TopicIndexModule-topicsTitle {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }
.TopicIndexCatalog {
  position: relative;
  border-top: 16px solid transparent;
  border-bottom: 16px solid transparent;
  border-right: 20px solid transparent;
  text-align: right;
}

.TopicIndexCatalog::before, .TopicIndexCatalog-item::before {
    position: absolute;
    top: 0;
    right: 0;
    display: block;
    width: 4px;
    height: 100%;
    content: '';
    background-color: #EBEBEB;
    border-radius: 2px;
  }

html[data-theme="dark"] .TopicIndexCatalog::before, html[data-theme="dark"] .TopicIndexCatalog-item::before {
    background-color: #444444;
}

.TopicIndexCatalog-item {
  position: relative;
  color: #8590A6;
}

.TopicIndexCatalog-item a {
    display: inline-block;
    padding: 4px 8px;
    border-right: 4px solid transparent;
  }

.TopicIndexCatalog-item.is-active {
    color: #1A1A1A;
  }

.TopicIndexCatalog-item.is-active::before {
      background-color: #0084FF;
    }

html[data-theme="dark"] .TopicIndexCatalog-item.is-active::before {
      background-color: #3A76D0;
}

html[data-theme="dark"] .TopicIndexCatalog-item.is-active {
    color: #999999;
}

html[data-theme="dark"] .TopicIndexCatalog-item {
  color: #606A80;
}
.TopicIndex-content {
  display: flex;
  justify-content: space-between;
  overflow: unset;
}

.TopicIndex-contentSide {
  position: relative;
  width: 180px;
}
.TopicIntroSection {
  margin: 20px;
}

  /* 清除知乎百科中图片的浮动 */

  .TopicIntroSection:after {
    content: '';
    display: block;
    clear: both;
  }

  .TopicIntroSection:not(:last-child) {
    padding-bottom: 20px;
    border-bottom: 1px solid #EBEBEB;
  }

  html[data-theme="dark"] .TopicIntroSection:not(:last-child) {
    border-bottom: 1px solid #444444;
}

  .TopicIntroSection .OldTopicIntro-intro {
    font-size: 15px;
    line-height: 24px;
    color: #646464;
  }

  html[data-theme="dark"] .TopicIntroSection .OldTopicIntro-intro {
    color: #999999;
}

  .TopicIntroSection .OldTopicIntro-source {
    color: #8590A6;
    line-height: 24px;
  }

  html[data-theme="dark"] .TopicIntroSection .OldTopicIntro-source {
    color: #606A80;
}

.TopicIntroSection-title {
  height: 26px;
  line-height: 26px;
  margin-bottom: 16px;
  font-size: 18px;
  color: #1A1A1A;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
}

html[data-ios] .TopicIntroSection-title {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .TopicIntroSection-title {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

html[data-theme="dark"] .TopicIntroSection-title {
  color: #999999;
}
.TopicContentAbbr {
  overflow: hidden;
  display: -webkit-box;
  text-overflow: ellipsis;
}

.TopicContentAbbr-abbr {
  position: relative;
}

.TopicContentAbbr-mask {
  position: absolute;
  top: 66px;
  right: 0;
  width: 6em;
  height: 22px;
  text-align: right;
}

.TopicContentAbbr-mask span:first-child {
    position: absolute;
    left: 0;
    right: 0;
    display: inline-block;
    width: 100%;
    height: 100%;
    background: #FFFFFF;
    transition: max-height 0.32s cubic-bezier(0.95, 0.05, 0.795, 0.035),
      -webkit-mask-size 0.22s cubic-bezier(0.95, 0.05, 0.795, 0.035);
    transition: mask-size 0.22s cubic-bezier(0.95, 0.05, 0.795, 0.035),
      max-height 0.32s cubic-bezier(0.95, 0.05, 0.795, 0.035);
    transition: mask-size 0.22s cubic-bezier(0.95, 0.05, 0.795, 0.035),
      max-height 0.32s cubic-bezier(0.95, 0.05, 0.795, 0.035),
      -webkit-mask-size 0.22s cubic-bezier(0.95, 0.05, 0.795, 0.035);
    -webkit-mask-image: linear-gradient(
      to left,
      #1A1A1A calc(100% - 2em),
      transparent calc(100%)
    );
            mask-image: linear-gradient(
      to left,
      #1A1A1A calc(100% - 2em),
      transparent calc(100%)
    );
    -webkit-mask-size: 100% 100%;
            mask-size: 100% 100%;
  }

html[data-theme="dark"] .TopicContentAbbr-mask span:first-child {
    background: #1A1A1A;
}

html[data-theme="dark"] .TopicContentAbbr-mask span:first-child {
    -webkit-mask-image: linear-gradient(
      to left,
      #999999 calc(100% - 2em),
      transparent calc(100%)
    );
            mask-image: linear-gradient(
      to left,
      #999999 calc(100% - 2em),
      transparent calc(100%)
    );
}

.TopicContentAbbr-mask span:last-child {
    position: absolute;
    right: 2px;
    bottom: 0;
    z-index: 2;
    color: #175199;
  }

html[data-theme="dark"] .TopicContentAbbr-mask span:last-child {
    color: #175199;
}
.TopicRelated {
  padding: 15px 0;
}

  .TopicRelated img {
    width: 40px;
    height: 40px;
    border-radius: 4px;
  }

.TopicRelated:not(:last-child) {
  border-bottom: 1px solid #EBEBEB;
}

html[data-theme="dark"] .TopicRelated:not(:last-child) {
  border-bottom: 1px solid #444444;
}

.TopicRelated-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  line-height: 18px;
  margin-bottom: 15px;
}

.TopicRelated-header > div {
    display: flex;
  }

.TopicRelated-content {
  height: 40px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  color: #999999;
  margin-left: 15px;
}

.TopicRelated-content span {
    font-size: 15px;
    color: #1A1A1A;
    /* 与设计一致，不支持设备将回退为 700 */
    font-weight: 600;
    /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
    font-synthesis: style;
  }

html[data-ios] .TopicRelated-content span {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .TopicRelated-content span {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

html[data-theme="dark"] .TopicRelated-content span {
    color: #999999;
}

html[data-theme="dark"] .TopicRelated-content {
  color: #646464;
}

.TopicRelated-followButton {
  width: 70px;
  min-width: 70px;
  padding: 0;
  font-size: 13px;
  height: 30px;
  line-height: 30px;
  border-radius: 5px;
}

.TopicRelated-followIcon {
  margin: 0 6px 2px 0;
}
.SquareGrid {
  display: flex;
  flex-wrap: wrap;
}
.ImageViewAlias {
  position: fixed;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  z-index: 100;
}

  .ImageViewAlias .ImageViewAlias-viewPort,
  .ImageViewAlias .ImageViewAlias-mask,
  .ImageViewAlias .ImageViewAlias-controls {
    transition: opacity 150ms ease-in-out;
    display: flex;
    align-items: center;
    justify-content: center;
  }

.ImageViewAlias-mask {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: rgba(26, 26, 26, 0.65);
  z-index: -1;
}

html[data-theme="dark"] .ImageViewAlias-mask {
  background: rgba(153, 153, 153, 0.65);
}

.ImageViewAlias-controlsLeft,
  .ImageViewAlias-controlsRight,
  .ImageViewAlias-controlsClose {
    position: fixed;
    z-index: 1;
    width: 72px;
    height: 72px;
    border-radius: 50%;
  }

.ImageViewAlias-controlsLeft.Button, .ImageViewAlias-controlsRight.Button, .ImageViewAlias-controlsClose.Button {
      background: rgba(255, 255, 255, 0.1);
    }

@media (max-width: 690px) {

.ImageViewAlias-controlsLeft,
  .ImageViewAlias-controlsRight,
  .ImageViewAlias-controlsClose {
      width: 48px;
      height: 48px
  }

      .ImageViewAlias-controlsLeft.Button, .ImageViewAlias-controlsRight.Button, .ImageViewAlias-controlsClose.Button {
        background: none;
      }
    }

.ImageViewAlias-controlsLeft,
  .ImageViewAlias-controlsRight {
    top: 50%;
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
  }

.ImageViewAlias-controlsLeft {
    left: calc(50% - 508px);
  }

@media (max-width: 690px) {

.ImageViewAlias-controlsLeft {
      left: 0
  }
    }

.ImageViewAlias-controlsRight {
    right: calc(50% - 508px);
  }

@media (max-width: 690px) {

.ImageViewAlias-controlsRight {
      right: 0
  }
    }

.ImageViewAlias-controlsClose {
    top: calc(50% - 300px);
    right: calc(50% - 508px);
  }

@media (max-width: 690px) {

.ImageViewAlias-controlsClose {
      top: 0;
      right: 0
  }
    }

.ImageViewAlias-viewPort {
  width: 100%;
  box-sizing: border-box;
  min-height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.ImageViewAlias-image {
  max-width: 100%;
}
.ThumbnailAlias {
  width: 100%;
  padding-bottom: 100%;
  position: relative;
  overflow: hidden;
}

.ThumbnailAlias-image {
  max-width: 100%;
  min-height: 100%;
  position: absolute;
  -o-object-fit: cover;
     object-fit: cover;
  top: 50%;
  left: 50%;
  -webkit-transform: translate3d(-50%, -50%, 0);
          transform: translate3d(-50%, -50%, 0);
}

.ThumbnailAlias-image--zoomIn {
    cursor: zoom-in;
  }

.ThumbnailAlias-image--pointer {
    cursor: pointer;
  }

.ThumbnailAlias-surplus {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  font-style: normal;
  font-size: 18px;
  color: #fff;
  z-index: 1;
  background: rgba(26, 26, 26, 0.3);
  text-align: center;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
}

html[data-ios] .ThumbnailAlias-surplus {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .ThumbnailAlias-surplus {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }
.TopicMovieIntro-celebrityItem {
  display: flex;
  align-items: center;
}

.TopicMovieIntro-celebrityItemAvatar {
  margin-right: 12px;
}

.TopicMovieIntro-celebrityDefaultAvatar {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  margin-right: 12px;
  background: #EBEBEB;
}

html[data-theme="dark"] .TopicMovieIntro-celebrityDefaultAvatar {
  background: #000000;
}

.TopicMovieIntro-celebrityDefaultAvatar--icon {
  fill: #D3D3D3;
}

html[data-theme="dark"] .TopicMovieIntro-celebrityDefaultAvatar--icon {
  fill: #2E2E2E;
}

.TopicMovieIntro-celebrityItemContent {
  display: flex;
  flex: 1;
  align-items: center;
  height: 52px;
}

.TopicMovieIntro-celebrityItem:not(:last-child) .TopicMovieIntro-celebrityItemContent {
    border-bottom: 1px solid #EBEBEB;
  }

html[data-theme="dark"] .TopicMovieIntro-celebrityItem:not(:last-child) .TopicMovieIntro-celebrityItemContent {
    border-bottom: 1px solid #444444;
}

.TopicMovieIntro-celebrityItemContent .TopicMovieIntro-celebrityItemName {
    width: 212px;
  }

.TopicMovieIntro-celebrityItemContent .TopicMovieIntro-celebrityItemPlay {
    flex: 1;
    color: #646464;
  }

html[data-theme="dark"] .TopicMovieIntro-celebrityItemContent .TopicMovieIntro-celebrityItemPlay {
    color: #999999;
}

.TopicMovieIntro-awardItem:last-child {
    margin-bottom: 20px;
  }

.TopicMovieIntro-awardItem a {
    color: #175199;
  }

.TopicMovieIntro-awardItem a:hover {
    border-bottom: 1px solid #175199;
  }

html[data-theme="dark"] .TopicMovieIntro-awardItem a:hover {
    border-bottom: 1px solid #175199;
}

html[data-theme="dark"] .TopicMovieIntro-awardItem a {
    color: #175199;
}

.TopicMovieIntro-awardItemTitle {
  height: 52px;
  display: flex;
  align-items: center;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
}

html[data-ios] .TopicMovieIntro-awardItemTitle {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .TopicMovieIntro-awardItemTitle {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

.TopicMovieIntro-awardItemTitle .Avatar {
    width: 36px;
    height: 36px;
    margin-right: 12px;
  }

.TopicMovieIntro-awardContent {
  line-height: 24px;
  color: #646464;
}

html[data-theme="dark"] .TopicMovieIntro-awardContent {
  color: #999999;
}

.TopicMovieIntro-celebrityMore {
  padding-top: 12px;
}

.TopicMovieIntro-celebrityMore span {
    margin-left: 4px;
  }

.TopicMovieIntro-celebrityMoreIcon {
  display: inline-flex;
  align-items: center;
}

.TopicMovieIntro-moreInfoItem {
  display: flex;
  align-items: flex-start;
  line-height: 36px;
}

.TopicMovieIntro-moreInfoItemTitle {
  width: 120px;
  flex-shrink: 0;
  line-height: 36px;
  margin-bottom: 8px;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
}

html[data-ios] .TopicMovieIntro-moreInfoItemTitle {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .TopicMovieIntro-moreInfoItemTitle {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

.TopicMovieIntro-score {
  display: flex;
  justify-content: space-between;
}
.TopicIntro-moreInfoItemLabel {
  display: inline-block;
  width: 100px;
  line-height: 26px;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
}
  html[data-ios] .TopicIntro-moreInfoItemLabel {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }
  html[data-android] .TopicIntro-moreInfoItemLabel {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

.TopicIntro-moreInfoItemValue {
  line-height: 26px;
}
.TopicColumnMeta {
  box-sizing: border-box;
}

  .TopicColumnMeta-line {
    font-size: 15px;
  }

  .TopicColumnMeta-avatar {
    margin-right: 12px;
  }

  .TopicColumnMeta-topic {
    display: flex;
  }

  .TopicColumnMeta-name {
    /* 与设计一致，不支持设备将回退为 700 */
    font-weight: 600;
    /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
    font-synthesis: style;
    color: #1A1A1A;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
  }

  html[data-ios] .TopicColumnMeta-name {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

  html[data-android] .TopicColumnMeta-name {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

  html[data-theme="dark"] .TopicColumnMeta-name {
    color: #999999;
}

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

  html[data-theme="dark"] .TopicColumnMeta-remark {
    color: #999999;
}

  .TopicColumnMeta-more {
    padding-top: 12px;
  }

  .TopicColumnMeta-more span {
      margin-left: 4px;
    }

  .TopicColumnMeta-singleLine {
    display: flex;
    height: 52px;
  }

  .TopicColumnMeta-singleLine:not(:last-child) .TopicColumnMeta-topic {
      border-bottom: 1px solid #EBEBEB;
    }

  html[data-theme="dark"] .TopicColumnMeta-singleLine:not(:last-child) .TopicColumnMeta-topic {
      border-bottom: 1px solid #444444;
}

  .TopicColumnMeta-singleLine .TopicColumnMeta-avatar {
      margin: 8px 12px 8px 0;
    }

  .TopicColumnMeta-singleLine .TopicColumnMeta-topic {
      width: 606px;
      line-height: 52px;
    }

  .TopicColumnMeta-singleLine .TopicColumnMeta-name {
      width: 212px;
    }

  .TopicColumnMeta-singleLine .TopicColumnMeta-remark {
      padding-left: 16px;
      width: 378px;
    }

  .TopicColumnMeta-doubleLine {
    height: 78px;
  }

  .TopicColumnMeta-doubleLine .TopicColumnMeta-topic {
      padding: 8px 0;
    }

  .TopicColumnMeta-doubleLine .TopicColumnMeta-name {
      height: 36px;
      line-height: 36px;
    }

  .TopicColumnMeta-doubleLine .TopicColumnMeta-remark {
      height: 24px;
      line-height: 24px;
      margin-top: 2px;
    }
.TopicCommonField-topicText {
  line-height: 36px;
}

  .TopicCommonField-topicText:not(:last-child):after {
    content: '/';
    margin-left: 5px;
    margin-right: 5px;
  }

.TopicCommonField-topicAvatar {
  margin-right: 12px;
  vertical-align: top;
}

.TopicCommonField-topicText {
  flex: 1;
}

.TopicCommonField-wrappedTopic {
  display: flex;
  align-items: center;
}

.TopicCommonField-wrappedTopicRemark {
  margin-left: 8px;
}

.TopicCommonField-zhihuWiki--text {
  color: #444444;
  line-height: 24px;
}

.TopicCommonField-zhihuWiki--text img {
    cursor: default;
  }

.TopicCommonField-zhihuWiki--text h2,
  .TopicCommonField-zhihuWiki--text h3,
  .TopicCommonField-zhihuWiki--text h4,
  .TopicCommonField-zhihuWiki--text h5,
  .TopicCommonField-zhihuWiki--text h6 {
    line-height: 26px;
  }

.TopicCommonField-zhihuWiki--text h2 {
    font-size: 18px;
    color: #1A1A1A;
    margin-top: 20px;
  }

.TopicCommonField-zhihuWiki--text h2:not(:first-child) {
      position: relative;
      margin-top: 40px;
    }

.TopicCommonField-zhihuWiki--text h2:not(:first-child):before {
        content: '';
        display: block;
        position: absolute;
        height: 1px;
        width: 200%;
        background: #EBEBEB;
        -webkit-transform: scale(0.5);
                transform: scale(0.5);
        top: -20px;
        left: -50%;
      }

html[data-theme="dark"] .TopicCommonField-zhihuWiki--text h2:not(:first-child):before {
        background: #444444;
}

html[data-theme="dark"] .TopicCommonField-zhihuWiki--text h2 {
    color: #999999;
}

.TopicCommonField-zhihuWiki--text a.external {
    border-bottom: none;
    color: #175199;
  }

html[data-theme="dark"] .TopicCommonField-zhihuWiki--text a.external {
    color: #175199;
}

html[data-theme="dark"] .TopicCommonField-zhihuWiki--text {
  color: #808080;
}

.TopicCommonField-text {
  line-height: 24px;
  font-size: 15px;
  color: #646464;
}

/* 类型为 String 的内容不在表格（type: Table）中时，可能会传回表格格式的内容，其标签为：
    <ul>
      <li>
        <h4>{title}</h4>
        <p>{content}</p>
      </li>
      <li>
        <h4>{title}</h4>
        <p>{content}</p>
      </li>
    </ul>
  */

:not(.TopicCommonIntroTable-value) .TopicCommonField-text li {
    display: flex;
    width: 654px;
    margin-bottom: 6px;
  }

:not(.TopicCommonIntroTable-value) .TopicCommonField-text li h4 {
      margin: 0;
      width: 168px;
      /* 与设计一致，不支持设备将回退为 700 */
      font-weight: 600;
      /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
      font-synthesis: style;
    }

html[data-ios] :not(.TopicCommonIntroTable-value) .TopicCommonField-text li h4 {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] :not(.TopicCommonIntroTable-value) .TopicCommonField-text li h4 {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

:not(.TopicCommonIntroTable-value) .TopicCommonField-text li p {
      flex: 1;
    }

html[data-theme="dark"] .TopicCommonField-text {
  color: #999999;
}

.StringMeta-intro {
  font-size: 14px;
  line-height: 24px;
  color: #646464;
  white-space: pre-wrap;
}

.StringMeta-intro h1,
  .StringMeta-intro h2,
  .StringMeta-intro h3,
  .StringMeta-intro h5,
  .StringMeta-intro h6 {
    font-size: 15px;
    line-height: 23px;
    color: #1A1A1A;
    /* 与设计一致，不支持设备将回退为 700 */
    font-weight: 600;
    /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
    font-synthesis: style;
  }

html[data-ios] .StringMeta-intro h1, html[data-ios] .StringMeta-intro h2, html[data-ios] .StringMeta-intro h3, html[data-ios] .StringMeta-intro h5, html[data-ios] .StringMeta-intro h6 {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .StringMeta-intro h1, html[data-android] .StringMeta-intro h2, html[data-android] .StringMeta-intro h3, html[data-android] .StringMeta-intro h5, html[data-android] .StringMeta-intro h6 {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

html[data-theme="dark"] .StringMeta-intro h1, html[data-theme="dark"] .StringMeta-intro h2, html[data-theme="dark"] .StringMeta-intro h3, html[data-theme="dark"] .StringMeta-intro h5, html[data-theme="dark"] .StringMeta-intro h6 {
    color: #999999;
}

.StringMeta-intro b {
    /* 与设计一致，不支持设备将回退为 700 */
    font-weight: 600;
    /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
    font-synthesis: style;
  }

html[data-ios] .StringMeta-intro b {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .StringMeta-intro b {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

.StringMeta-intro a {
    color: #175199;
  }

html[data-theme="dark"] .StringMeta-intro a {
    color: #175199;
}

/* 类型为 String 的内容不在表格（type: Table）中时，可能会传回表格格式的内容，其标签为：
  <ul>
    <li>
      <h4>{title}</h4>
      <p>{content}</p>
    </li>
    <li>
      <h4>{title}</h4>
      <p>{content}</p>
    </li>
  </ul>
  */

.StringMeta-intro li {
    display: flex;
  }

.StringMeta-intro li h4 {
      margin: 0;
      width: 84px;
      /* 与设计一致，不支持设备将回退为 700 */
      font-weight: 600;
      /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
      font-synthesis: style;
    }

html[data-ios] .StringMeta-intro li h4 {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .StringMeta-intro li h4 {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

.StringMeta-intro li p {
      flex: 1;
    }

html[data-theme="dark"] .StringMeta-intro {
  color: #999999;
}
.TopicCommonArray {
  width: 100%;
}
.TopicCommonIntroTable-item {
  display: flex;
}

.TopicCommonIntroTable-name {
  width: 120px;
  flex-shrink: 0;
  line-height: 36px;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
}

html[data-ios] .TopicCommonIntroTable-name {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .TopicCommonIntroTable-name {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

.TopicCommonIntroTable-value {
  font-size: 15px;
  color: #646464;
}

html[data-theme="dark"] .TopicCommonIntroTable-value {
  color: #999999;
}

.TopicCommonIntroTable-value .TopicCommonField-text {
  line-height: 36px;
}

.ReferenceMeta {
  margin: 20px;
}

.ReferenceMeta h2 {
    margin-bottom: 16px;
    font-size: 18px;
    line-height: 26px;
    color: #1A1A1A;
    /* 与设计一致，不支持设备将回退为 700 */
    font-weight: 600;
    /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
    font-synthesis: style;
  }

html[data-ios] .ReferenceMeta h2 {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .ReferenceMeta h2 {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

html[data-theme="dark"] .ReferenceMeta h2 {
    color: #999999;
}

.ReferenceMeta ol {
    font-size: 15px;
    line-height: 24px;
  }

.ReferenceMeta ol li {
      list-style: decimal;
      margin-left: 20px;
    }

.ReferenceMeta-link {
    color: #175199;
  }

html[data-theme="dark"] .ReferenceMeta-link {
    color: #175199;
}

.ReferenceMeta-text {
    color: #444444;
  }

html[data-theme="dark"] .ReferenceMeta-text {
    color: #808080;
}

.CopyRightMeta {
  display: flex;
  justify-content: space-between;
  margin: 20px;
  line-height: 24px;
  height: 24px;
  font-size: 15px;
  color: #646464;
}

html[data-theme="dark"] .CopyRightMeta {
  color: #999999;
}

.CopyRightInfo {
  display: flex;
}

.CopyRightInfo img {
    width: 20px;
    height: 20px;
    margin-right: 8px;
    position: relative;
    top: 1px;
  }

.CopyRightSource {
  color: #8590A6;
  font-size: 14px;
}

html[data-theme="dark"] .CopyRightSource {
  color: #606A80;
}
.TopicFeedItem .Button:not(.Button--plain):not(.Button--link) {
      line-height: 30px;
    }
  .TopicFeedItem .ArticleItem-extraInfo {
    margin-top: 9px;
  }
  .TopicFeedItem .ArticleItem-authorInfo {
    margin-top: 12px;
  }
  .TopicFeedItem .RichContent-cover {
    margin-bottom: 0;
  }
  .TopicFeedItem .RichContent-inner {
    margin-top: 6px;
  }
  .TopicFeedItem .RichContent-cover + .RichContent-inner {
    margin-top: 14px;
  }
.TopicFeedList-empty {
  padding: 120px 0;
}

.TopicFeedList-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 13px 0;
  margin: 0 16px;
  border-bottom: 1px solid #F6F6F6;
}

html[data-theme="dark"] .TopicFeedList-header {
  border-bottom: 1px solid #2E2E2E;
}

.TopicFeedList-sort {
  font-size: 16px;
  color: #1A1A1A;

  /* 与设计一致，不支持设备将回退为 700 */

  font-weight: 600;

  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */

  font-synthesis: style;
}

html[data-ios] .TopicFeedList-sort {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .TopicFeedList-sort {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

html[data-theme="dark"] .TopicFeedList-sort {
  color: #999999;
}

.TopicFeedList-sortSwitch {
  color: #8590A6;
  font-size: 14px;
}

html[data-theme="dark"] .TopicFeedList-sortSwitch {
  color: #606A80;
}

.TopicQuestion-source {
  color: #8590A6;
  margin-bottom: 10px;
}

html[data-theme="dark"] .TopicQuestion-source {
  color: #606A80;
}
.TopicCreatorModule-more {
  width: 100%;
  border: none;
  border-top: 1px solid #EBEBEB;
  box-shadow: 0 1px 3px rgba(26, 26, 26, 0.1);
  border-radius: 0;
  line-height: 44px;
}
  html[data-theme='dark'] .TopicCreatorModule-more {
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
  }
  html[data-theme="dark"] .TopicCreatorModule-more {
  border-top: 1px solid #444444;
}
.TopicHotIntroItem-item:not(:first-child) {
    padding-top: 16px;
  }
  .TopicHotIntroItem-item:not(:last-child) {
    padding-bottom: 16px;
    border-bottom: 1px solid #F6F6F6;
  }
  html[data-theme="dark"] .TopicHotIntroItem-item:not(:last-child) {
    border-bottom: 1px solid #2E2E2E;
}

.TopicHotIntroItem-images {
  margin-top: 8px;
}

.TopicHotIntroItem-imagesLength {
  color: #8590A6;
  font-size: 15px;
  margin-left: 10px;
}

html[data-theme="dark"] .TopicHotIntroItem-imagesLength {
  color: #606A80;
}
.TopicHot-introItem {
  margin-bottom: 12px;
  line-height: 1.6;
  display: -webkit-box;
  text-overflow: ellipsis;
  overflow: hidden;
  -webkit-line-clamp: 2;
  /* autoprefixer: ignore next */
  -webkit-box-orient: vertical;
}

  .TopicHot-introItem:last-of-type {
    -webkit-line-clamp: 1;
  }
.ImageUploader {
  position: relative;
  color: #fff;
}

.ImageUploader-main {
  position: absolute;
  top: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background: rgba(133, 144, 166, 0.2);
  width: 100%;
  height: 100%;
  background-color: rgba(133, 144, 166, 0.1);
  opacity: 0;
  cursor: pointer;
  transition: opacity 200ms;
}

.ImageUploader-main:hover,
  .ImageUploader-main.is-masked {
    opacity: 1;
  }

html[data-theme="dark"] .ImageUploader-main {
  background: rgba(96, 106, 128, 0.2);
}

html[data-theme="dark"] .ImageUploader-main {
  background-color: rgba(96, 106, 128, 0.1);
}

.ImageUploader-placeholder {
  margin-top: 8px;
}

.ImageUploader--spread {
  width: 100%;
  height: 100%;
}

.ImageUploader-image {
  position: absolute;
  width: 100%;
  height: 100%;
}
.TopicEditFieldImage {
  width: 100%;
  padding-bottom: 56%;
  border-radius: 4px;
  color: #0084FF;
  overflow: hidden;
}
  html[data-theme="dark"] .TopicEditFieldImage {
  color: #3A76D0;
}

.TopicEditFieldImage--isArray {
  width: 100%;
  padding-bottom: 100%;
}
.TopicEditArray {
  font-size: 15px;
  color: #1A1A1A;
  line-height: normal;
  line-height: initial;
}
  html[data-theme="dark"] .TopicEditArray {
  color: #999999;
}

.TopicEditArray-item {
  position: relative;
}

.TopicEditArray-item--line {
    display: flex;
    justify-content: space-between;
    border-radius: 4px;

    margin-top: 16px;
  }

.TopicEditArray-item--line:hover {
      background-color: #F6F6F6;
    }

.TopicEditArray-item--line:hover .TopicEditArray-closeButton .Zi {
        fill: #646464;
      }

html[data-theme="dark"] .TopicEditArray-item--line:hover .TopicEditArray-closeButton .Zi {
        fill: #999999;
}

html[data-theme="dark"] .TopicEditArray-item--line:hover {
      background-color: #2E2E2E;
}

.TopicEditArray-item--line + .TopicEditArray-item--line {
      margin-top: 0;
    }

.TopicEditArray-item--block {
    position: relative;
    border-radius: 4px;
    overflow: hidden;
  }

.TopicEditArray-item--block:after {
      content: '';
      background-color: rgba(26, 26, 26, 0.3);
      position: absolute;
      top: 0;
      bottom: 0;
      left: 0;
      right: 0;
    }

html[data-theme="dark"] .TopicEditArray-item--block:after {
      background-color: rgba(153, 153, 153, 0.3);
}

.TopicEditArray-item--block .TopicEditArray-closeButton {
      position: absolute;
      top: 0;
      right: 0;
      z-index: 1;
    }

.TopicEditArray-item--block .TopicEditArray-closeButton .Zi {
        fill: #fff;
      }

.TopicEditArray-item--block .TopicEditArray-closeButton,
    .TopicEditArray-item--block:after {
      opacity: 0;
      transition: opacity 200ms;
    }

.TopicEditArray-item--block:hover .TopicEditArray-closeButton,
      .TopicEditArray-item--block:hover:after {
        opacity: 1;
      }

.TopicEditArray-closeButton {
  padding: 8px;
}

.TopicEditArray-input {
  padding: 0 10px;
}

.TopicEditArray-input .Popover {
    width: 100%;
  }
.TopicEditItem-formActions {
  margin-top: 16px;
}

  .TopicEditItem-formActions .Button + .Button {
    margin-left: 16px;
  }

.TopicEditItem-displayActions {
  display: inline-block;
  margin-left: 8px;
}

.TopicCommonArray + .TopicEditItem-displayActions {
  margin-left: 0;
}

.TopicCommonArray--image + .TopicEditItem-displayActions {
  margin-top: 16px;
}
.TopicEditTable-item {
  display: flex;
}

  .TopicEditTable-item:not(:last-child) .TopicEditTable-value {
    border-bottom: 0.5px solid #D3D3D3;
  }

  html[data-hairline] .TopicEditTable-item:not(:last-child) .TopicEditTable-value {
    border-bottom: 1px solid #D3D3D3;
    -o-border-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='1' height='1'> <rect x='0' y='.5' width='1' height='.5' fill='#d3d3d3'/> </svg>")
      0 0 1 0;
       border-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='1' height='1'> <rect x='0' y='.5' width='1' height='.5' fill='#d3d3d3'/> </svg>")
      0 0 1 0;
  }

  html[data-theme="dark"] html[data-hairline] .TopicEditTable-item:not(:last-child) .TopicEditTable-value {
    border-bottom: 1px solid #2E2E2E;
}

  html[data-theme="dark"] .TopicEditTable-item:not(:last-child) .TopicEditTable-value {
    border-bottom: 0.5px solid #2E2E2E;
}

.TopicEditTable-name {
  padding: 16px 0;
  min-width: 140px;
  line-height: 36px;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
}

html[data-ios] .TopicEditTable-name {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .TopicEditTable-name {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

.TopicEditTable-value {
  padding: 16px 0;
  line-height: 36px;
  flex: 1;
}

.TopicEditTable-value .TopicCommonArray--topic,
  .TopicEditTable-value .TopicEditArray--topic {
    margin: 0 -10px;
  }

.TopicEditTable-value .TopicCommonField-topic {
    padding: 0 10px;
  }
.TopicEditModuleUI {
  padding-top: 8px;
  padding-bottom: 24px;
}

  .TopicEditModuleUI:not(:last-child) {
    border-bottom: 0.5px solid #D3D3D3;
  }

  html[data-hairline] .TopicEditModuleUI:not(:last-child) {
    border-bottom: 1px solid #D3D3D3;
    -o-border-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='1' height='1'> <rect x='0' y='.5' width='1' height='.5' fill='#d3d3d3'/> </svg>")
      0 0 1 0;
       border-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='1' height='1'> <rect x='0' y='.5' width='1' height='.5' fill='#d3d3d3'/> </svg>")
      0 0 1 0;
  }

  html[data-theme="dark"] html[data-hairline] .TopicEditModuleUI:not(:last-child) {
    border-bottom: 1px solid #2E2E2E;
}

  html[data-theme="dark"] .TopicEditModuleUI:not(:last-child) {
    border-bottom: 0.5px solid #2E2E2E;
}

.TopicEditModuleUI-title {
  font-size: 16px;
  font-weight: 600;
  padding: 16px 0;
}
.TopicEditAvatar {
  width: 180px;
  height: 270px;
  border-radius: 4px;
  overflow: hidden;
}

.TopicEditAvatar--rectangle {
  width: 180px;
  height: 270px;
}

.TopicEditAvatar--square {
  width: 180px;
  height: 180px;
}
.TopicEdit {
  max-width: 1000px;
  margin: 10px auto 40px;
  padding: 24px 40px;
  margin-bottom: 40px !important;
}

.TopicEdit-header {
  display: flex;
  align-items: baseline;
  padding: 16px 0;
}

.TopicEdit-main {
  display: flex;
}

.TopicEdit-side {
  padding-top: 24px;
}

.TopicEdit-modules {
  border-top: 0.5px solid #D3D3D3;
  width: 690px;
  margin-right: 50px;
}

html[data-hairline] .TopicEdit-modules {
    border-top: 1px solid #D3D3D3;
    -o-border-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='1' height='1'> <rect x='0' y='0' width='1' height='.5' fill='#d3d3d3'/> </svg>")
      1 0 0 0;
       border-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='1' height='1'> <rect x='0' y='0' width='1' height='.5' fill='#d3d3d3'/> </svg>")
      1 0 0 0;
  }

html[data-theme="dark"] html[data-hairline] .TopicEdit-modules {
    border-top: 1px solid #2E2E2E;
}

html[data-theme="dark"] .TopicEdit-modules {
  border-top: 0.5px solid #2E2E2E;
}

.TopicEdit-headerTitle {
  margin-right: 24px;
  font-size: 26px;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
}

html[data-ios] .TopicEdit-headerTitle {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .TopicEdit-headerTitle {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

.TopicEdit-submit {
  width: 120px;
  letter-spacing: 4px;
}
.TopicImage-container {
  width: 1000px;
  margin: 10px auto 0;
  display: flex;
  justify-content: space-between;
}

.TopicImageMain-container {
  width: 694px;
  display: flex;
  flex-direction: column;
}

.TopicImageMain-backBar {
  line-height: 50px;
  color: #8590A6;
  text-align: center;
}

.TopicImageMain-backBar:hover {
    color: #175199;
  }

html[data-theme="dark"] .TopicImageMain-backBar:hover {
    color: #175199;
}

html[data-theme="dark"] .TopicImageMain-backBar {
  color: #606A80;
}

.TopicImageMain-imageListWrapper {
  padding: 20px;
}

.TopicImageMain-imageListLength {
  color: #8590A6;
  font-size: 15px;
  margin-left: 10px;
}

html[data-theme="dark"] .TopicImageMain-imageListLength {
  color: #606A80;
}

.TopicImageMain-imageList {
  margin-top: 20px;
}

.TopicImageSidebar-container {
  width: 296px;
}

.TopicImageSidebar-content {
  display: flex;
  height: 78px;
  padding: 16px;
  box-sizing: border-box;
}

.TopicImageSidebar-content > img {
    width: 40px;
    margin-right: 8px;
    border-radius: 4px;
  }

.TopicImageSidebar-content:not(:last-child) {
    border-bottom: 1px solid #F6F6F6;
  }

html[data-theme="dark"] .TopicImageSidebar-content:not(:last-child) {
    border-bottom: 1px solid #2E2E2E;
}

.TopicImageSidebar-contentTitle {
  font-size: 15px;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
}

html[data-ios] .TopicImageSidebar-contentTitle {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .TopicImageSidebar-contentTitle {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

.TopicImageSidebar-contentStatus {
  display: flex;
  font-size: 14px;
  margin-top: 3px;
  color: #8590A6;
}

html[data-theme="dark"] .TopicImageSidebar-contentStatus {
  color: #606A80;
}
.TopicCreatorWall-avatarWithBadge {
  position: relative;
}

.TopicCreatorWall-avatarWithBadgeIcon {
  position: absolute;
  pointer-events: none;
  right: 3px;
  bottom: 3px;
}
.TopicCreatorWall-userModalContentItemExcerpt {
  display: flex;
}

.TopicCreatorWall-userModalContentItemExcerptText {
  font-size: 14px;
  line-height: 20px;
  height: 60px;
  display: -webkit-box;
  text-overflow: ellipsis;
  overflow: hidden;
  -webkit-line-clamp: 3;
  /* autoprefixer: ignore next */
  -webkit-box-orient: vertical;
  color: #444444;
}

html[data-theme="dark"] .TopicCreatorWall-userModalContentItemExcerptText {
  color: #808080;
}

.TopicCreatorWall-userModalContentItemExcerptImg {
  margin-left: 8px;
  line-height: normal;
  height: 60px;
  position: relative;
}

.TopicCreatorWall-userModalContentItemExcerptImgItem {
  width: 90px;
  height: 60px;
  border-radius: 4px;
}

.TopicCreatorWall-userModalContentItemExcerptImgMask {
  width: 90px;
  height: 60px;
  border-radius: 4px;
  position: absolute;
  left: 0;
  top: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

.TopicCreatorWall-userModalContentItemExcerptImgMaskRound {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  background: rgba(26, 26, 26, 0.2);
  border: 2px solid #FFFFFF;
  border-radius: 50%;
}

html[data-theme="dark"] .TopicCreatorWall-userModalContentItemExcerptImgMaskRound {
  background: rgba(153, 153, 153, 0.2);
}

html[data-theme="dark"] .TopicCreatorWall-userModalContentItemExcerptImgMaskRound {
  border: 2px solid #1A1A1A;
}

.TopicCreatorWall-userModalContentItemExcerptImgMaskIcon {
  color: #FFFFFF;
}

html[data-theme="dark"] .TopicCreatorWall-userModalContentItemExcerptImgMaskIcon {
  color: #1A1A1A;
}
.TopicCreatorWall-userModalWrapper {
  width: 400px;
  box-sizing: border-box;
}

.TopicCreatorWall-userModalHeader {
  width: 100%;
  display: flex;
  margin-bottom: 24px;
}

.TopicCreatorWall-userModalAvatarIcon {
  right: 2px;
  bottom: -4px;
}

.TopicCreatorWall-userModalContent {
  display: flex;
  flex-direction: column;
  justify-content: center;
  margin-left: 12px;
}

.TopicCreatorWall-userModalName {
  font-size: 18px;
  font-weight: 500;
}

.TopicCreatorWall-userModalHeadline {
  font-size: 14px;
  line-height: 20px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 280px;
}

.TopicCreatorWall-userModalName + .TopicCreatorWall-userModalHeadline {
    margin-top: 2px;
  }

.TopicCreatorWall-userModalCountSection {
  display: flex;
  flex-direction: column;
  margin-bottom: 20px;
}

.TopicCreatorWall-userModalCountSectionTitle {
  font-size: 14px;
  line-height: 20px;
  color: #999999;
  margin-bottom: 20px;
}

html[data-theme="dark"] .TopicCreatorWall-userModalCountSectionTitle {
  color: #646464;
}

.TopicCreatorWall-userModalCountSectionData {
  display: flex;
}

.TopicCreatorWall-userModalCountSectionDataItem {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
}

.TopicCreatorWall-userModalCountSectionDataItemTitle {
  font-size: 12px;
  line-height: 14px;
  margin-bottom: 1px;
  color: #999999;
}

html[data-theme="dark"] .TopicCreatorWall-userModalCountSectionDataItemTitle {
  color: #646464;
}

.TopicCreatorWall-userModalCountSectionDataItemData {
  font-family: Avenir;
  font-size: 28px;
  line-height: 34px;
}

.TopicCreatorWall-userModalContentList {
  display: flex;
  flex-direction: column;
  margin-bottom: 24px;
}

.TopicCreatorWall-userModalContentListTitle {
  font-size: 12px;
  line-height: 14px;
  color: #999999;
  margin-bottom: 16px;
}

html[data-theme="dark"] .TopicCreatorWall-userModalContentListTitle {
  color: #646464;
}

.TopicCreatorWall-userModalContentItemTitle {
  display: -webkit-box;
  text-overflow: ellipsis;
  overflow: hidden;
  -webkit-line-clamp: 1;
  /* autoprefixer: ignore next */
  -webkit-box-orient: vertical;
  font-size: 16px;
  line-height: 18px;
  margin-bottom: 12px;
  font-weight: 500;
}

.TopicCreatorWall-userModalAllCreation {
  display: flex;
  align-items: center;
  font-size: 14px;
  line-height: 18px;
  color: #8590A6;
  margin-bottom: 28px;
}

html[data-theme="dark"] .TopicCreatorWall-userModalAllCreation {
  color: #606A80;
}

.TopicCreatorWall-userModalFollowButton {
  display: flex;
  justify-content: center;
  margin: 0 auto;
  width: 272px;
  height: 35px;
  border-radius: 17px;
}

.TopicCreatorWall-userModalFollowButton span {
    display: none !important;
  }
.TopicCreatorWall-userCardContainer {
  width: 238px;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 16px 12px 24px;
  border-radius: 8px;
  cursor: pointer;
}

.TopicCreatorWall-userCardAvatar {
  right: 4px;
  bottom: 4px;
}

.TopicCreatorWall-userCardName {
  margin-top: 12px;
  font-size: 17px;
  font-weight: 500;
}

.TopicCreatorWall-userCardHeadline {
  text-align: center;
  font-size: 14px;
  margin-top: 8px;
}

.TopicCreatorWall-userCardUpVoteCount {
  margin-top: 10px;
  font-size: 12px;
  color: #999999;
}

html[data-theme="dark"] .TopicCreatorWall-userCardUpVoteCount {
  color: #646464;
}

.TopicCreatorWall-userCardFirst {
  margin-top: 10px;
  font-size: 12px;
  color: #03A9F4;
}

html[data-theme="dark"] .TopicCreatorWall-userCardFirst {
  color: #03A9F4;
}
.topicCreatorWall-list {
  width: 1000px;
  display: flex;
  justify-content: space-between;
}

.topicCreatorWall-listPlaceHolder {
  margin: 40px auto;
}
.topicCreatorWall-HeaderWrapper {
  width: 100%;
  height: 136px;
}

.topicCreatorWall-Header {
  width: 1000px;
  height: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin: 0 auto;
}

.topicCreatorWall-HeaderTitle {
  font-size: 26px;
  margin-bottom: 12px;
  font-weight: 600;
}

.topicCreatorWall-HeaderUpdateHint {
  font-size: 18px;
  color: #8590A6;
}

html[data-theme="dark"] .topicCreatorWall-HeaderUpdateHint {
  color: #606A80;
}

.topicCreatorWall-TopicInfo {
  display: flex;
  height: 48px;
}

.topicCreatorWall-TopicImg {
  border-radius: 4px;
  margin-left: 4px;
}

.topicCreatorWall-TopicDescription {
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: flex-end;
}

.topicCreatorWall-TopicName {
  font-size: 16px;
  font-weight: 600;
}

.topicCreatorWall-TopicDetail {
  color: #999999;
}

html[data-theme="dark"] .topicCreatorWall-TopicDetail {
  color: #646464;
}

.topicCreatorWall-list {
  width: 1000px;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  margin: 0 auto;
}
.SettingsFooter {
  color: #8590A6;
  box-sizing: border-box;
  display: flex;
  flex-shrink: 0;
  flex-direction: row;
  font-size: 13px;
  justify-content: space-between;
  margin-bottom: 24px;
  padding: 8px 8px 0 4px;
  width: 724px;
}
  html[data-theme="dark"] .SettingsFooter {
  color: #606A80;
}

.SettingsFooter-dot {
  margin: 0 2px;
}
.SettingsNav {
  height: 100%;
  width: 162px;
}

.SettingsNav-link {
  align-items: center;
  color: #8590A6;
  display: flex;
  height: 50px;
  overflow: hidden;
  padding-left: 28px;
}

.SettingsNav-link:hover {
    background: rgba(133, 144, 166, 0.08);
  }

.SettingsNav-link:hover svg {
      fill: #8590A6;
    }

html[data-theme="dark"] .SettingsNav-link:hover svg {
      fill: #606A80;
}

html[data-theme="dark"] .SettingsNav-link:hover {
    background: rgba(96, 106, 128, 0.08);
}

.SettingsNav-link.is-active {
    background: rgba(133, 144, 166, 0.08);
    color: #444444;
    font-weight: 600;
  }

.SettingsNav-link.is-active svg {
      fill: #444444;
    }

html[data-theme="dark"] .SettingsNav-link.is-active svg {
      fill: #808080;
}

html[data-theme="dark"] .SettingsNav-link.is-active {
    background: rgba(96, 106, 128, 0.08);
}

html[data-theme="dark"] .SettingsNav-link.is-active {
    color: #808080;
}

html[data-theme="dark"] .SettingsNav-link {
  color: #606A80;
}

.SettingsNav-linkTxt {
  flex: 1;
  margin: 12px;
}
.SettingsQA {
  font-size: 14px;
  margin: 0;
  padding: 10px 20px;
}

  .SettingsQA.is-expanded {
    background: rgba(133, 144, 166, 0.08);
  }

  html[data-theme="dark"] .SettingsQA.is-expanded {
    background: rgba(96, 106, 128, 0.08);
}

  .SettingsQA dt {
    color: #8590A6;
    cursor: pointer;
    line-height: 1.5;
    font-weight: 400;
  }

  .SettingsQA dt:hover {
      color: #0084FF;
    }

  html[data-theme="dark"] .SettingsQA dt:hover {
      color: #3A76D0;
}

  html[data-theme="dark"] .SettingsQA dt {
    color: #606A80;
}

  .SettingsQA dd {
    line-height: 1.7;
  }

  .SettingsQA a {
    color: #175199;
    cursor: pointer;
    padding-left: 6px;
  }

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

@-webkit-keyframes blinkSettingsQAColor {
  0% {
    color: #0084FF;
  }
    html[data-theme="dark"] 0% {
    color: #3A76D0;
  }
  25% {
    color: #8590A6;
  }
    html[data-theme="dark"] 25% {
    color: #606A80;
  }
  50% {
    color: #0084FF;
  }
    html[data-theme="dark"] 50% {
    color: #3A76D0;
  }
  75% {
    color: #8590A6;
  }
    html[data-theme="dark"] 75% {
    color: #606A80;
  }
  100% {
    color: #0084FF;
  }
    html[data-theme="dark"] 100% {
    color: #3A76D0;
  }
}

@keyframes blinkSettingsQAColor {
  0% {
    color: #0084FF;
  }
    html[data-theme="dark"] 0% {
    color: #3A76D0;
  }
  25% {
    color: #8590A6;
  }
    html[data-theme="dark"] 25% {
    color: #606A80;
  }
  50% {
    color: #0084FF;
  }
    html[data-theme="dark"] 50% {
    color: #3A76D0;
  }
  75% {
    color: #8590A6;
  }
    html[data-theme="dark"] 75% {
    color: #606A80;
  }
  100% {
    color: #0084FF;
  }
    html[data-theme="dark"] 100% {
    color: #3A76D0;
  }
}

.SettingsQA--blink dt {
    color: #0084FF;
    -webkit-animation: blinkSettingsQAColor 1s ease-in 0.4s;
            animation: blinkSettingsQAColor 1s ease-in 0.4s;
  }

html[data-theme="dark"] .SettingsQA--blink dt {
    color: #3A76D0;
}

.SettingsQA-answer {
  color: #646464;
  display: none;
  margin-left: 0;
  padding: 10px 0;
}

.SettingsQA-answer.is-expanded {
    display: block;
  }

.SettingsQA-answer .faq-dot {
    background: #D3D3D3;
    border-radius: 50%;
    display: inline-block;
    height: 6px;
    position: relative;
    top: -2px;
    width: 6px;
  }

html[data-theme="dark"] .SettingsQA-answer .faq-dot {
    background: #2E2E2E;
}

html[data-theme="dark"] .SettingsQA-answer {
  color: #999999;
}
.SettingsFAQ {
  background: #FFFFFF;
  border: 1px solid #EBEBEB;
  border-radius: 2px;
  /* 无 cc 色值 */
  box-shadow: 0 0 4px rgba(3, 4, 18, 0.08);
  padding: 20px 0;
  width: 264px;
}
  html[data-theme="dark"] .SettingsFAQ {
  background: #1A1A1A;
}
  html[data-theme="dark"] .SettingsFAQ {
  border: 1px solid #444444;
}

.SettingsFAQ-pageTitle {
  color: #1A1A1A;
  display: flex;
  font-size: 19px;
  font-weight: 600;
  justify-content: space-between;
  height: 26px;
  line-height: 26px;
  padding-left: 20px;
}

html[data-theme="dark"] .SettingsFAQ-pageTitle {
  color: #999999;
}

.SettingsFAQ-toggle {
  height: 16px;
  margin: 2px 20px 0 0;
}

.SettingsFAQ-section {
  overflow: hidden;
}

.SettingsFAQ-faqTitle {
  color: #444444;
  font-size: 15px;
  font-weight: 600;
  height: 16px;
  line-height: 16px;
  margin: 10px 0;
  padding-left: 20px;
}

html[data-theme="dark"] .SettingsFAQ-faqTitle {
  color: #808080;
}

.SettingsFAQ-sectionWrap {
  padding: 10px 0;
}

.SettingsFAQ-sectionWrap.is-fixed {
    height: 284px;
    overflow-y: auto;
  }

.SettingsFAQ-sectionWrap.is-collapsed {
    display: none;
  }
.SettingsMain {
  margin: 12px auto;
  width: 1000px;
}

  /* iPad portrait */

  @media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {.SettingsMain {
    overflow-x: hidden;
    width: 724px
}
  }

.SettingsMain-layout {
  align-items: flex-start;
  display: flex;
}

.SettingsMain-mainColumn {
  background: #FFFFFF;
  border: 1px solid #EBEBEB;
  border-radius: 3px;
  /* 无 cc 色值 */
  box-shadow: 0 0 4px rgba(6, 10, 29, 0.04);
  display: flex;
  margin-right: 12px;
  width: 724px;
}

html[data-theme="dark"] .SettingsMain-mainColumn {
  background: #1A1A1A;
}

html[data-theme="dark"] .SettingsMain-mainColumn {
  border: 1px solid #444444;
}

.SettingsMain-sideColumn {
  flex: 1;
}

/* iPad portrait */

@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {

.SettingsMain-sideColumn {
    flex: none;
    bottom: 0;
    position: fixed;
    right: 26px;
    z-index: 10
}
  }

.SettingsMain-page {
  border-left: 1px solid #EBEBEB;
  flex: 1;
}

html[data-theme="dark"] .SettingsMain-page {
  border-left: 1px solid #444444;
}

.SettingsAlert {
  color: #1A1A1A;
  font-size: 14px;
  line-height: 1.5;
  text-align: center;
}

.SettingsAlert h2 {
    font-size: 24px;
    font-weight: 600;
    margin: 16px auto 24px;
  }

html[data-theme="dark"] .SettingsAlert {
  color: #999999;
}

/* iPad portrait overwrite AppHeader */
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
  .AppHeader {
    min-width: auto;
  }

  .AppHeader-inner {
    background: #FFFFFF;
    box-sizing: border-box;
    overflow-x: hidden;
    padding: 0 8px;
    width: 768px;
  }
    html[data-theme="dark"] .AppHeader-inner {
    background: #1A1A1A;
  }

  .SearchBar-toolWrapper,
  .SearchBar-input {
    width: auto;
  }
}
.SettingsTitle {
  overflow: hidden;
  padding: 20px 18px 20px;
}

.SettingsTitle-title {
  color: #1A1A1A;
  font-size: 19px;
  font-weight: 600;
  height: 26px;
  line-height: 26px;
  margin-bottom: 9px;
}

html[data-theme="dark"] .SettingsTitle-title {
  color: #999999;
}

.SettingsTitle-subTitle {
  color: #1A1A1A;
  font-size: 15px;
  font-weight: 600;
  height: 21px;
  line-height: 21px;
  margin: 0 0 5px 0;
}

html[data-theme="dark"] .SettingsTitle-subTitle {
  color: #999999;
}

.SettingsTitle-descr {
  color: #8590A6;
  font-size: 14px;
  line-height: 1.5;
}

html[data-theme="dark"] .SettingsTitle-descr {
  color: #606A80;
}
.ExpandableField {
  background: #FFFFFF;
}

  .ExpandableField.is-expanded {
    background: rgba(133, 144, 166, 0.08);
  }

  html[data-theme="dark"] .ExpandableField.is-expanded {
    background: rgba(96, 106, 128, 0.08);
}

  html[data-theme="dark"] .ExpandableField {
  background: #1A1A1A;
}

.ExpandableField--default {
  padding-left: 18px;
}

.ExpandableField--narrow {
  padding-left: 38px;
}

.ExpandableField--narrow .ExpandableField-titleView {
    padding: 10px 0;
  }

.ExpandableField--narrow .ExpandableField-title {
    font-weight: 400;
  }

.ExpandableField-titleView {
  overflow: hidden;
  padding: 20px 0;
  position: relative;
}

.ExpandableField-titleView--bordered {
    border-top: 1px solid #EBEBEB;
  }

html[data-theme="dark"] .ExpandableField-titleView--bordered {
    border-top: 1px solid #444444;
}

.ExpandableField-title {
  color: #1A1A1A;
  font-size: 15px;
  height: 21px;
  line-height: 21px;
  margin: 0;
  padding-bottom: 4px;
}

html[data-theme="dark"] .ExpandableField-title {
  color: #999999;
}

.ExpandableField-descr {
  color: #8590A6;
  font-size: 14px;
  line-height: 1.5;
}

.ExpandableField-descr > div {
    padding-top: 4px;
  }

html[data-theme="dark"] .ExpandableField-descr {
  color: #606A80;
}

.ExpandableField-edit {
  color: #0084FF;
  display: inline-block;
  font-size: 15px;
  height: 21px;
  line-height: 21px;
  text-decoration: none;
  position: absolute;
  right: 20px;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  z-index: 1;
}

.ExpandableField-edit:disabled,
  .ExpandableField-edit:hover:disabled {
    cursor: not-allowed;
    color: #0084FF;
  }

html[data-theme="dark"] .ExpandableField-edit:disabled, html[data-theme="dark"] .ExpandableField-edit:hover:disabled {
    color: #3A76D0;
}

html[data-theme="dark"] .ExpandableField-edit {
  color: #3A76D0;
}

.ExpandableField-content {
  border-top: 1px solid #EBEBEB;
  display: none;
  padding: 10px 0;
}

.ExpandableField-content.is-expanded {
    display: block;
  }

html[data-theme="dark"] .ExpandableField-content {
  border-top: 1px solid #444444;
}
.AccountPassword {
  overflow: hidden;
  padding-bottom: 10px;
}

.AccountPassword-inputWrap {
  display: flex;
}

.AccountPassword-input,
.AccountPassword-submit {
  height: 40px;
  width: 300px;
}

.AccountPassword-input {
  margin-bottom: 12px;
}

.AccountPassword-input .Input {
    height: 32px;
    line-height: 32px;
  }

.AccountPassword-input .Input--validationError {
    color: #F1403C;
  }

html[data-theme="dark"] .AccountPassword-input .Input--validationError {
    color: #B7302D;
}

.AccountPassword-hint {
  color: #999999;
  flex: 1;
  font-size: 14px;
  padding: 10px 10px 0;
}

html[data-theme="dark"] .AccountPassword-hint {
  color: #646464;
}
.AccountPhone {
  overflow: hidden;
  padding-bottom: 10px;
}

.AccountPhone-inputWrap {
  display: flex;
}

.AccountPhone-input,
.AccountPhone-submit,
.AccountPhone-btnCode {
  height: 40px;
}

.AccountPhone-input {
  margin-bottom: 12px;
}

.AccountPhone-input .Input {
    height: 32px;
    line-height: 32px;
  }

.AccountPhone-input .Input--validationError {
    color: #F1403C;
  }

html[data-theme="dark"] .AccountPhone-input .Input--validationError {
    color: #B7302D;
}

.AccountPhone-inputPhone {
  width: 230px;
}

.AccountPhone-inputCode {
  margin-right: 10px;
  width: 182px;
}

.AccountPhone-btnCode {
  background: rgba(0, 132, 255, 0.08);
  border: 0 none;
  color: #0084FF;
  padding-left: 0;
  padding-right: 0;
  width: 106px;
}

html[data-theme="dark"] .AccountPhone-btnCode {
  background: rgba(58, 118, 208, 0.08);
}

html[data-theme="dark"] .AccountPhone-btnCode {
  color: #3A76D0;
}

.AccountPhone-hint {
  color: #999999;
  flex: 1;
  font-size: 14px;
  padding: 10px 10px 0;
}

html[data-theme="dark"] .AccountPhone-hint {
  color: #646464;
}

.AccountPhone-submit {
  width: 300px;
}

.AccountPhone-selectWrap {
  background: #FFFFFF;
  border: 1px solid #EBEBEB;
  border-radius: 3px;
  box-sizing: border-box;
  color: #444444;
  height: 40px;
  margin-right: 10px;
  width: 60px;
}

.AccountPhone-selectWrap .Select-button {
    text-align: center;
  }

html[data-theme="dark"] .AccountPhone-selectWrap {
  background: #1A1A1A;
}

html[data-theme="dark"] .AccountPhone-selectWrap {
  border: 1px solid #444444;
}

html[data-theme="dark"] .AccountPhone-selectWrap {
  color: #808080;
}

.AccountPhone-supportedCountriesList {
  z-index: 99;
}

.AccountPhone-supportedCountriesList .Select-option {
    color: #8590A6;
  }

html[data-theme="dark"] .AccountPhone-supportedCountriesList .Select-option {
    color: #606A80;
}
.AccountEmail {
  overflow: hidden;
  padding-bottom: 10px;
}

.AccountEmail-inputWrap {
  display: flex;
  align-items: center;
  margin-bottom: 12px;
}

.AccountEmail-label {
  color: #444444;
  font-size: 15px;
  padding-right: 6px;
}

html[data-theme="dark"] .AccountEmail-label {
  color: #808080;
}

.AccountEmail-btn,
.AccountEmail-submit {
  padding: 0;
}

.AccountEmail-btn {
  background: rgba(0, 132, 255, 0.08);
  border: 0 none;
  color: #0084FF;
  height: 34px;
  line-height: 34px;
  margin-left: 10px;
  width: 106px;
}

.AccountEmail-btn--large {
    height: 40px;
    line-height: 40px;
  }

html[data-theme="dark"] .AccountEmail-btn {
  background: rgba(58, 118, 208, 0.08);
}

html[data-theme="dark"] .AccountEmail-btn {
  color: #3A76D0;
}

.AccountEmail-btnActive {
  box-sizing: border-box;
  margin-left: 10px;
  min-width: 58px;
  padding: 0 4px;
}

.AccountEmail-btnActive.is-counting {
    color: #FFFFFF;
  }

html[data-theme="dark"] .AccountEmail-btnActive.is-counting {
    color: #1A1A1A;
}

.AccountEmail-submit {
  height: 40px;
  line-height: 40px;
  width: 300px;
}

.AccountEmail-input {
  height: 40px;
  padding-top: 7px;
  padding-bottom: 7px;
  width: 300px;
}

.AccountEmail-input .Input--validationError {
    color: #F1403C;
  }

html[data-theme="dark"] .AccountEmail-input .Input--validationError {
    color: #B7302D;
}

.AccountEmail-vcodeInput {
  width: 184px;
}
.AccountSocial {
  border-top: 1px solid #EBEBEB;
  margin-left: 38px;
  padding: 16px 0 18px;
}

  .AccountSocial > h4 {
    color: #444444;
    font-weight: 400;
    height: 21px;
    line-height: 21px;
    margin: 0;
  }

  html[data-theme="dark"] .AccountSocial > h4 {
    color: #808080;
}

  html[data-theme="dark"] .AccountSocial {
  border-top: 1px solid #444444;
}

.AccountSocial-wrap {
  padding-top: 14px;
  display: flex;
  align-items: center;
}

.AccountSocial-account {
  padding-right: 18px;
  font-size: 15px;
  display: flex;
  align-items: center;
}

.AccountSocial-account a {
    cursor: pointer;
  }

.AccountSocial-ico {
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 26px;
  line-height: 26px;
  text-align: center;
  width: 26px;
}

.AccountSocial-icoWeChat {
  background: #6cda49;
}

.AccountSocial-icoWeibo {
  background: #ff6d4a;
}

.AccountSocial-icoWeibo path {
    fill: #FFFFFF;
  }

html[data-theme="dark"] .AccountSocial-icoWeibo path {
    fill: #1A1A1A;
}

.AccountSocial-icoQQ {
  background: #50c8fd;
}

.AccountSocial-unbind,
.AccountSocial-bind {
  font-size: 15px;
}

.AccountSocial-name {
  box-sizing: border-box;
  color: #444444;
  height: 21px;
  line-height: 21px;
  overflow: hidden;
  padding-left: 8px;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 130px;
}

html[data-theme="dark"] .AccountSocial-name {
  color: #808080;
}

.AccountSocial-unbind {
  color: #8590A6;
  text-align: left;
}

html[data-theme="dark"] .AccountSocial-unbind {
  color: #606A80;
}

.AccountSocial-bind {
  color: #0084FF;
  padding: 0 16px 0 6px;
}

html[data-theme="dark"] .AccountSocial-bind {
  color: #3A76D0;
}

.AccountSocial-deletionNotices {
  list-style-type: disc;
  margin-left: 40px;
  padding: 4px 0;
  text-align: left;
}
.PersonalUrl-form {
  display: flex;
  align-items: center;
}

.PersonalUrl-label {
  color: #8590A6;
  font-size: 14px;
}

html[data-theme="dark"] .PersonalUrl-label {
  color: #606A80;
}

.PersonalUrl-input,
.PersonalUrl-button {
  height: 40px;
}

.PersonalUrl-input {
  margin: 0 14px 0 12px;
  width: 195px;
}

.PersonalUrl-input input.Input {
    height: 32px;
    line-height: 32px;
  }

.PersonalUrl-button {
  width: 70px;
}

.PersonalUrl-lockedView {
  color: #8590A6;
  display: flex;
  align-items: center;
  font-size: 14px;
  padding: 18px 0;
}

html[data-theme="dark"] .PersonalUrl-lockedView {
  color: #606A80;
}

.PersonalUrl-disableEdit {
  color: #999999;
  height: 20px;
  line-height: 20px;
  padding-left: 14px;
}

html[data-theme="dark"] .PersonalUrl-disableEdit {
  color: #646464;
}
.SettingsAccount {
  padding-bottom: 40px;
}

.SettingsAccount-account,
.SettingsAccount-personalUrl {
  border-top: 1px solid #EBEBEB;
}

html[data-theme="dark"] .SettingsAccount-account, html[data-theme="dark"] .SettingsAccount-personalUrl {
  border-top: 1px solid #444444;
}

.SettingsAccount-personalUrl {
  border-bottom: 1px solid #EBEBEB;
}

html[data-theme="dark"] .SettingsAccount-personalUrl {
  border-bottom: 1px solid #444444;
}

.SettingsAccount-accountForm .AccountForm-passwordDescrWarn {
    align-items: center;
    background: rgba(241, 64, 60, 0.1);
    border-radius: 4px;
    box-sizing: border-box;
    color: #F1403C;
    display: flex;
    font-size: 14px;
    height: 40px;
    line-height: 40px;
    padding-top: 0;
    padding-left: 12px;
    width: 364px;
  }

.SettingsAccount-accountForm .AccountForm-passwordDescrWarn svg {
      fill: #F1403C;
      margin-right: 10px;
    }

html[data-theme="dark"] .SettingsAccount-accountForm .AccountForm-passwordDescrWarn svg {
      fill: #B7302D;
}

html[data-theme="dark"] .SettingsAccount-accountForm .AccountForm-passwordDescrWarn {
    background: rgba(183, 48, 45, 0.1);
}

html[data-theme="dark"] .SettingsAccount-accountForm .AccountForm-passwordDescrWarn {
    color: #B7302D;
}
.SelectorField {
  display: flex;
  justify-content: space-between;
  padding: 10px 20px 10px 0;
}

  .SelectorField--separator {
    border-bottom: 1px solid #EBEBEB;
  }

  html[data-theme="dark"] .SelectorField--separator {
    border-bottom: 1px solid #444444;
}

.SelectorField-title h4 {
  color: #1A1A1A;
  font-size: 14px;
  font-weight: 400;
  height: 21px;
  line-height: 21px;
  margin: 0;
}

html[data-theme="dark"] .SelectorField-title h4 {
  color: #999999;
}

.SelectorField-descr {
  color: #8590A6;
  font-size: 14px;
  line-height: 1.5;
  padding-top: 3px;
}

html[data-theme="dark"] .SelectorField-descr {
  color: #606A80;
}

.SelectorField-selectWrap {
  background: #FFFFFF;
  border: 1px solid rgba(133, 144, 166, 0.2);
  border-radius: 3px;
  box-sizing: border-box;
  height: 48px;
  padding: 0 6px 0 14px;
  width: 140px;
}

html[data-theme="dark"] .SelectorField-selectWrap {
  background: #1A1A1A;
}

html[data-theme="dark"] .SelectorField-selectWrap {
  border: 1px solid rgba(96, 106, 128, 0.2);
}

.SelectorField-select {
  width: 100%;
}

.SelectorField-select.is-disabled {
    opacity: 0.5;
  }

.SelectorField-select.is-disabled button {
      cursor: not-allowed;
    }

.SelectorField-select .Select-button {
    display: flex;
    height: 48px;
    justify-content: space-between;
    align-items: center;
    width: 100%;
  }

.SelectorField-select .Select-arrow {
    fill: #808080;
    margin-left: 0;
  }

html[data-theme="dark"] .SelectorField-select .Select-arrow {
    fill: #808080;
}

.SelectorField-options {
  min-width: 140px;
}

.SelectorField-options .Select-option {
    color: #1A1A1A;
    padding: 0;
    text-align: center;
  }

html[data-theme="dark"] .SelectorField-options .Select-option {
    color: #999999;
}

.SelectorField-options .Select-option.is-selected,
  .SelectorField-options .Select-option:focus {
    background: #f4f8fb;
  }

.SelectorField-options .Select-option.is-selected {
    position: relative;
  }

.SelectorField-options .SelectorField-iconCheck {
    left: 16px;
    position: absolute;
    top: 13px;
  }
.SettingsInboxStranger {
  align-items: center;
  background: rgba(255, 255, 255, 0.5);
  border: 1px solid rgba(133, 144, 166, 0.2);
  border-radius: 2px;
  display: flex;
  margin: 0 20px 10px 0;
  padding: 12px 0 10px 16px;
}
  html[data-theme="dark"] .SettingsInboxStranger {
  background: rgba(26, 26, 26, 0.5);
}
  html[data-theme="dark"] .SettingsInboxStranger {
  border: 1px solid rgba(96, 106, 128, 0.2);
}

.SettingsInboxStranger-label {
  font-size: 14px;
  padding-left: 12px;
}

.SettingsInboxStranger-label h3 {
    align-items: center;
    color: #444444;
    display: flex;
    font-weight: 400;
    height: 21px;
    line-height: 21px;
    margin: 0;
  }

html[data-theme="dark"] .SettingsInboxStranger-label h3 {
    color: #808080;
}

.SettingsInboxStranger-label p {
    color: #8590A6;
    margin: 5px 0 0 0;
  }

html[data-theme="dark"] .SettingsInboxStranger-label p {
    color: #606A80;
}

.SettingsInboxStranger-help {
  height: 18px;
  margin-left: 6px;
}
.SettingsInbox {
  border-top: 1px solid #EBEBEB;
}

  .SettingsInbox .ExpandableField-content {
    padding-top: 0;
  }

  html[data-theme="dark"] .SettingsInbox {
  border-top: 1px solid #444444;
}
.SettingsInviteMsg .ExpandableField-content {
    padding-top: 0;
  }
.SettingsVoteUp .ExpandableField-content {
    padding-top: 0;
  }
.SettingsFollow .ExpandableField-content {
    padding-top: 0;
  }

.SettingsFollow-help {
  color: #0084FF;
  margin-left: 6px;
}

html[data-theme="dark"] .SettingsFollow-help {
  color: #3A76D0;
}

.SettingsFollow-questionAnswered .SelectorField-selectWrap {
    width: 178px;
  }

.SettingsFollow-questionAnsweredTarget {
  min-width: 190px;
}
.SettingsNotification {
  padding-bottom: 40px;
}

  .SettingsNotification .ExpandableField {
    padding-left: 0;
  }

  .SettingsNotification .ExpandableField-titleView {
    padding-left: 18px;
  }

  .SettingsNotification .ExpandableField-content {
    margin-left: 40px;
  }

  .SettingsNotification .Settings-checkbox {
    margin: 0;
  }

  .SettingsNotification .Settings-checkbox:checked {
    background: #0084FF;
  }

  html[data-theme="dark"] .SettingsNotification .Settings-checkbox:checked {
    background: #3A76D0;
}
.UserPageItem {
  align-items: center;
  background: rgba(133, 144, 166, 0.08);
  border-radius: 3px;
  box-sizing: border-box;
  display: flex;
  height: 46px;
  overflow: hidden;
  padding: 8px 10px;
  width: 102px;
}

  .UserPageItem .UserPageItem-link {
    align-items: center;
    display: flex;
    text-decoration: none;
  }

  .UserPageItem .UserPageItem-name {
    color: #444444;
    font-size: 14px;
    font-weight: 600;
    height: 21px;
    overflow: hidden;
    padding-left: 10px;
  }

  html[data-theme="dark"] .UserPageItem .UserPageItem-name {
    color: #808080;
}

  .UserPageItem .UserPageItem-unblock {
    color: #8590A6;
  }

  html[data-theme="dark"] .UserPageItem .UserPageItem-unblock {
    color: #606A80;
}

  .UserPageItem--withButton {
    background: #FFFFFF;
    justify-content: space-between;
    height: 60px;
    width: 212px;
  }

  .UserPageItem--withButton .UserPageItem-name {
      padding-left: 14px;
    }

  html[data-theme="dark"] .UserPageItem--withButton {
    background: #1A1A1A;
}

  html[data-theme="dark"] .UserPageItem {
  background: rgba(96, 106, 128, 0.08);
}
.UserPageContent {
  float: left;
  margin-right: 10px;
  min-height: 200px;
  width: 434px;
}

  .UserPageContent .UserPageItem {
    float: left;
    margin-bottom: 10px;
  }

  .UserPageContent .UserPageItem:nth-child(odd) {
      margin-right: 10px;
    }
.UserPage {
  position: relative;
  padding-bottom: 10px;
}

  .UserPage .UserPage-pagerLeft,
  .UserPage .UserPage-pagerRight {
    align-items: center;
    background: #FDFDFD;
    border-radius: 50%;
    display: flex;
    height: 35px;
    justify-content: center;
    line-height: 35px;
    position: absolute;
    top: 84px;
    width: 35px;
  }

  html[data-theme="dark"] .UserPage .UserPage-pagerLeft, html[data-theme="dark"] .UserPage .UserPage-pagerRight {
    background: #2E2E2E;
}

  .UserPage .UserPage-pagerLeft {
    left: 0;
  }

  .UserPage .UserPage-pagerRight {
    right: 0;
  }

  .UserPage footer {
    color: #8590A6;
    font-size: 14px;
    height: 21px;
    line-height: 21px;
    padding-top: 12px;
    text-align: center;
  }

  html[data-theme="dark"] .UserPage footer {
    color: #606A80;
}

.UserPage-content {
  height: 200px;
  margin-left: 50px;
  overflow: hidden;
  width: 434px;
}

.UserPage-contentWindow {
  height: 200px;
  width: 888px;
}
.BlockedUsers {
  border-top: 1px solid #EBEBEB;
  border-bottom: 1px solid #EBEBEB;
}

  .BlockedUsers .ExpandableField-content {
    border-top: 0 none;
    padding-top: 0;
  }

  .BlockedUsers .UserPage {
    margin: 0 10px 0 -6px;
  }

  html[data-theme="dark"] .BlockedUsers {
  border-top: 1px solid #444444;
}

  html[data-theme="dark"] .BlockedUsers {
  border-bottom: 1px solid #444444;
}

.BlockedUsers-descrUsers {
  align-items: center;
  display: flex;
  padding-top: 12px;
}

.BlockedUsers-descrUsers .UserPageItem {
    margin-right: 10px;
  }
.BlockedFollowees {
  border-bottom: 1px solid #EBEBEB;
}

  .BlockedFollowees .ExpandableField-content {
    border-top: 0 none;
    padding-top: 0;
  }

  .BlockedFollowees .UserPage {
    margin: 0 10px 0 -6px;
  }

  html[data-theme="dark"] .BlockedFollowees {
  border-bottom: 1px solid #444444;
}

.BlockedFollowees-descrUsers {
  align-items: center;
  display: flex;
  padding-top: 12px;
}

.BlockedFollowees-descrUsers .UserPageItem {
    margin-right: 10px;
  }
.BlockedTopics {
  border-bottom: 1px solid #EBEBEB;
}

  .BlockedTopics .ExpandableField-content {
    border-top: 0 none;
    padding-top: 0;
  }

  .BlockedTopics .Tag {
    font-size: 13px;
    margin-right: 6px;
  }

  html[data-theme="dark"] .BlockedTopics {
  border-bottom: 1px solid #444444;
}

.BlockedTopics-descr {
  align-items: center;
  display: flex;
  padding-top: 12px;
}

.BlockedTopics-content section {
    border-top: 1px solid #EBEBEB;
    margin-left: 22px;
    padding: 12px;
  }

html[data-theme="dark"] .BlockedTopics-content section {
    border-top: 1px solid #444444;
}

.BlockedTopics-content h4 {
    color: #444444;
    font-size: 15px;
    font-weight: 400;
    height: 21px;
    line-height: 21px;
  }

html[data-theme="dark"] .BlockedTopics-content h4 {
    color: #808080;
}

.BlockedTopics-content .Tag {
    height: 34px;
    line-height: 34px;
    margin-top: 12px;
  }

.BlockedTopics-none {
  color: #8590A6;
  font-size: 14px;
  padding: 18px 0 8px 20px;
}

html[data-theme="dark"] .BlockedTopics-none {
  color: #606A80;
}
.SettingsFilter {
  padding-bottom: 40px;
}

.SettingsFilter-empty {
  color: #8590A6;
  font-size: 14px;
  margin: 0;
  padding: 0 0 20px 40px;
}

html[data-theme="dark"] .SettingsFilter-empty {
  color: #606A80;
}
.Switch {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  position: relative;
  box-sizing: border-box;
  border: 1px solid #EBEBEB;
  display: inline-block;
  width: 48px;
  height: 28px;
  line-height: 28px;
  background-color: #EBEBEB;
  border-radius: 20px;
  transition: all 0.3s cubic-bezier(0.35, 0, 0.25, 1);
  cursor: pointer;
  outline: none;
}

  .Switch::after {
    position: absolute;
    left: 4px;
    top: 3px;
    content: ' ';
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: #FFFFFF;
    box-shadow: 0 1px 3px rgba(26, 26, 26, 0.26);
    transition: left 0.3s cubic-bezier(0.35, 0, 0.25, 1);
  }

  html[data-theme="dark"] .Switch::after {
    background: #EBEBEB;
}

  html[data-theme="dark"] .Switch::after {
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.26);
}

  .Switch:checked {
    background: #0084FF;
  }

  .Switch:checked::after {
      left: 22px;
    }

  html[data-theme="dark"] .Switch:checked {
    background: #3A76D0;
}

  .Switch:disabled {
    cursor: no-drop;
  }

  .Switch:disabled::after {
      background: #D3D3D3;
    }

  html[data-theme="dark"] .Switch:disabled::after {
      background: #444444;
}

  .Switch:disabled.Switch--checked {
      opacity: 0.4;
    }

  html[data-theme="dark"] .Switch {
  border: 1px solid #2E2E2E;
}

  html[data-theme="dark"] .Switch {
  background-color: #2E2E2E;
}
.SettingsPrivacy {
  border-top: 1px solid #EBEBEB;
  border-bottom: 1px solid #EBEBEB;
  margin-bottom: 40px;
}

  .SettingsPrivacy .ExpandableField-content {
    margin-left: 22px;
  }

  html[data-theme="dark"] .SettingsPrivacy {
  border-top: 1px solid #444444;
}

  html[data-theme="dark"] .SettingsPrivacy {
  border-bottom: 1px solid #444444;
}

.SettingPrivacySwitch {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 10px 20px 0 0;
}

.SettingPrivacyContent {
  padding-left: 22px;
}

.SettingPrivacyContent div:first-child {
    color: #8590A6;
    width: 424px;
    margin: 26px 0 12px 0;
  }

html[data-theme="dark"] .SettingPrivacyContent div:first-child {
    color: #606A80;
}

.SettingPrivacyCard {
  width: 366px;
  height: 75px;
  background: #FFFFFF;
  border-radius: 4px;
  border: 1px solid #EBEBEB;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  padding-left: 24px;
  margin-bottom: 10px;
}

.SettingPrivacyCard img {
    border-radius: 2px;
    width: 38px;
    height: 38px;
    margin-right: 14px;
  }

.SettingPrivacyCard span {
    /* 与设计一致，不支持设备将回退为 700 */
    font-weight: 600;
    /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
    font-synthesis: style;
    color: #646464;
  }

html[data-ios] .SettingPrivacyCard span {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .SettingPrivacyCard span {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

html[data-theme="dark"] .SettingPrivacyCard span {
    color: #999999;
}

html[data-theme="dark"] .SettingPrivacyCard {
  background: #1A1A1A;
}

html[data-theme="dark"] .SettingPrivacyCard {
  border: 1px solid #444444;
}

.SettingPrivacySwitchContainer {
  padding-left: 40px;
}

.SettingPrivacySwitchContainer .SettingPrivacySwitch {
    padding: 20px 20px 20px 0;
    border-top: 1px solid #EBEBEB;
    display: flex;
    align-items: center;
  }

html[data-theme="dark"] .SettingPrivacySwitchContainer .SettingPrivacySwitch {
    border-top: 1px solid #444444;
}
.WatermarkPreferenceExamples {
  display: flex;
  justify-content: space-between;
}

  .WatermarkPreferenceExamples-card,
  .WatermarkPreferenceExamples-bg {
    height: 160px;
    overflow: hidden;
    position: relative;
    width: 240px;
  }

  .WatermarkPreferenceExamples-signature {
    align-items: center;
    bottom: 8px;
    color: #FFFFFF;
    display: flex;
    height: 13px;
    position: absolute;
    right: 10px;
    z-index: 1;
  }

  html[data-theme="dark"] .WatermarkPreferenceExamples-signature {
    color: #1A1A1A;
}

  .WatermarkPreferenceExamples-username {
    display: inline-block;
    font-size: 12px;
    font-weight: 200;
    max-width: 140px;
    overflow: hidden;
    padding-left: 4px;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .WatermarkPreferenceExamples-status {
    color: #8590A6;
    font-size: 14px;
    height: 21px;
    line-height: 21px;
    margin-top: 12px;
    text-align: center;
  }

  html[data-theme="dark"] .WatermarkPreferenceExamples-status {
    color: #606A80;
}
.WatermarkPreference {
  border-bottom: 1px solid #EBEBEB;
}
  html[data-theme="dark"] .WatermarkPreference {
  border-bottom: 1px solid #444444;
}

.WatermarkPreference-content {
  font-size: 14px;
  margin-left: 40px;
  padding: 12px 20px 6px 0;
}

.WatermarkPreference-content header {
    align-items: center;
    display: flex;
    justify-content: space-between;
  }

.WatermarkPreference-content h4 {
    color: #1A1A1A;
    font-size: 15px;
    height: 21px;
    line-height: 21px;
    margin: 0;
  }

html[data-theme="dark"] .WatermarkPreference-content h4 {
    color: #999999;
}

.WatermarkPreference-content p {
    color: #646464;
    font-size: 14px;
    line-height: 1.5;
    margin: 0;
    padding: 22px 0 14px 0;
  }

html[data-theme="dark"] .WatermarkPreference-content p {
    color: #999999;
}
.OpposeReasonPreference {
  border-bottom: 1px solid #EBEBEB;
  padding: 20px;
  position: relative;
}

  .OpposeReasonPreference-title {
    color: #1A1A1A;
    font-size: 15px;
    height: 21px;
    line-height: 21px;
    margin: 0;
    padding-bottom: 3px;
  }

  html[data-theme="dark"] .OpposeReasonPreference-title {
    color: #999999;
}

  .OpposeReasonPreference-descr {
    color: #8590A6;
    font-size: 14px;
    line-height: 1.5;
  }

  html[data-theme="dark"] .OpposeReasonPreference-descr {
    color: #606A80;
}

  .OpposeReasonPreference .SettingsSwitch {
    position: absolute;
    right: 20px;
    top: 30px;
  }

  html[data-theme="dark"] .OpposeReasonPreference {
  border-bottom: 1px solid #444444;
}
.SingleCheckRadio {
  display: flex;
  align-items: center;
  justify-content: start;
  color: #1A1A1A;
}
  html[data-theme="dark"] .SingleCheckRadio {
  color: #999999;
}

.SingleCheckRadio-input {
  visibility: none;
  opacity: 0;
  margin-right: 8px;
}

.SingleCheckRadio-input:checked + label:before {
    content: '';
    position: absolute;
    top: 50%;
    left: -20px;
    -webkit-transform: translate(0, -56%);
            transform: translate(0, -56%);
    height: 10px;
    width: 10px;
    box-sizing: border-box;
    border-radius: 50%;
    border: 2px solid #FFFFFF;
    box-shadow: 0 0 0 2px #0084FF;
    background-color: #0084FF;
  }

html[data-theme="dark"] .SingleCheckRadio-input:checked + label:before {
    border: 2px solid #1A1A1A;
}

html[data-theme="dark"] .SingleCheckRadio-input:checked + label:before {
    box-shadow: 0 0 0 2px #3A76D0;
}

html[data-theme="dark"] .SingleCheckRadio-input:checked + label:before {
    background-color: #3A76D0;
}

.SingleCheckRadio-label {
  position: relative;
}

.SingleCheckRadio-label:before {
    content: '';
    position: absolute;
    top: 50%;
    left: -20px;
    -webkit-transform: translate(0, -56%);
            transform: translate(0, -56%);
    height: 10px;
    width: 10px;
    box-sizing: border-box;
    border-radius: 50%;
    box-shadow: 0 0 0 2px #D3D3D3;
  }

html[data-theme="dark"] .SingleCheckRadio-label:before {
    box-shadow: 0 0 0 2px #2E2E2E;
}

.SingleCheckRadio-des {
  color: #8590A6;
}

html[data-theme="dark"] .SingleCheckRadio-des {
  color: #606A80;
}
.WallEPreference {
  border-bottom: 1px solid #EBEBEB;
}
  html[data-theme="dark"] .WallEPreference {
  border-bottom: 1px solid #444444;
}

.WallEPreference-main {
  font-size: 14px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-right: 18px;
}

.WallEPreference-radios {
  display: block;
  margin-left: 18px;
  border-top: 1px solid #EBEBEB;
}

html[data-theme="dark"] .WallEPreference-radios {
  border-top: 1px solid #444444;
}

.WallEPreference-radios--collapse {
  display: none;
}

.WallEPreference-radio {
  margin-top: 20px;
  margin-bottom: 20px;
}
.SettingsPreference {
  padding-bottom: 40px;
}

  .SettingsPreference .ExpandableField {
    padding-left: 0;
  }

  .SettingsPreference .ExpandableField-titleView {
    padding-left: 18px;
  }
.RedeemCoupon {
  display: flex;
  flex-direction: column;
  align-items: center;
  max-width: 688px;
  padding: 40px 100px;
}

.RedeemCoupon-title {
  font-size: 24px;
  color: #444444;
}

html[data-theme="dark"] .RedeemCoupon-title {
  color: #808080;
}

.RedeemCoupon-input {
  margin-top: 32px;
  margin-bottom: 20px;
  align-self: stretch;
}

.RedeemCoupon-error {
  height: 21px;
  margin: 12px 0;
  text-align: right;
  color: #F1403C;
}

html[data-theme="dark"] .RedeemCoupon-error {
  color: #B7302D;
}

.RedeemCoupon-confirm {
  width: 220px;
}
.uploadImage-container {
  padding: 0 24px 0 16px;
  height: 64px;
  overflow: hidden;
  width: 100%;
  box-sizing: border-box;
}

  .uploadImage-container ul {
    display: flex;
  }

  .uploadImage-container ul li {
      width: 64px;
      height: 64px;
      margin-left: 8px;
      border-radius: 4px;
      position: relative;
    }

  .uploadImage-container ul li img {
        border-radius: 4px;
        height: 64px;
        width: 64px;
      }

  .uploadImage-container ul li em {
        padding: 0 4px;
        background: #FFFFFF;
        opacity: 0.6;
        border-radius: 2px;
        font-size: 12px;
        color: #1A1A1A;
        position: absolute;
        right: 4px;
        bottom: 4px;
        font-style: normal;
      }

  html[data-theme="dark"] .uploadImage-container ul li em {
        background: #1A1A1A;
}

  html[data-theme="dark"] .uploadImage-container ul li em {
        color: #999999;
}

  .uploadImage-container ul li .uploadImage-cancel {
        position: absolute;
        right: 4px;
        top: 4px;
        width: 16px;
        height: 16px;
        border-radius: 50%;
        text-align: center;
        padding-top: 5px;
        box-sizing: border-box;
        cursor: pointer;
      }

  .uploadImage-container ul li .uploadImage-cancel::before {
          content: '';
          position: absolute;
          width: 100%;
          height: 100%;
          background: #1A1A1A;
          opacity: 0.5;
          top: 0;
          left: 0;
          border-radius: 50%;
        }

  html[data-theme="dark"] .uploadImage-container ul li .uploadImage-cancel::before {
          background: #999999;
}

  .uploadImage-container ul li .uploadImage-cancel svg {
          vertical-align: top;
          position: relative;
          height: 12px;
          top: -3px;
          fill: #FFFFFF;
        }

  html[data-theme="dark"] .uploadImage-container ul li .uploadImage-cancel svg {
          fill: #1A1A1A;
}

  .uploadImage-container .uploadImage-upload {
    position: relative;
    width: 64px;
    overflow: hidden;
  }

  .uploadImage-container .uploadImage-upload > span {
      width: 64px;
      height: 64px;
      box-sizing: border-box;
      border: 2px dashed #BFBFBF;
      border-radius: 4px;
      font-size: 40px;
      display: block;
      color: #BFBFBF;
      cursor: pointer;
      text-align: center;
      font-weight: 200;
      /* HACK: 让加号居中 */
      line-height: 54px;
    }

  html[data-theme="dark"] .uploadImage-container .uploadImage-upload > span {
      border: 2px dashed #808080;
}

  html[data-theme="dark"] .uploadImage-container .uploadImage-upload > span {
      color: #808080;
}

  .uploadImage-container .uploadImage-fileInput {
    position: absolute;
    width: 64px;
    height: 64px;
    left: 0;
    top: 0;
  }

  .uploadImage-container .Editable-imageUploader {
    position: absolute;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
    background: #FFFFFF;
    width: 60px;
  }

  html[data-theme="dark"] .uploadImage-container .Editable-imageUploader {
    background: #1A1A1A;
}

  .uploadImage-container .Editable-imageUploader-statusText {
    font-size: 12px;
    text-align: center;
    line-height: 18px;
  }

  .uploadImage-container .Editable-imageUploader-retry {
    display: none;
  }
.uploadVideo-container {
  margin-left: 24px;
  overflow: hidden;
  width: 190px;
  height: 105px;
  box-sizing: border-box;
  position: relative;
  border-radius: 4px;
}

  .uploadVideo-container .uploadVideo-plugin,
  .uploadVideo-container .uploadVideo-content {
    margin: 0;
    width: 190px;
    height: 105px;
  }

  .uploadVideo-container .Editable-videoUploader-status {
    font-size: 16px;
  }

  .uploadVideo-container .Editable-videoUploader-size {
    font-size: 12px;
  }

  .uploadVideo-container .RichText-video {
    margin: 0;
  }

  .uploadVideo-container .VideoCard {
    border: 0;
    box-shadow: 0 0 0;
  }

  .uploadVideo-container .VideoCard-play-button,
  .uploadVideo-container .VideoCard-play-button svg {
    width: 48px !important;
    height: 48px !important;
  }

  .uploadVideo-container .uploadVideo-cancel {
    position: absolute;
    right: 4px;
    top: 4px;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    text-align: center;
    padding-top: 5px;
    box-sizing: border-box;
    cursor: pointer;
  }

  .uploadVideo-container .uploadVideo-cancel::before {
      content: '';
      position: absolute;
      width: 100%;
      height: 100%;
      background: #1A1A1A;
      opacity: 0.5;
      top: 0;
      left: 0;
      border-radius: 50%;
    }

  html[data-theme="dark"] .uploadVideo-container .uploadVideo-cancel::before {
      background: #999999;
}

  .uploadVideo-container .uploadVideo-cancel svg {
      vertical-align: top;
      position: relative;
      height: 12px;
      top: -3px;
      fill: #FFFFFF;
    }

  html[data-theme="dark"] .uploadVideo-container .uploadVideo-cancel svg {
      fill: #1A1A1A;
}
.WritePin-content {
  border: 1px solid #F0F2F7;
  border-radius: 3px;
  padding: 12px;
}
  html[data-theme="dark"] .WritePin-content {
  border: 1px solid #2E2E2E;
}

.WritePin-contentWrite .public-DraftEditor-content {
    min-height: 200px;
    width: 100%;
  }

.WritePin-contentWrite .public-DraftEditor-content a.member_mention,
    .WritePin-contentWrite .public-DraftEditor-content a.UserLink-link {
      color: #175199;
    }

.WritePin-contentWrite .public-DraftEditor-content a.member_mention:hover, .WritePin-contentWrite .public-DraftEditor-content a.UserLink-link:hover {
    border-bottom: 1px solid #175199;
  }

html[data-theme="dark"] .WritePin-contentWrite .public-DraftEditor-content a.member_mention:hover, html[data-theme="dark"] .WritePin-contentWrite .public-DraftEditor-content a.UserLink-link:hover {
    border-bottom: 1px solid #175199;
}

html[data-theme="dark"] .WritePin-contentWrite .public-DraftEditor-content a.member_mention, html[data-theme="dark"] .WritePin-contentWrite .public-DraftEditor-content a.UserLink-link {
      color: #175199;
}

.WritePin-contentWrite .public-DraftEditorPlaceholder-inner {
    color: #8590A6;
  }

html[data-theme="dark"] .WritePin-contentWrite .public-DraftEditorPlaceholder-inner {
    color: #606A80;
}

/* TODO: 这里的覆盖太恶心，在想法编辑器统一后要删掉 */
.WritePin-uploadImage {
  padding: 16px 0 0;
}
.WritePin-uploadImage ul li {
    height: 48px;
    margin-left: 7px;
    width: 48px;
  }
.WritePin-uploadImage ul li:first-child {
      margin-left: 0;
    }
.WritePin-uploadImage ul li img {
      height: 48px;
      width: 48px;
    }
.WritePin-uploadImage .uploadImage-upload {
    width: 48px;
  }
.WritePin-uploadImage .uploadImage-upload > span {
      height: 48px;
      width: 48px;
      /* HACK: 让加号居中 */
      line-height: 38px;
    }
.WritePin-uploadImage .uploadImage-fileInput {
    height: 48px;
    width: 48px;
  }
.WritePin-uploadImage .Editable-imageUploader {
    width: 48px;
  }

.WritePin-uploadVideo {
  margin: 16px 0 0;
}

.WritePin-cancelLink {
  align-items: center;
  color: #FFFFFF;
  display: flex;
  position: absolute;
  right: -8px;
  top: -8px;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  justify-content: center;
  cursor: pointer;
}

.WritePin-cancelLink::before {
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    background: #1A1A1A;
    opacity: 0.5;
    top: 0;
    left: 0;
    border-radius: 50%;
  }

html[data-theme="dark"] .WritePin-cancelLink::before {
    background: #999999;
}

.WritePin-cancelLink svg {
    position: relative;
    z-index: 1;
  }

html[data-theme="dark"] .WritePin-cancelLink {
  color: #1A1A1A;
}

.WritePin-link {
  border: 1px solid #EBEBEB;
  border-radius: 4px;
  margin-top: 12px;
  box-shadow: 0 1px 3px rgba(26, 26, 26, 0.1);
  position: relative;
}

html[data-theme='dark'] .WritePin-link {
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
  }

html[data-theme="dark"] .WritePin-link {
  border: 1px solid #444444;
}

.WritePin-linkBox {
  box-sizing: border-box;
  display: flex;
  margin: 0;
  padding: 12px;
  width: 100%;
  position: relative;
  justify-content: space-between;
  overflow: auto;
  white-space: normal;
  cursor: pointer;
}

.WritePin-linkBox .WritePin-linkBoxContent {
    display: flex;
    width: 100%;
    padding: 12px 16px 12px 0;
    overflow: hidden;
    flex-direction: column;
    justify-content: space-around;
  }

.WritePin-linkBox .WritePin-linkBoxContent span:nth-child(1) {
      font-size: 18px;
      font-weight: 400;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
      max-height: 54px;
    }

.WritePin-linkBox .WritePin-linkBoxContent .WritePin-linkBoxContentSubTitle {
      color: #8590A6;
      font-size: 15px;
    }

html[data-theme="dark"] .WritePin-linkBox .WritePin-linkBoxContent .WritePin-linkBoxContentSubTitle {
      color: #606A80;
}

.WritePin-linkBox .WritePin-linkBoxContentThumbnail {
    flex-shrink: 0;
    width: 72px;
    height: 72px;
    border-radius: 4px;
    -o-object-fit: cover;
       object-fit: cover;
  }

.WritePin-buttonMenu {
  display: flex;
  justify-content: space-between;
  margin-top: 16px;
}

.WritePin-buttonMenu .WritePin-uploadButton {
    color: #175199;
  }

.WritePin-buttonMenu .WritePin-uploadButton .Zi {
      margin-right: 3px;
    }

html[data-theme="dark"] .WritePin-buttonMenu .WritePin-uploadButton {
    color: #175199;
}

.WritePin-buttonMenu .WritePin-upload {
    position: relative;
  }

.WritePin-buttonMenu .WritePin-upload-disabled::before {
    background: #FFFFFF;
    content: '';
    display: block;
    width: 100%;
    height: 100%;
    opacity: 0.5;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 11;
  }

html[data-theme="dark"] .WritePin-buttonMenu .WritePin-upload-disabled::before {
    background: #1A1A1A;
}

.WritePin-fileInput {
  display: none;
  opacity: 0;
}

.WritePin-modalSucsessTip {
  background: url(https://static.zhihu.com/heifetz/pin-guide@2x.68639e91d0214a6a58ea.png) no-repeat center bottom;
  background-size: 224px 127px;
  padding-bottom: 162px;
  color: #444444;
  line-height: 24px;
  width: 317px;
  margin: 0 auto 48px;
  text-align: center;
}

.WritePin-modalSucsessTip a {
    color: #0084FF;
  }

html[data-theme="dark"] .WritePin-modalSucsessTip a {
    color: #3A76D0;
}

html[data-theme="dark"] .WritePin-modalSucsessTip {
  color: #808080;
}

.WritePin-pinDetail {
  text-align: center;
}

.WritePin-pinDetail a {
    display: inline-block;
    border: 1px solid #0084FF;
    background-color: #0084FF;
    padding: 0 16px;
    width: 220px;
    box-sizing: border-box;
    font-size: 14px;
    line-height: 32px;
    text-align: center;
    cursor: pointer;
    border-radius: 3px;
    color: #FFFFFF;
  }

html[data-theme="dark"] .WritePin-pinDetail a {
    border: 1px solid #3A76D0;
}

html[data-theme="dark"] .WritePin-pinDetail a {
    background-color: #3A76D0;
}

html[data-theme="dark"] .WritePin-pinDetail a {
    color: #1A1A1A;
}

.WritePin-editorCountError {
  color: #F1403C;
}

html[data-theme="dark"] .WritePin-editorCountError {
  color: #B7302D;
}

.WritePin-placeHolder {
  box-sizing: border-box;
  width: 456px;
  height: 83px;
  padding: 0 12px;
  overflow: hidden;
}

.WritePin-placeHolder svg {
    margin-top: -46px;
  }
.GlobalWrite-nav {
  display: flex;
  justify-content: center;
}

.GlobalWrite-navItem {
  align-items: center;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  margin: 23px;
}

.GlobalWrite-navItem:hover .GlobalWrite-navTitle {
      color: #175199;
    }

html[data-theme="dark"] .GlobalWrite-navItem:hover .GlobalWrite-navTitle {
      color: #175199;
}

.GlobalWrite-navIcon {
  color: #8590A6;
  margin-bottom: 6px;
}

html[data-theme="dark"] .GlobalWrite-navIcon {
  color: #606A80;
}

.GlobalWrite-navTitle {
  color: #444444;
  font-size: 16px;
}

html[data-theme="dark"] .GlobalWrite-navTitle {
  color: #808080;
}

.GlobalWrite-draft {
  align-items: center;
  border-top: 1px solid #F0F2F7;
  color: #8590A6;
  display: flex;
  height: 48px;
  margin: 0 20px;
}

.GlobalWrite-draft .GlobalSideBar-navLink {
    margin: 0 -20px;
    width: 100%;
  }

html[data-theme="dark"] .GlobalWrite-draft {
  border-top: 1px solid #2E2E2E;
}

html[data-theme="dark"] .GlobalWrite-draft {
  color: #606A80;
}
.GlobalSideBar-categoryList {
  display: flex;
  flex-wrap: wrap;
  margin: 20px 0 -5px;
  padding: 0 10px;
}

.GlobalSideBar-categoryItem {
  width: 33%;
  display: flex;
  margin-bottom: 25px;
}

.GlobalSideBar-categoryItem .Button {
  display: flex;
  flex: 1;
  flex-direction: column;
  align-items: center;
  position: relative;
  cursor: pointer;
  color: currentColor;
}

.GlobalSideBar-categoryItem a:hover .GlobalSideBar-categoryLabel {
  color: currentColor;
}

.GlobalSideBar-categoryLabel {
  font-size: 15px;
  color: #8590A6;
}

html[data-theme="dark"] .GlobalSideBar-categoryLabel {
  color: #606A80;
}

.GlobalSideBar-categoryIcon {
  display: flex;
  justify-content: center;
  align-items: flex-end;
  width: 25px;
  height: 25px;
  margin-bottom: 10px;
}
.GlobalSideBar-navList {
  width: 100%;
  padding: 8px 0;
}

.GlobalSideBar-navLink {
  display: flex;
  align-items: center;
  padding: 0 20px;
  height: 40px;
  overflow: hidden;
}

.GlobalSideBar-navLink:hover {
    background: #F6F6F6;
  }

html[data-theme="dark"] .GlobalSideBar-navLink:hover {
    background: #2E2E2E;
}

.GlobalSideBar-navIcon {
  fill: #8590A6;
}

html[data-theme="dark"] .GlobalSideBar-navIcon {
  fill: #606A80;
}

.GlobalSideBar-navText {
  flex: 1;
  margin: 0 10px;
  text-align: left;
}

.GlobalSideBar-navNumber {
  padding: 6px 10px;
  border-radius: 2px;
  background: #F6F6F6;
  color: #8590A6;
  font-size: 12px;
}

.GlobalSideBar-navLink:hover .GlobalSideBar-navNumber {
    background: #FFFFFF;
  }

html[data-theme="dark"] .GlobalSideBar-navLink:hover .GlobalSideBar-navNumber {
    background: #1A1A1A;
}

html[data-theme="dark"] .GlobalSideBar-navNumber {
  background: #2E2E2E;
}

html[data-theme="dark"] .GlobalSideBar-navNumber {
  color: #606A80;
}
.GlobalSideBar {
  flex: 1;
  font-size: 14px;
}

.GlobalSideBar .Footer {
  padding: 0 0 0 5px;
}
.TopstoryPageHeader {
  align-items: center;
  display: flex;
  height: 52px;
  margin: 0 auto;
  width: 1000px;
}

  .TopstoryPageHeader-main {
    align-items: center;
    display: flex;
    flex: 1;
  }

  .TopstoryPageHeader-tabs {
    border-bottom: none;
    padding-left: 10px;
  }

  .TopstoryPageHeader-tabs .Tabs-link {
      padding: 15px 0;
    }

  .TopstoryPageHeader-tabs .Tabs-item a {
      color: #444444;
    }

  html[data-theme="dark"] .TopstoryPageHeader-tabs .Tabs-item a {
      color: #808080;
}

  .TopstoryPageHeader-tabs .is-active {
      color: #1A1A1A;
    }

  .TopstoryPageHeader-tabs .is-active:after {
        bottom: 0;
      }

  html[data-theme="dark"] .TopstoryPageHeader-tabs .is-active {
      color: #999999;
}

  .TopstoryPageHeader-aside {
    align-items: center;
    display: flex;
    justify-content: space-between;
    width: 296px;
  }

  .TopstoryPageHeader-aside .TopstoryPageHeader-searchBar {
      width: 216px;
    }

  .TopstoryPageHeader-aside .TopstoryPageHeader-searchButton {
      align-items: center;
      background-color: transparent;
      border: none;
      display: flex;
      height: 32px;
      padding: 0 12px;
    }

.TopstoryPageHeader-askButton {
  padding: 0 14px;
}
.Topstory-noMarginCard {
  margin-bottom: 0;
}
.TopstoryPrelude-users {
  width: 100%;
  display: flex;
  align-items: center;
  flex-direction: column;
}

.TopstoryPrelude-field {
  position: relative;
  display: flex;
}

.TopstoryPrelude-field .Input-wrapper {
  width: 320px;
  margin-right: 20px;
}

.TopstoryPrelude-field .Input {
  line-height: 26px;
}

.TopstoryPrelude-fieldTips {
  position: absolute;
  top: 50px;
  right: 85px;
  color: #F1403C;
}

html[data-theme="dark"] .TopstoryPrelude-fieldTips {
  color: #B7302D;
}

.TopstoryPrelude-users {
  margin: 65px 0;
  display: flex;
}

.TopstoryPrelude-intro {
  margin-bottom: 45px;
  color: #646464;
  font-size: 16px;
}

html[data-theme="dark"] .TopstoryPrelude-intro {
  color: #999999;
}

.TopstoryPrelude-user {
  position: relative;
  left: 50%;
  display: flex;
  align-items: center;
  margin-bottom: 15px;
}

.TopstoryPrelude-avatar {
  margin-right: 16px;
  display: block;
  width: 50px;
  height: 50px;
  border-radius: 50%;
}

.TopstoryPrelude-userBio {
  color: #646464;
}

html[data-theme="dark"] .TopstoryPrelude-userBio {
  color: #999999;
}

.TopstoryPrelude-userList {
  width: 100%;
  overflow: hidden;
}

.TopstoryPrelude-userId--0 {
  margin-left: -190px;
}

.TopstoryPrelude-userId--1 {
  margin-left: 60px;
}

.TopstoryPrelude-userId--2 {
  margin-left: -280px;
}

.TopstoryPrelude-userId--3 {
  margin-left: 34px;
}

.TopstoryPrelude-userId--4 {
  margin-left: -190px;
}

.TopstoryPrelude-userId--5 {
  margin-left: -34px;
}
.TopstoryTopics-hint {
  padding: 40px 0 160px;
  text-align: center;
  color: #999999;
}
  html[data-theme="dark"] .TopstoryTopics-hint {
  color: #646464;
}

.TopstoryTopics-list {
  display: flex;
  flex-wrap: wrap;
  padding: 0 14px;
  min-height: 80vh;
}

.TopstoryTopics-item {
  width: 20%;
  box-sizing: border-box;
  padding: 14px;
  cursor: pointer;
}

.TopstoryTopics-itemWrap {
  position: relative;
  border-radius: 8px;
  overflow: hidden;
}

.TopstoryTopics-itemMask {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(
    to bottom,
    rgba(26, 26, 26, 0.32),
    rgba(26, 26, 26, 0.6)
  );
}

.TopstoryTopics-itemMask:hover {
    opacity: 0.6;
  }

html[data-theme="dark"] .TopstoryTopics-itemMask {
  background: linear-gradient(
    to bottom,
    rgba(153, 153, 153, 0.32),
    rgba(153, 153, 153, 0.6)
  );
}

.TopstoryTopics-itemPic {
  width: 100%;
  display: block;
}

.TopstoryTopics-itemLabel {
  position: absolute;
  z-index: 1;
  left: 10px;
  bottom: 10px;
  color: #FFFFFF;
}

html[data-theme="dark"] .TopstoryTopics-itemLabel {
  color: #1A1A1A;
}

.TopstoryTopics-selectItem {
  position: absolute;
  z-index: 1;
  right: 10px;
  top: 10px;
  width: 30px;
  height: 30px;
  border-radius: 30px;
  display: flex;
  justify-content: center;
  align-items: center;
  opacity: 0.6;
  background: #FFFFFF;
}

html[data-theme="dark"] .TopstoryTopics-selectItem {
  background: #1A1A1A;
}

.TopstoryTopics-selectItem.is--selected {
  opacity: 1;
  background: #999999;
}

.TopstoryTopics-selectItem.is--selected .Icon {
    fill: #FFFFFF;
  }

html[data-theme="dark"] .TopstoryTopics-selectItem.is--selected .Icon {
    fill: #1A1A1A;
}

html[data-theme="dark"] .TopstoryTopics-selectItem.is--selected {
  background: #646464;
}

.TopstoryGuide-onStage {
  position: fixed;
  z-index: 10;
  bottom: 0;
  width: 100%;
  height: 120px;
  line-height: 120px;
  text-align: center;
  background-color: rgba(255, 255, 255, 0.96);
  box-shadow: 0 -1px 0 0 rgba(26, 26, 26, 0.08);
}

.TopstoryGuide-onStage .Button {
    padding: 6px 24px;
    font-size: 18px;
  }

html[data-theme="dark"] .TopstoryGuide-onStage {
  background-color: rgba(26, 26, 26, 0.96);
}

html[data-theme="dark"] .TopstoryGuide-onStage {
  box-shadow: 0 -1px 0 0 rgba(153, 153, 153, 0.08);
}
.TopstoryGuide {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 110;
  overflow: hidden;
  width: 100%;
  height: 100%;
  min-width: 500px;
  border: 0;
  border-radius: 0;
  overflow-x: hidden;
  color: #444444;
  background: rgba(255, 255, 255, 0.95);
}
  html[data-theme="dark"] .TopstoryGuide {
  color: #808080;
}
  html[data-theme="dark"] .TopstoryGuide {
  background: rgba(26, 26, 26, 0.95);
}

.TopstoryWrap {
  width: 100%;
  height: 100%;
  overflow: auto;
  padding-right: 15px;
}

.TopstoryPrelude,
.TopstoryTopics {
  -webkit-animation: 0.3s fadeInUp ease-in;
          animation: 0.3s fadeInUp ease-in;
}

.TopstoryGuide-fadeIn {
  -webkit-animation-name: fadeIn;
          animation-name: fadeIn;
  -webkit-animation-duration: 1.5s;
          animation-duration: 1.5s;
  -webkit-animation-fill-mode: both;
          animation-fill-mode: both;
}

.TopstoryGuide-header,
.TopstoryGuide-container {
  max-width: 1000px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  flex-direction: column;
}

.TopstoryGuide-container {
  margin-top: 40px;
}

.TopstoryGuide-title {
  margin: 40px 0 20px;
  font-size: 24px;
  font-weight: 400;
}

.TopstoryGuide-subtitle {
  color: #999999;
}

html[data-theme="dark"] .TopstoryGuide-subtitle {
  color: #646464;
}

@-webkit-keyframes fadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

@-webkit-keyframes fadeInUp {
  from {
    opacity: 0;
    -webkit-transform: translateY(20px);
            transform: translateY(20px);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
            transform: none;
  }
}

@keyframes fadeInUp {
  from {
    opacity: 0;
    -webkit-transform: translateY(20px);
            transform: translateY(20px);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
            transform: none;
  }
}

.fadeInUp {
  -webkit-animation-name: fadeInUp;
          animation-name: fadeInUp;
  -webkit-animation-duration: 0.2s;
          animation-duration: 0.2s;
  -webkit-animation-fill-mode: both;
          animation-fill-mode: both;
}

@-webkit-keyframes fadeOut {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
  }
}

@keyframes fadeOut {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
  }
}

@-webkit-keyframes fadeOutDown {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translateY(20px);
            transform: translateY(20px);
  }
}

@keyframes fadeOutDown {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translateY(20px);
            transform: translateY(20px);
  }
}

.fadeOutDown {
  -webkit-animation-name: fadeOutDown;
          animation-name: fadeOutDown;
  -webkit-animation-duration: 0.2s;
          animation-duration: 0.2s;
  -webkit-animation-fill-mode: both;
          animation-fill-mode: both;
}
.Topstory-container {
  display: flex;
  align-items: flex-start;
  width: 1000px;
  padding: 0 16px;
  margin: 10px auto;
}

.Topstory-mainColumn {
  flex-shrink: 0;
  margin-right: 10px;
  margin-bottom: 0;
  width: 694px;
}

.Topstory-mainColumn .Card {
    margin-bottom: 0;
    box-shadow: none;
    border-bottom: 1px solid #F0F2F7;
  }

html[data-theme="dark"] .Topstory-mainColumn .Card {
    border-bottom: 1px solid #2E2E2E;
}

.Topstory-tabCard {
  width: 100%;
}

.Topstory-tabCard .Tabs {
    border-bottom: none;
  }

.Topstory-tabCard .Tabs-link {
    padding: 18px 0;
  }

.Topstory-tabCard .is-active:after {
    bottom: 0;
  }

.Topstory-content {
  min-height: 100vh;
}
.LiveCourseItem-cover {
  position: relative;
  display: block;
  width: 100%;
  height: 170px;
  border-radius: 4px;
  overflow: hidden;
  -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0);
  margin-bottom: 10px;
}

  .LiveCourseItem-cover img {
    width: 100%;
    position: absolute;
    top: 70%;
    left: 50%;
    -webkit-transform: translate3d(-50%, -50%, 0);
            transform: translate3d(-50%, -50%, 0);
  }
.EventcardItem-cover {
  position: relative;
  display: block;
  width: 100%;
  height: 160px;
  border-radius: 4px;
  overflow: hidden;
  -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0);
  margin-bottom: 10px;
}

  .EventcardItem-cover img {
    width: 100%;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate3d(-50%, -50%, 0);
            transform: translate3d(-50%, -50%, 0);
  }

.EventcardItem-content {
  margin-top: 10px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  line-height: 27px;
}
.ItemOptions-selfMenuItem {
  line-height: 40px;
}

.ItemOptions-selfMenu {
  font-size: 14px;
  color: #8590A6;
}

html[data-theme="dark"] .ItemOptions-selfMenu {
  color: #606A80;
}
/* root > firstline + byline(可选) */

.FeedSource-firstline {
  margin-bottom: 8px;
  color: #8590A6;
}

.FeedSource-firstline a {
    color: inherit;
  }

.FeedSource-firstline .UserLink-badge {
    /*todo: 暂时解决 badge 接后面内容无空格问题，正确做法是让 CJKSpace 兼容这种情况 */
    margin-right: 0.3em;
  }

html[data-theme="dark"] .FeedSource-firstline {
  color: #606A80;
}

.FeedSource-byline {
  margin-bottom: 14px;
}
.Feed .ColumnItem-meta,
  .Feed .RoundtableItem-meta {
    margin-top: 12px;
  }
.ActionCard-topic {
  position: relative;
  display: inline-block;
  vertical-align: top;
  padding: 20px 20px 4px;
  text-align: center;
  width: 160px;
  box-sizing: border-box;
}

  .ActionCard-topic:not(:first-child)::after {
    position: absolute;
    top: 50%;
    left: 0;
    margin-top: -43px;
    display: block;
    content: '';
    height: 86px;
    width: 1px;
    background-color: #EBEBEB;
  }

  html[data-theme="dark"] .ActionCard-topic:not(:first-child)::after {
    background-color: #444444;
}

.ActionCard-topic-name {
  margin-top: 12px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.ActionCard-topic-reason {
  height: 40px;
  margin-top: 10px;
  margin-bottom: 10px;
  color: #8590A6;
  font-size: 14px;
  display: -webkit-box;
  text-overflow: ellipsis;
  overflow: hidden;
  -webkit-line-clamp: 2;
  /* autoprefixer: ignore next */
  -webkit-box-orient: vertical;
}

html[data-theme="dark"] .ActionCard-topic-reason {
  color: #606A80;
}

.ActionCard-topic-button {
  height: 24px;
  line-height: 24px !important;
  font-size: 13px;
  width: 96px;
}

.ActionCard-dot::after {
  margin: 0 5px;
  content: '\B7';
}

.ActionCard-title {
  color: #8590A6;
  margin-right: 8px;
}

html[data-theme="dark"] .ActionCard-title {
  color: #606A80;
}
.Advert-head {
  margin-bottom: 10px;
}

.Advert-metaText {
  color: #8590A6;
  line-height: 1;
}

html[data-theme="dark"] .Advert-metaText {
  color: #606A80;
}

.Advert-content {
  margin-top: 10px;
}

.Advert-content--cover,
.Advert-content--question {
  display: flex;
}

.Advert-brand {
  display: flex;
  align-items: center;
  color: #8590A6;
  line-height: 24px;
}

html[data-theme="dark"] .Advert-brand {
  color: #606A80;
}

.Advert-brand-avatar .Avatar {
  vertical-align: middle;
}

.Advert-brand-name {
  margin-left: 12px;
}

.Advert-brand-name--hasExtra {
  color: #1A1A1A;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
}

html[data-ios] .Advert-brand-name--hasExtra {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .Advert-brand-name--hasExtra {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

html[data-theme="dark"] .Advert-brand-name--hasExtra {
  color: #999999;
}

.Advert-cover {
  display: block;
  position: relative;
  margin-top: 12px;
  width: 100%;
  height: 150px;
  border-radius: 4px;
  overflow: hidden;
  -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0);
}

.Advert-cover img {
    position: absolute;
    width: 100%;
    top: 50%;
    left: 50%;
    -webkit-transform: translate3d(-50%, -50%, 0);
            transform: translate3d(-50%, -50%, 0);
  }

.Advert--card-cover {
  width: 200px;
  height: 112px;
  margin-top: 4px;
  border-radius: 4px;
  overflow: hidden;
  background: #999999;
  vertical-align: top;
}

html[data-theme="dark"] .Advert--card-cover {
  background: #646464;
}

.Advert--card-detail {
  flex: 1;
  margin-left: 20px;
  line-height: 24px;
}

.Advert-account-inner {
  width: 100%;
  border: 1px solid #EBEBEB;
  border-radius: 3px;
  color: #646464;
}

html[data-theme="dark"] .Advert-account-inner {
  border: 1px solid #444444;
}

html[data-theme="dark"] .Advert-account-inner {
  color: #999999;
}

.Advert-account-cover {
  width: 100%;
  border-top-left-radius: 3px;
  border-top-right-radius: 3px;
  vertical-align: top;
}

.Advert-account-cover:not(img) {
    background: #999999;
    padding-top: 24%;
  }

html[data-theme="dark"] .Advert-account-cover:not(img) {
    background: #646464;
}

.Advert-account-body {
  padding: 8px 12px 16px;
  line-height: 1.6;
}

.Advert-account-user {
  position: relative;
  padding-left: 90px;
  display: flex;
  align-items: flex-end;
}

.Advert-account-user-content {
  flex: 1;
  padding-left: 12px;
}

.Advert-account-user-content .RichText {
    margin-top: 4px;
  }

.Advert-account-user-link {
  font-size: 20px;
}

.Advert-account-user-avatar {
  position: absolute;
  bottom: 0;
  left: 0;
  border-radius: 2px;
  border: 2px solid #FFFFFF;
}

html[data-theme="dark"] .Advert-account-user-avatar {
  border: 2px solid #1A1A1A;
}

.Advert-account-description {
  line-height: 27px;
  margin-top: 12px;
}

.Advert-account-description span {
    color: #8590A6;
  }

html[data-theme="dark"] .Advert-account-description span {
    color: #606A80;
}

.Advert-meta {
  margin-bottom: 14px;
  line-height: 23px;
  color: #8590A6;
}

html[data-theme="dark"] .Advert-meta {
  color: #606A80;
}

.Advert-title {
  font-size: 18px;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
  color: #1A1A1A;
}

html[data-ios] .Advert-title {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .Advert-title {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

html[data-theme="dark"] .Advert-title {
  color: #999999;
}

.Advert-description {
  line-height: 27px;
  margin-top: 6px;
}

.Advert-button {
  display: inline-block;
  color: #8590A6;
  font-size: 14px;
  padding: 0 3px;
}

.Advert-button .Icon {
    margin-left: 4px;
    vertical-align: -1px;
  }

html[data-theme="dark"] .Advert-button {
  color: #606A80;
}

.Advert-followIcon {
  fill: currentColor;
  margin-right: 5px;
  position: relative;
  left: -1px;
}

.Advert-adsense {
  display: flex;
  width: 100%;
}

.Advert-adsense-iframe {
    display: block;
    width: 100%;
  }

.Advert-adsense-iframe--google {
      display: block;
      width: 100%;
      height: 188px;
    }

.Advert-close {
  position: absolute;
  top: 12px;
  right: 12px;
  width: 18px;
  height: 18px;
  background-color: #1A1A1A;
  border-radius: 50%;
  transition: opacity 300ms;
}

.Advert-close:hover {
    background-color: #1A1A1A;
  }

html[data-theme="dark"] .Advert-close:hover {
    background-color: #999999;
}

.Advert-close .Icon {
    display: block;
    margin: 0 auto;
    fill: #FFFFFF;
  }

html[data-theme="dark"] .Advert-close .Icon {
    fill: #1A1A1A;
}

html[data-theme="dark"] .Advert-close {
  background-color: #999999;
}

.Advert-adsense:not(:hover) .Advert-close {
  opacity: 0;
}
.TopstoryItem {
  position: relative;
  padding: 16px 20px;
}

  .TopstoryItem:hover .TopstoryItem-rightButton {
    opacity: 1;
  }

  .TopstoryItem .Button:not(.Button--plain):not(.Button--link) {
    line-height: 30px;
    padding: 0 12px;
  }

.TopstoryItem-rightButton {
  position: absolute;
  top: 12px;
  right: 16px;
  opacity: 0;
  transition: opacity 300ms;
}

.TopstoryItem-rightButton.Popover {
    background: #F6F6F6;
    border-radius: 3px;
    padding: 3px 6px;
    opacity: 1;
  }

html[data-theme="dark"] .TopstoryItem-rightButton.Popover {
    background: #2E2E2E;
}

.TopstoryItem-actionButton {
  position: absolute;
  top: 20px;
  right: 24px;
}

.TopstoryItem-actionButton.is-active {
    color: #175199;
  }

html[data-theme="dark"] .TopstoryItem-actionButton.is-active {
    color: #175199;
}

.TopstoryItem-advertButton {
  font-size: 13px;
}

.TopstoryItem-advertButton .Icon {
    margin-left: 6px;
  }

.TopstoryItem-uninterestTitle {
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
}

html[data-ios] .TopstoryItem-uninterestTitle {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .TopstoryItem-uninterestTitle {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

.TopstoryItem-uninterestTag {
  margin-top: 12px;
}

.TopstoryItem-uninterestTag:not(:last-child) {
    margin-right: 16px;
  }

.TopstoryItem-uninterestTag.is-active {
    background: #0084FF;
    border: 1px solid #0084FF;
    color: #FFFFFF;
  }

html[data-theme="dark"] .TopstoryItem-uninterestTag.is-active {
    background: #3A76D0;
}

html[data-theme="dark"] .TopstoryItem-uninterestTag.is-active {
    border: 1px solid #3A76D0;
}

html[data-theme="dark"] .TopstoryItem-uninterestTag.is-active {
    color: #1A1A1A;
}

.TopstoryItem-menuItem {
  line-height: 36px;
  font-size: 14px;
  color: #8590A6;
}

html[data-theme="dark"] .TopstoryItem-menuItem {
  color: #606A80;
}

.TopstoryItem-isRecommend {
  padding: 20px;
}
.TopstoryArticleItem-image {
  margin-top: 10px;
  width: 100%;
}

.TopstoryArticleItem-status {
  padding: 16px;
  margin: 16px 0;
  color: #8590A6;
  background: #EBEBEB;
  border-radius: 4px;
}

.TopstoryArticleItem-status a {
    color: #175199;
  }

.TopstoryArticleItem-status a:hover {
    border-bottom: 1px solid #175199;
  }

html[data-theme="dark"] .TopstoryArticleItem-status a:hover {
    border-bottom: 1px solid #175199;
}

html[data-theme="dark"] .TopstoryArticleItem-status a {
    color: #175199;
}

html[data-theme="dark"] .TopstoryArticleItem-status {
  color: #606A80;
}

html[data-theme="dark"] .TopstoryArticleItem-status {
  background: #444444;
}
.Topstory-newUserFollowItem {
  padding: 20px;
}

.Topstory-newUserFollowItemHeader {
  width: 100%;
  display: flex;
  justify-content: space-between;
  margin-bottom: 20px;
}

.Topstory-newUserFollowItemHeaderAuthorInfo {
  display: flex;
}

.Topstory-newUserFollowItemHeaderAuthorInfoText {
  margin-left: 10px;
  display: flex;
  flex-direction: column;
}

.Topstory-newUserFollowItemHeaderAuthorBasicInfo {
  display: flex;
  align-items: center;
  width: 500px;
}

.Topstory-newUserFollowItemHeaderAuthorInfoName {
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
  white-space: nowrap;
}

html[data-ios] .Topstory-newUserFollowItemHeaderAuthorInfoName {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .Topstory-newUserFollowItemHeaderAuthorInfoName {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

.Topstory-newUserFollowItemHeaderFollowButton {
  width: 100px;
  height: 34px;
  padding: 0 14px;
}

.Topstory-newUserFollowItemHeaderAuthorInfoDescription {
  white-space: nowrap;
  word-break: break-word;
  overflow: hidden;
  text-overflow: ellipsis;
}

.Topstory-newUserFollowItemExtraInfo {
  color: #999999;
}

html[data-theme="dark"] .Topstory-newUserFollowItemExtraInfo {
  color: #646464;
}
.Topstory-newUserFollowCountPanel {
  height: 150px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background: #FFFFFF;
}
  html[data-theme="dark"] .Topstory-newUserFollowCountPanel {
  background: #1A1A1A;
}

.Topstory-newUserFollowCountPanelIcon {
  width: 150px;
  height: 120px;
}

.Topstory-newUserFollowCountPanelText {
  font-size: 15px;
  color: #808080;
}

html[data-theme="dark"] .Topstory-newUserFollowCountPanelText {
  color: #808080;
}

.Topstory-newUserFollowCountPanelTextReload {
  color: #0084FF;
  cursor: pointer;
}

html[data-theme="dark"] .Topstory-newUserFollowCountPanelTextReload {
  color: #3A76D0;
}
.HotItem {
  background: #FFFFFF;
  display: flex;
  padding: 16px 16px 16px 0;
  position: relative;
}

  .HotItem:not(:first-child) {
    border: none;
    border-top: solid #EBEBEB;
    border-top: 0.5px solid #D3D3D3;
  }

  html[data-hairline] .HotItem:not(:first-child) {
    border-top: 1px solid #D3D3D3;
    -o-border-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='1' height='1'> <rect x='0' y='0' width='1' height='.5' fill='#d3d3d3'/> </svg>")
      1 0 0 0;
       border-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='1' height='1'> <rect x='0' y='0' width='1' height='.5' fill='#d3d3d3'/> </svg>")
      1 0 0 0;
  }

  html[data-theme="dark"] html[data-hairline] .HotItem:not(:first-child) {
    border-top: 1px solid #2E2E2E;
}

  html[data-theme="dark"] .HotItem:not(:first-child) {
    border-top: solid #444444;
}

  html[data-theme="dark"] .HotItem:not(:first-child) {
    border-top: 0.5px solid #2E2E2E;
}

  html[data-theme="dark"] .HotItem {
  background: #1A1A1A;
}

.HotItem-index {
  text-align: center;
  width: 57px;
}

.HotItem-rank {
  line-height: 1.6;
  font-size: 18px;
  color: #999999;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
}

html[data-ios] .HotItem-rank {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .HotItem-rank {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

html[data-theme="dark"] .HotItem-rank {
  color: #646464;
}

.HotItem-hot {
  color: #FF9607;
}

html[data-theme="dark"] .HotItem-hot {
  color: #FF9607;
}

.HotItem-label {
  color: #FFFFFF;
  border-radius: 4px;
  font-size: 12px;
  height: 19px;
  line-height: 19px;
  margin: 0 auto;
  width: 19px;
}

html[data-theme="dark"] .HotItem-label {
  color: #1A1A1A;
}

.HotItem-content {
  flex: 1;
  overflow: hidden;
}

.HotItem-title {
  color: #1A1A1A;
  font-size: 18px;
  line-height: 28px;
  max-height: 56px;
  display: -webkit-box;
  text-overflow: ellipsis;
  overflow: hidden;
  -webkit-line-clamp: 2;
  /* autoprefixer: ignore next */
  -webkit-box-orient: vertical;
  /* 与设计一致，不支持设备将回退为 700 */
  font-weight: 600;
  /* 禁止粗体合成(待 webkit bug 修复后可以删除，https://trac.webkit.org/changeset/223589/webkit) */
  font-synthesis: style;
}

html[data-ios] .HotItem-title {
    /* 与 iOS app 一致，使用 medium 字重 */
    font-weight: 500;
  }

html[data-android] .HotItem-title {
    /* Android 中文字重 bug，需要 700 达到粗体效果 */
    font-weight: 700;
  }

html[data-theme="dark"] .HotItem-title {
  color: #999999;
}

.HotItem-excerpt {
  color: #444444;
  line-height: 25px;
  margin-top: 2px;
  min-height: 25px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.HotItem-excerpt--multiLine {
    max-height: 50px;
    white-space: normal;
    display: -webkit-box;
    text-overflow: ellipsis;
    overflow: hidden;
    -webkit-line-clamp: 2;
    /* autoprefixer: ignore next */
    -webkit-box-orient: vertical;
  }

html[data-theme="dark"] .HotItem-excerpt {
  color: #808080;
}

.HotItem-metrics {
  display: flex;
  align-items: center;
  color: #8590A6;
  font-size: 14px;
  height: 16px;
  margin-top: 8px;
}

.HotItem-metrics path {
    fill: #9fadc7;
  }

.HotItem-metrics .HotItem-action {
    margin-left: 28px;
  }

.HotItem-metrics--bottom {
    bottom: 16px;
    position: absolute;
  }

html[data-theme="dark"] .HotItem-metrics {
  color: #606A80;
}

.HotItem-img {
  display: block;
  height: 105px;
  margin-left: 16px;
  position: relative;
}

.HotItem-img img,
  .HotItem-img:after {
    border-radius: 4px;
    height: 105px;
    width: 190px;
  }

.HotItem-img img {
    display: block;
    -o-object-fit: cover;
       object-fit: cover;
  }

.HotItem-img:after {
    background-color: rgba(26, 26, 26, 0.05);
    content: '';
    left: 0;
    position: absolute;
    top: 0;
  }

html[data-theme="dark"] .HotItem-img:after {
    background-color: rgba(153, 153, 153, 0.05);
}
.HotList {
  background: #FFFFFF;
  border-bottom-left-radius: 2px;
  border-bottom-right-radius: 2px;
  box-sizing: border-box;
  box-shadow: 0 1px 3px 0 rgba(0, 34, 77, 0.05);
  overflow: hidden;
}
  html[data-theme="dark"] .HotList {
  background: #1A1A1A;
}

/*# sourceMappingURL=main.app.962bffb53a35b87d4587.css.map*/