@keyframes skeleton-keyframes-data-v-489bd83e {
  0% {
    background-position: 0 0
  }

  to {
    background-position: 480px 0
  }
}

.emoji.old[data-v-489bd83e] {
  transform: scale(.9)
}

@media (max-width:600px) {
  .web-only[data-v-489bd83e] {
    display: none
  }
}

.edit-container[data-v-489bd83e] {
  position: relative;
  width: 100%;
  padding: 1px;
  background: radial-gradient(circle at 0, at 0, rgba(83, 140, 255, .5), rgba(0, 102, 255, .5), rgba(123, 2, 197, .5), rgba(255, 125, 60, .5), rgba(255, 165, 60, .5));
  background: radial-gradient(circle at 0 0, rgba(83, 140, 255, .5), rgba(0, 102, 255, .5), rgba(123, 2, 197, .5), rgba(255, 125, 60, .5), rgba(255, 165, 60, .5));
  box-sizing: border-box;
  border-radius: 8px
}

.edit-container[data-v-489bd83e]:hover {
  background: radial-gradient(circle at 0, at 0, #538cff, #06f, #7b02c5, #ff7d3c, #ffa53c);
  background: radial-gradient(circle at 0 0, #538cff, #06f, #7b02c5, #ff7d3c, #ffa53c)
}

.edit-container .loginmask[data-v-489bd83e] {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 9
}

.edit-container .main[data-v-489bd83e] {
  background: #fff;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-end;
  height: 100%;
  border-radius: 7px;
  padding: .5rem 1rem;
  box-sizing: border-box
}

.edit-container .main .input[data-v-489bd83e] {
  color: var(--juejin-font-1);
  font-size: 13px;
  font-style: normal;
  font-weight: 400;
  line-height: 22px;
  letter-spacing: .039px;
  flex-grow: 1;
  border: none;
  outline: none;
  vertical-align: middle;
  padding: 0;
  overflow-y: hidden scroll
}

.edit-container .main .input[data-v-489bd83e]::-moz-placeholder {
  color: #737a87
}

.edit-container .main .input[data-v-489bd83e]::placeholder {
  color: #737a87
}

.edit-container .main .icon[data-v-489bd83e] {
  cursor: pointer;
  display: inline-flex;
  width: 20px;
  height: 20px;
  margin-left: 1rem;
  background: url(//lf-web-assets.juejin.cn/obj/juejin-web/xitu_juejin_web/983a66878ce3e773ef1a30f855e45894.svg) no-repeat 50%
}

.edit-container .main .icon.send[data-v-489bd83e] {
  background: url(//lf-web-assets.juejin.cn/obj/juejin-web/xitu_juejin_web/5890c0aa744178cc9c922ebcdd66de8c.svg) no-repeat 50%
}

body[data-theme=dark] .main .input[data-v-489bd83e],
body[data-theme=dark] .main[data-v-489bd83e] {
  background: #131416
}

body[data-theme=dark] .main .icon[data-v-489bd83e] {
  background: url(//lf-web-assets.juejin.cn/obj/juejin-web/xitu_juejin_web/f1e8f9b2ed4d2040d903077511dd6402.svg) no-repeat 50%
}

body[data-theme=dark] .main .icon.send[data-v-489bd83e] {
  background: url(//lf-web-assets.juejin.cn/obj/juejin-web/xitu_juejin_web/ffc0127ef9620e29e9811b5e87a61e98.svg) no-repeat 50%
}

@keyframes skeleton-keyframes-data-v-4f0225d2 {
  0% {
    background-position: 0 0
  }

  to {
    background-position: 480px 0
  }
}

.emoji.old[data-v-4f0225d2] {
  transform: scale(.9)
}

@media (max-width:600px) {
  .web-only[data-v-4f0225d2] {
    display: none
  }
}

.mars-code-text[data-v-4f0225d2] {
  display: flex;
  flex-direction: column;
  color: var(--juejin-ai-text);
  font-size: 20px;
  font-style: normal;
  font-weight: 600;
  line-height: 32px
}

.mars-code-text .title[data-v-4f0225d2] {
  display: flex;
  align-items: center;
  grid-gap: 3px;
  gap: 3px
}

.mars-code-text .title .mars-code[data-v-4f0225d2] {
  width: 106px;
  height: 19px;
  background: url(//lf-web-assets.juejin.cn/obj/juejin-web/xitu_juejin_web/img/juejin-ai-assistant.c720867.png) no-repeat 50%/auto 100%
}

@keyframes skeleton-keyframes-data-v-16d184f6 {
  0% {
    background-position: 0 0
  }

  to {
    background-position: 480px 0
  }
}

.emoji.old[data-v-16d184f6] {
  transform: scale(.9)
}

@media (max-width:600px) {
  .web-only[data-v-16d184f6] {
    display: none
  }
}

.content-empty[data-v-16d184f6] {
  height: 100%;
  box-sizing: border-box;
  padding: 120px 44px 20px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  grid-gap: 40px;
  gap: 40px;
  border-radius: 9px;
  background: hsla(0, 0%, 100%, .4)
}

.content-empty .content-empty-desc[data-v-16d184f6] {
  color: var(--juejin-ai-text-desc);
  font-size: 13px
}

.content-empty .name[data-v-16d184f6] {
  align-items: center
}

.content-empty .icon[data-v-16d184f6] {
  width: 99.846px;
  height: 60px
}

.content-empty .desc[data-v-16d184f6] {
  display: flex;
  flex-direction: column;
  align-items: center;
  font-size: 13px;
  color: var(--juejin-ai-text-desc);
  margin-top: auto
}

.content-empty .desc a[data-v-16d184f6] {
  text-decoration: underline
}

.content-empty .desc .highlight[data-v-16d184f6] {
  color: #1e80ff;
  font-weight: 400
}

body[data-theme=dark] .content-empty[data-v-16d184f6] {
  background: linear-gradient(180deg, hsla(0, 0%, 100%, .09), hsla(0, 0%, 100%, .05))
}

@keyframes skeleton-keyframes-data-v-38cabf23 {
  0% {
    background-position: 0 0
  }

  to {
    background-position: 480px 0
  }
}

.emoji.old[data-v-38cabf23] {
  transform: scale(.9)
}

@media (max-width:600px) {
  .web-only[data-v-38cabf23] {
    display: none
  }
}

.guide-card[data-v-38cabf23] {
  display: flex;
  flex-direction: column;
  height: 100%;
  width: 100%;
  box-sizing: border-box;
  justify-content: space-between
}

.guide-card a[data-v-38cabf23] {
  text-decoration: underline
}

.guide-card .top[data-v-38cabf23] {
  display: flex;
  flex-direction: column;
  grid-gap: 36px;
  gap: 36px
}

.guide-card .top .title[data-v-38cabf23] {
  display: flex;
  flex-direction: column;
  font-size: 24px;
  font-weight: 600;
  line-height: 32px;
  padding: 32px 0
}

.guide-card .top .tips-content[data-v-38cabf23] {
  display: flex;
  flex-direction: column;
  font-size: 13px;
  color: var(--juejin-ai-text)
}

.guide-card .top .tips-list[data-v-38cabf23] {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  margin-top: 12px;
  grid-gap: 6px;
  gap: 6px
}

.guide-card .top .tips-list .tips[data-v-38cabf23] {
  color: var(--juejin-ai-normal-text);
  display: flex;
  width: 230px;
  height: 48px;
  padding: 10px 8px 10px 12px;
  align-items: center;
  grid-gap: 8px;
  gap: 8px;
  border-radius: 8px;
  background: #fff;
  box-sizing: border-box;
  cursor: pointer
}

.guide-card .desc[data-v-38cabf23] {
  display: flex;
  flex-direction: column;
  align-items: center;
  font-size: 13px;
  color: var(--juejin-ai-text-desc)
}

.guide-card .desc a[data-v-38cabf23] {
  color: var(--juejin-ai-text-desc);
  text-decoration: underline
}

.guide-card .desc .highlight[data-v-38cabf23] {
  color: #1e80ff;
  font-weight: 400
}

body[data-theme=dark] .guide-card .tips[data-v-38cabf23] {
  background: #2e3034 !important
}

@keyframes skeleton-keyframes-data-v-594ed9a6 {
  0% {
    background-position: 0 0
  }

  to {
    background-position: 480px 0
  }
}

.emoji.old[data-v-594ed9a6] {
  transform: scale(.9)
}

@media (max-width:600px) {
  .web-only[data-v-594ed9a6] {
    display: none
  }
}

.handle-card[data-v-594ed9a6] {
  display: flex;
  align-items: center
}

.handle-card .divide[data-v-594ed9a6] {
  border: 1px solid #e4e6eb;
  width: 12px;
  opacity: 0;
  transform: rotate(90deg)
}

.handle-card .clear-button[data-v-594ed9a6] {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  width: 28px;
  height: 28px;
  background: #fff;
  border: 1px solid transparent;
  border-radius: 6px;
  cursor: pointer
}

.handle-card .clear-button[data-v-594ed9a6]:hover {
  border: 1px solid #e4e6eb
}

.handle-card .clear-button .icon[data-v-594ed9a6] {
  width: 16px;
  height: 16px;
  background: url(//lf-web-assets.juejin.cn/obj/juejin-web/xitu_juejin_web/660f99644caada91ed4ba973eb03b6d2.svg) no-repeat 50%/100% 100%
}

.handle-card .summary[data-v-594ed9a6] {
  display: flex;
  flex-direction: row;
  padding: 3px 12px;
  align-items: center;
  grid-gap: 4px;
  gap: 4px;
  border-radius: 6px;
  background: #fff;
  cursor: pointer;
  border: 1px solid transparent
}

.handle-card .summary .icon[data-v-594ed9a6] {
  width: 16px;
  height: 16px;
  background: url(//lf-web-assets.juejin.cn/obj/juejin-web/xitu_juejin_web/img/document.3dc9a4a.png) no-repeat 50%/100% 100%
}

.handle-card .summary[data-v-594ed9a6]:hover {
  border: 1px solid #e4e6eb
}

body[data-theme=dark] .handle-card[data-v-594ed9a6] {
  display: flex;
  align-items: center;
  border-radius: 6px
}

body[data-theme=dark] .handle-card .divide[data-v-594ed9a6] {
  border: 1px solid #464646;
  width: 12px;
  opacity: 0;
  transform: rotate(90deg)
}

body[data-theme=dark] .handle-card .clear-button[data-v-594ed9a6] {
  width: 28px;
  height: 28px;
  background: hsla(0, 0%, 100%, .08);
  border-radius: 6px;
  border: 1px solid transparent;
  cursor: pointer
}

body[data-theme=dark] .handle-card .clear-button[data-v-594ed9a6]:hover {
  border: 1px solid hsla(0, 0%, 100%, .2)
}

body[data-theme=dark] .handle-card .clear-button .icon[data-v-594ed9a6] {
  width: 16px;
  height: 16px;
  background: url(//lf-web-assets.juejin.cn/obj/juejin-web/xitu_juejin_web/c37c448f81e7e407c8db04df98f529f2.svg) no-repeat 50%/100% 100%
}

body[data-theme=dark] .handle-card .summary[data-v-594ed9a6] {
  color: hsla(0, 0%, 100%, .9);
  background: hsla(0, 0%, 100%, .08);
  border: 1px solid transparent
}

body[data-theme=dark] .handle-card .summary[data-v-594ed9a6]:hover {
  border: 1px solid hsla(0, 0%, 100%, .2)
}

.header-main[data-v-803209f2] {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  width: 100%
}

.header-main .close-icon[data-v-803209f2] {
  cursor: pointer
}

.header-main .left[data-v-803209f2] {
  grid-gap: 3.17px;
  gap: 3.17px
}

.header-main .clear-button[data-v-803209f2] {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  width: 16px;
  height: 16px;
  background: transparent;
  cursor: pointer
}

.header-main .clear-button .icon[data-v-803209f2] {
  width: 14px;
  height: 14px;
  background: url(//lf-web-assets.juejin.cn/obj/juejin-web/xitu_juejin_web/660f99644caada91ed4ba973eb03b6d2.svg) no-repeat 50%/100% 100%
}

.header-main .right[data-v-803209f2] {
  display: flex;
  grid-gap: 5px;
  gap: 5px
}

body[data-theme=dark] .header-main .mars-code path[data-v-803209f2] {
  fill: #fff
}

body[data-theme=dark] .header-main .close-icon path[data-v-803209f2] {
  fill: #fff;
  fill-opacity: .7
}

body[data-theme=dark] .header-main .clear-button[data-v-803209f2] {
  width: 16px;
  height: 16px;
  background: transparent;
  cursor: pointer
}

body[data-theme=dark] .header-main .clear-button .icon[data-v-803209f2] {
  width: 14px;
  height: 14px;
  background: url(//lf-web-assets.juejin.cn/obj/juejin-web/xitu_juejin_web/c37c448f81e7e407c8db04df98f529f2.svg) no-repeat 50%/100% 100%
}

body[data-theme=dark] .header-main .right[data-v-803209f2] {
  display: flex;
  grid-gap: 5px;
  gap: 5px
}

@keyframes skeleton-keyframes-data-v-63cf5c6d {
  0% {
    background-position: 0 0
  }

  to {
    background-position: 480px 0
  }
}

.emoji.old[data-v-63cf5c6d] {
  transform: scale(.9)
}

@media (max-width:600px) {
  .web-only[data-v-63cf5c6d] {
    display: none
  }
}

.message-feedback[data-v-63cf5c6d] {
  position: absolute;
  top: 40px;
  left: 50%;
  transform: translate(-50%, -50%);
  box-sizing: border-box;
  padding: 9px 16px;
  display: flex;
  align-items: center;
  grid-gap: 8px;
  gap: 8px;
  border-radius: 4px;
  border: 1px solid hsla(0, 0%, 100%, .2);
  background: var(--juejin-popup);
  color: var(--juejin-ai-text);
  font-size: 14px;
  box-shadow: 0 4px 10px 0 rgba(0, 0, 0, .1);
  z-index: 1010
}

.auth-guide-card[data-v-3d361d82] {
  margin-top: 20px;
  height: 182px;
  display: flex;
  padding: 10px 12px;
  flex-direction: column;
  grid-gap: 8px;
  gap: 8px;
  align-self: stretch;
  background-size: cover;
  border-radius: 0 8px 8px 8px
}

.auth-guide-card.auth-guide-modal[data-v-3d361d82] {
  background-image: none;
  height: auto;
  margin-top: 0
}

.auth-guide-card.auth-guide-modal .auth[data-v-3d361d82] {
  border: none
}

.auth-guide-card .auth[data-v-3d361d82] {
  display: flex;
  padding: 12px;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  grid-gap: 8px;
  gap: 8px;
  align-self: stretch;
  border-radius: 4px;
  border: 1px solid rgba(228, 230, 235, .5);
  background: #fff;
  -webkit-backdrop-filter: blur(25px);
  backdrop-filter: blur(25px)
}

.auth-guide-card .auth ul[data-v-3d361d82] {
  margin-left: 18px;
  color: #515767;
  font-size: 12px
}

.auth-guide-card .auth ul li[data-v-3d361d82] {
  list-style-type: disc
}

.auth-guide-card .auth-button[data-v-3d361d82] {
  height: 32px;
  width: 100%;
  border-radius: 4px;
  color: #fff
}

.auth-guide-card .blue[data-v-3d361d82] {
  color: #06f
}

body[data-theme=dark] .auth-guide-card[data-v-3d361d82] {
  color: hsla(0, 0%, 100%, .9);
  background-size: cover;
  border-radius: 0 8px 8px 8px;
  border: 1px
}

body[data-theme=dark] .auth-guide-card .blue[data-v-3d361d82] {
  color: hsla(0, 0%, 100%, .9)
}

body[data-theme=dark] .auth-guide-card .auth[data-v-3d361d82] {
  display: flex;
  padding: 12px;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  grid-gap: 8px;
  gap: 8px;
  align-self: stretch;
  border-radius: 4px;
  border: 1px;
  background: hsla(0, 0%, 100%, .08)
}

body[data-theme=dark] .auth-guide-card .auth ul[data-v-3d361d82] {
  margin-left: 18px;
  color: hsla(0, 0%, 100%, .7);
  font-size: 12px
}

body[data-theme=dark] .auth-guide-card .auth ul li[data-v-3d361d82] {
  list-style-type: disc
}

body[data-theme=dark] .auth-guide-card .auth-button[data-v-3d361d82] {
  height: 32px;
  width: 100%;
  border-radius: 4px;
  border: 0;
  color: #fff
}

.aurh_trae_modal[data-v-3d361d82] .byte-modal__content {
  top: 50%;
  transform: translateY(-60%);
  max-width: 98%
}

.tool-bar[data-v-3968c881] {
  display: flex;
  justify-content: flex-end;
  padding: 0 4px
}

.tool-bar .icon[data-v-3968c881] {
  display: flex;
  width: 20px;
  height: 20px;
  justify-content: center;
  align-items: center;
  grid-gap: 8px;
  gap: 8px;
  border-radius: 4px;
  background: transparent;
  cursor: pointer
}

.tool-bar .icon[data-v-3968c881]:hover {
  background: rgba(0, 0, 0, .05)
}

body[data-theme=dark] .tool-bar .icon path[data-v-3968c881] {
  fill: #b8b8b9
}

body[data-theme=dark] .tool-bar .icon .active path[data-v-3968c881] {
  fill: #1664ff
}

body[data-theme=dark] .tool-bar .icon[data-v-3968c881]:hover {
  background: hsla(0, 0%, 100%, .2)
}

@keyframes skeleton-keyframes-data-v-8487800a {
  0% {
    background-position: 0 0
  }

  to {
    background-position: 480px 0
  }
}

.emoji.old[data-v-8487800a] {
  transform: scale(.9)
}

@media (max-width:600px) {
  .web-only[data-v-8487800a] {
    display: none
  }
}

.ai-card[data-v-8487800a] {
  display: flex;
  flex-direction: column;
  grid-gap: 8px;
  gap: 8px;
  width: 100%
}

.ai-card .message-info[data-v-8487800a] {
  padding: 12px;
  min-height: 22px;
  border-radius: 0 12px 12px 12px;
  background: var(--juejin-ai-message-bgc);
  color: var(--juejin-ai-text);
  font-size: 13px;
  line-height: 24px !important
}

.ai-card .message-stop[data-v-8487800a] {
  color: #9299a7
}

.ai-card .message[data-v-8487800a] {
  /*!
  Theme: GitHub
  Description: Light theme as seen on github.com
  Author: github.com
  Maintainer: @Hirse
  Updated: 2021-05-15

  Outdated base version: https://github.com/primer/github-syntax-light
  Current colors taken from GitHub's CSS
*/
}

.ai-card .message[data-v-8487800a] pre code.hljs {
  display: block;
  overflow-x: auto;
  padding: 1em
}

.ai-card .message[data-v-8487800a] code.hljs {
  padding: 3px 5px
}

.ai-card .message[data-v-8487800a] .hljs {
  color: #24292e;
  background: #fff
}

.ai-card .message[data-v-8487800a] .hljs-doctag,
.ai-card .message[data-v-8487800a] .hljs-keyword,
.ai-card .message[data-v-8487800a] .hljs-meta .hljs-keyword,
.ai-card .message[data-v-8487800a] .hljs-template-tag,
.ai-card .message[data-v-8487800a] .hljs-template-variable,
.ai-card .message[data-v-8487800a] .hljs-type,
.ai-card .message[data-v-8487800a] .hljs-variable.language_ {
  color: #d73a49
}

.ai-card .message[data-v-8487800a] .hljs-title,
.ai-card .message[data-v-8487800a] .hljs-title.class_,
.ai-card .message[data-v-8487800a] .hljs-title.class_.inherited__,
.ai-card .message[data-v-8487800a] .hljs-title.function_ {
  color: #6f42c1
}

.ai-card .message[data-v-8487800a] .hljs-attr,
.ai-card .message[data-v-8487800a] .hljs-attribute,
.ai-card .message[data-v-8487800a] .hljs-literal,
.ai-card .message[data-v-8487800a] .hljs-meta,
.ai-card .message[data-v-8487800a] .hljs-number,
.ai-card .message[data-v-8487800a] .hljs-operator,
.ai-card .message[data-v-8487800a] .hljs-selector-attr,
.ai-card .message[data-v-8487800a] .hljs-selector-class,
.ai-card .message[data-v-8487800a] .hljs-selector-id,
.ai-card .message[data-v-8487800a] .hljs-variable {
  color: #005cc5
}

.ai-card .message[data-v-8487800a] .hljs-meta .hljs-string,
.ai-card .message[data-v-8487800a] .hljs-regexp,
.ai-card .message[data-v-8487800a] .hljs-string {
  color: #032f62
}

.ai-card .message[data-v-8487800a] .hljs-built_in,
.ai-card .message[data-v-8487800a] .hljs-symbol {
  color: #e36209
}

.ai-card .message[data-v-8487800a] .hljs-code,
.ai-card .message[data-v-8487800a] .hljs-comment,
.ai-card .message[data-v-8487800a] .hljs-formula {
  color: #6a737d
}

.ai-card .message[data-v-8487800a] .hljs-name,
.ai-card .message[data-v-8487800a] .hljs-quote,
.ai-card .message[data-v-8487800a] .hljs-selector-pseudo,
.ai-card .message[data-v-8487800a] .hljs-selector-tag {
  color: #22863a
}

.ai-card .message[data-v-8487800a] .hljs-subst {
  color: #24292e
}

.ai-card .message[data-v-8487800a] .hljs-section {
  color: #005cc5;
  font-weight: 700
}

.ai-card .message[data-v-8487800a] .hljs-bullet {
  color: #735c0f
}

.ai-card .message[data-v-8487800a] .hljs-emphasis {
  color: #24292e;
  font-style: italic
}

.ai-card .message[data-v-8487800a] .hljs-strong {
  color: #24292e;
  font-weight: 700
}

.ai-card .message[data-v-8487800a] .hljs-addition {
  color: #22863a;
  background-color: #f0fff4
}

.ai-card .message[data-v-8487800a] .hljs-deletion {
  color: #b31d28;
  background-color: #ffeef0
}

.ai-card .message.loading-wait[data-v-8487800a]:after {
  content: "";
  display: inline-block;
  width: 8px;
  height: 8px;
  margin: 0 2rem 0 0;
  border-radius: 50%;
  animation: l5-data-v-8487800a 1s linear infinite alternate
}

@keyframes l5-data-v-8487800a {
  0% {
    box-shadow: 12px 0 #000, 24px 0 #000;
    background: rgba(0, 0, 0, .13333)
  }

  33% {
    box-shadow: 12px 0 rgba(0, 0, 0, .13333), 24px 0 transparent;
    background: transparent
  }

  66% {
    box-shadow: 12px 0 #000, 24px 0 rgba(0, 0, 0, .13333);
    background: transparent
  }

  to {
    box-shadow: 12px 0 rgba(0, 0, 0, .13333), 24px 0 #000;
    background: #000
  }
}

.ai-card .message.markdown-body[data-v-8487800a] {
  background-color: transparent;
  font-family: inherit;
  font-size: 13px;
  font-style: normal;
  font-weight: 400;
  line-height: 24px;
  letter-spacing: .039px
}

.ai-card .message[data-v-8487800a] p {
  margin: 10px 0 !important
}

.ai-card .message[data-v-8487800a] ul {
  padding-left: 16px
}

.ai-card .message[data-v-8487800a] li {
  list-style: inherit !important
}

.ai-card .message[data-v-8487800a] img {
  max-width: 100%
}

.ai-card .message[data-v-8487800a] .codeblock {
  border-radius: 4px;
  margin: 1rem 0 0
}

.ai-card .message[data-v-8487800a] .codeblock pre {
  background: var(--juejin-ai-code-bgc);
  overflow: auto;
  margin-top: 0;
  padding: 0 8px;
  font-size: inherit
}

.ai-card .message[data-v-8487800a] .codeblock pre .hljs {
  background: transparent !important;
  border-end-end-radius: 4px;
  border-bottom-left-radius: 4px
}

.ai-card .message[data-v-8487800a] .codeblock .codeblock-toolbar {
  border-start-start-radius: 4px;
  border-start-end-radius: 4px;
  background-color: #e7eaf1;
  border-bottom: 1px solid hsla(0, 0%, 100%, .1);
  height: 20px;
  padding: 2px 8px;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  font-size: 12px;
  line-height: 20px;
  color: #737a87;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis
}

.ai-card .message[data-v-8487800a] .codeblock .codeblock-toolbar .codeblock-button {
  background-color: transparent;
  color: #737a87;
  border: none;
  background: url(//lf-web-assets.juejin.cn/obj/juejin-web/xitu_juejin_web/a29cad0c563182258bbc680a14968b6f.svg) no-repeat 50%/12px 12px;
  cursor: pointer
}

.ai-card .tool-bar[data-v-8487800a] {
  transition: opacity .5s;
  opacity: 0
}

.ai-card .tool-bar.show[data-v-8487800a],
.ai-card:hover .tool-bar[data-v-8487800a] {
  opacity: 1
}

.ai-card .fade-enter-active[data-v-8487800a],
.ai-card .fade-leave-active[data-v-8487800a] {
  transition: opacity .5s
}

.ai-card .fade-enter[data-v-8487800a],
.ai-card .fade-leave-to[data-v-8487800a] {
  opacity: 0
}

body[data-theme=dark] .ai-card .message-stop[data-v-8487800a] {
  color: hsla(0, 0%, 100%, .4)
}

body[data-theme=dark] .ai-card .message[data-v-8487800a] {
  /*!
  Theme: GitHub Dark
  Description: Dark theme as seen on github.com
  Author: github.com
  Maintainer: @Hirse
  Updated: 2021-05-15

  Outdated base version: https://github.com/primer/github-syntax-dark
  Current colors taken from GitHub's CSS
*/
}

body[data-theme=dark] .ai-card .message[data-v-8487800a] pre code.hljs {
  display: block;
  overflow-x: auto;
  padding: 1em
}

body[data-theme=dark] .ai-card .message[data-v-8487800a] code.hljs {
  padding: 3px 5px
}

body[data-theme=dark] .ai-card .message[data-v-8487800a] .hljs {
  color: #c9d1d9;
  background: #0d1117
}

body[data-theme=dark] .ai-card .message[data-v-8487800a] .hljs-doctag,
body[data-theme=dark] .ai-card .message[data-v-8487800a] .hljs-keyword,
body[data-theme=dark] .ai-card .message[data-v-8487800a] .hljs-meta .hljs-keyword,
body[data-theme=dark] .ai-card .message[data-v-8487800a] .hljs-template-tag,
body[data-theme=dark] .ai-card .message[data-v-8487800a] .hljs-template-variable,
body[data-theme=dark] .ai-card .message[data-v-8487800a] .hljs-type,
body[data-theme=dark] .ai-card .message[data-v-8487800a] .hljs-variable.language_ {
  color: #ff7b72
}

body[data-theme=dark] .ai-card .message[data-v-8487800a] .hljs-title,
body[data-theme=dark] .ai-card .message[data-v-8487800a] .hljs-title.class_,
body[data-theme=dark] .ai-card .message[data-v-8487800a] .hljs-title.class_.inherited__,
body[data-theme=dark] .ai-card .message[data-v-8487800a] .hljs-title.function_ {
  color: #d2a8ff
}

body[data-theme=dark] .ai-card .message[data-v-8487800a] .hljs-attr,
body[data-theme=dark] .ai-card .message[data-v-8487800a] .hljs-attribute,
body[data-theme=dark] .ai-card .message[data-v-8487800a] .hljs-literal,
body[data-theme=dark] .ai-card .message[data-v-8487800a] .hljs-meta,
body[data-theme=dark] .ai-card .message[data-v-8487800a] .hljs-number,
body[data-theme=dark] .ai-card .message[data-v-8487800a] .hljs-operator,
body[data-theme=dark] .ai-card .message[data-v-8487800a] .hljs-selector-attr,
body[data-theme=dark] .ai-card .message[data-v-8487800a] .hljs-selector-class,
body[data-theme=dark] .ai-card .message[data-v-8487800a] .hljs-selector-id,
body[data-theme=dark] .ai-card .message[data-v-8487800a] .hljs-variable {
  color: #79c0ff
}

body[data-theme=dark] .ai-card .message[data-v-8487800a] .hljs-meta .hljs-string,
body[data-theme=dark] .ai-card .message[data-v-8487800a] .hljs-regexp,
body[data-theme=dark] .ai-card .message[data-v-8487800a] .hljs-string {
  color: #a5d6ff
}

body[data-theme=dark] .ai-card .message[data-v-8487800a] .hljs-built_in,
body[data-theme=dark] .ai-card .message[data-v-8487800a] .hljs-symbol {
  color: #ffa657
}

body[data-theme=dark] .ai-card .message[data-v-8487800a] .hljs-code,
body[data-theme=dark] .ai-card .message[data-v-8487800a] .hljs-comment,
body[data-theme=dark] .ai-card .message[data-v-8487800a] .hljs-formula {
  color: #8b949e
}

body[data-theme=dark] .ai-card .message[data-v-8487800a] .hljs-name,
body[data-theme=dark] .ai-card .message[data-v-8487800a] .hljs-quote,
body[data-theme=dark] .ai-card .message[data-v-8487800a] .hljs-selector-pseudo,
body[data-theme=dark] .ai-card .message[data-v-8487800a] .hljs-selector-tag {
  color: #7ee787
}

body[data-theme=dark] .ai-card .message[data-v-8487800a] .hljs-subst {
  color: #c9d1d9
}

body[data-theme=dark] .ai-card .message[data-v-8487800a] .hljs-section {
  color: #1f6feb;
  font-weight: 700
}

body[data-theme=dark] .ai-card .message[data-v-8487800a] .hljs-bullet {
  color: #f2cc60
}

body[data-theme=dark] .ai-card .message[data-v-8487800a] .hljs-emphasis {
  color: #c9d1d9;
  font-style: italic
}

body[data-theme=dark] .ai-card .message[data-v-8487800a] .hljs-strong {
  color: #c9d1d9;
  font-weight: 700
}

body[data-theme=dark] .ai-card .message[data-v-8487800a] .hljs-addition {
  color: #aff5b4;
  background-color: #033a16
}

body[data-theme=dark] .ai-card .message[data-v-8487800a] .hljs-deletion {
  color: #ffdcd7;
  background-color: #67060c
}

body[data-theme=dark] .ai-card .message[data-v-8487800a] .codeblock .hljs-tag {
  color: #c9d1d9 !important
}

body[data-theme=dark] .ai-card .message[data-v-8487800a] .codeblock .codeblock-toolbar {
  background-color: hsla(0, 0%, 100%, .15);
  color: hsla(0, 0%, 100%, .7)
}

body[data-theme=dark] .ai-card .message[data-v-8487800a] .codeblock .codeblock-toolbar .codeblock-button {
  color: hsla(0, 0%, 100%, .7);
  background: url(//lf-web-assets.juejin.cn/obj/juejin-web/xitu_juejin_web/5455bc78ca151ee002781f206de18426.svg) no-repeat 50%/12px 12px
}

.question-layout[data-v-396371ba] {
  margin-top: 12px
}

.question[data-v-396371ba] {
  display: flex;
  align-items: center;
  height: 100%;
  width: -moz-fit-content;
  width: fit-content;
  grid-gap: 4px;
  gap: 4px;
  background: #fff;
  margin-bottom: 8px;
  cursor: pointer;
  font-size: 13px;
  font-weight: 400;
  line-height: 22px;
  text-align: left;
  color: #252933;
  border: 1px solid rgba(228, 230, 235, .50196);
  border-radius: 6px;
  padding: 5px 12px
}

.question[data-v-396371ba]:hover {
  background: #f2f3f5
}

body[data-theme=dark] .question[data-v-396371ba] {
  display: flex;
  align-items: center;
  grid-gap: 4px;
  gap: 4px;
  height: 100%;
  width: -moz-fit-content;
  width: fit-content;
  background: #181818;
  margin-bottom: 8px;
  cursor: pointer;
  font-size: 13px;
  font-weight: 400;
  line-height: 22px;
  text-align: left;
  color: hsla(0, 0%, 100%, .89804);
  border: 1px solid hsla(0, 0%, 100%, .1);
  border-radius: 6px;
  padding: 5px 12px
}

body[data-theme=dark] .question[data-v-396371ba]:hover {
  background: hsla(0, 0%, 100%, .2)
}

@keyframes skeleton-keyframes-data-v-e9f6e4a4 {
  0% {
    background-position: 0 0
  }

  to {
    background-position: 480px 0
  }
}

.emoji.old[data-v-e9f6e4a4] {
  transform: scale(.9)
}

@media (max-width:600px) {
  .web-only[data-v-e9f6e4a4] {
    display: none
  }
}

.scroll-btn[data-v-e9f6e4a4] {
  position: absolute;
  right: 0;
  bottom: 20px;
  display: inline-flex;
  padding: 8px;
  justify-content: center;
  align-items: center;
  border-radius: 23px;
  border: 1px solid #dde2e9;
  background: #fff
}

.scroll-btn:hover path[data-v-e9f6e4a4] {
  fill: #0082ff
}

body[data-theme=dark] .scroll-btn[data-v-e9f6e4a4] {
  border: 1px solid hsla(0, 0%, 100%, .1);
  background: hsla(0, 0%, 100%, .2);
  box-shadow: 0 15px 35px -2px hsla(0, 0%, 100%, .05), 0 5px 15px 0 hsla(0, 0%, 100%, .05);
  -webkit-backdrop-filter: blur(20px);
  backdrop-filter: blur(20px)
}

body[data-theme=dark] .scroll-btn path[data-v-e9f6e4a4] {
  fill: #fff
}

.user-card[data-v-a36902f6] {
  display: flex;
  justify-content: flex-end;
  width: 100%;
  align-items: center;
  color: #fff;
  font-size: 13px;
  font-style: normal;
  font-weight: 400;
  line-height: 24px;
  letter-spacing: .039px
}

.user-card .message[data-v-a36902f6] {
  display: flex;
  flex-direction: column;
  padding: 8px 12px;
  border-radius: 12px 0 12px 12px;
  background: #0082ff
}

.message-list[data-v-5abbb3c0] {
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  grid-gap: 20px;
  gap: 20px;
  overflow-x: hidden;
  overflow-y: auto;
  scrollbar-width: none;
  -ms-overflow-style: none;
  color: #0c0d0e;
  font-size: 13px;
  font-style: normal;
  font-weight: 400;
  line-height: 22px;
  letter-spacing: .039px
}

.message-list[data-v-5abbb3c0]::-webkit-scrollbar {
  display: none
}

.message-list .item[data-v-5abbb3c0] {
  display: flex;
  flex-direction: column
}

@keyframes skeleton-keyframes-data-v-49ea306a {
  0% {
    background-position: 0 0
  }

  to {
    background-position: 480px 0
  }
}

.emoji.old[data-v-49ea306a] {
  transform: scale(.9)
}

@media (max-width:600px) {
  .web-only[data-v-49ea306a] {
    display: none
  }
}

.stop[data-v-49ea306a] {
  width: 100%;
  cursor: pointer
}

.stop .stop-button[data-v-49ea306a],
.stop[data-v-49ea306a] {
  display: flex;
  justify-content: center
}

.stop .stop-button[data-v-49ea306a] {
  padding: 6px 12px;
  align-items: center;
  grid-gap: 6px;
  gap: 6px;
  color: var(--juejin-ai-text);
  border-radius: 4px;
  border: 1px solid rgba(0, 0, 0, .1);
  background: var(--juejin-popup);
  box-shadow: 0 4px 5px 0 rgba(0, 0, 0, .06);
  font-size: 14px
}

body[data-theme=dark] .stop .stop-button[data-v-49ea306a] {
  border: 1px solid rgba(0, 0, 0, .2);
  box-shadow: 0 4px 5px 0 rgba(0, 0, 0, .1)
}

.chat-assistant[data-v-58e6fb36] {
  position: fixed;
  display: flex;
  z-index: 1001;
  box-sizing: border-box;
  padding: 12px 24px 8px;
  flex-direction: column;
  align-items: flex-start;
  grid-gap: 12px;
  gap: 12px;
  right: 14px;
  bottom: 14px;
  top: calc(60px + 1.767rem);
  background-image: url(//lf-web-assets.juejin.cn/obj/juejin-web/xitu_juejin_web/086a891665bdd751f339293cc0d75038.svg), url(//lf-web-assets.juejin.cn/obj/juejin-web/xitu_juejin_web/img/bgc2.1e5526a.png), linear-gradient(173deg, #f4f9ff -24.94%, #edf1f9 103.15%);
  background-repeat: no-repeat;
  background-position: 100% 0;
  background-attachment: fixed;
  background-size: auto;
  border-radius: 4px;
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: 24px;
  letter-spacing: .039px;
  box-shadow: 0 32px 60px 0 rgba(81, 87, 103, .12)
}

.chat-assistant .chat-main[data-v-58e6fb36] {
  position: relative;
  flex: auto;
  width: 100%;
  overflow: auto;
  scrollbar-width: none;
  -ms-overflow-style: none
}

.chat-assistant .chat-main[data-v-58e6fb36]::-webkit-scrollbar {
  display: none
}

.chat-assistant .ai-info[data-v-58e6fb36] {
  width: 100%;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  grid-gap: 2px;
  gap: 2px;
  line-height: 9px;
  margin-top: -4px;
  font-size: 8px
}

.chat-assistant .ai-info[data-v-58e6fb36],
.chat-assistant .ai-info a[data-v-58e6fb36] {
  color: var(--juejin-font-4)
}

.chat-assistant .ai-info a[data-v-58e6fb36]:hover {
  color: #007fff
}

body[data-theme=dark] .chat-assistant[data-v-58e6fb36] {
  background: linear-gradient(185deg, #181a1f 4.13%, #101112 100.6%)
}

@keyframes skeleton-keyframes-data-v-4fdcfe21 {
  0% {
    background-position: 0 0
  }

  to {
    background-position: 480px 0
  }
}

.code-tips[data-v-4fdcfe21] {
  color: var(--juejin-brand-1-normal);
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: 14px;
  display: flex;
  align-items: center;
  justify-content: center
}

.code-tips span[data-v-4fdcfe21] {
  margin-left: 4px
}

.code-tips[data-v-4fdcfe21]:hover {
  color: var(--juejin-brand-3-click);
  cursor: pointer
}

.render[data-v-159ebe90] {
  display: inline-flex;
  align-items: center;
  margin-left: 10px;
  cursor: pointer
}

.render .icon[data-v-159ebe90] {
  transform: translateY(-1px)
}

.render .txt[data-v-159ebe90] {
  color: #b0b0b0;
  text-align: center;
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: 14px;
  background: radial-gradient(495.98% 195.09% at 144.79%, at 10.71%, #ff8a01 0, #b051b9 22.37%, #672bff 45.54%, #06f 99.99%);
  background: radial-gradient(495.98% 195.09% at 144.79% 10.71%, #ff8a01 0, #b051b9 22.37%, #672bff 45.54%, #06f 99.99%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent
}

body[data-theme=dark] .markdown-body {
  background-image: none;
  color: var(--juejin-font-1);
  font-size: 16px;
  font-weight: 400;
  line-height: 1.75;
  word-break: break-word;
  background-color: transparent;
  overflow-x: hidden
}

body[data-theme=dark] .markdown-body .username {
  color: var(--juejin-font-2)
}

body[data-theme=dark] .markdown-body html {
  font-family: sans-serif;
  font-size: 15px;
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%
}

body[data-theme=dark] .markdown-body body {
  color: var(--juejin-font-1);
  font-family: -apple-system, PingFang SC, Hiragino Sans GB, Arial, Microsoft YaHei, Helvetica Neue, sans-serif;
  text-rendering: optimizeLegibility;
  background-color: var(--juejin-layer-1);
  margin: 0
}

body[data-theme=dark] .markdown-body article,
body[data-theme=dark] .markdown-body aside,
body[data-theme=dark] .markdown-body details,
body[data-theme=dark] .markdown-body figcaption,
body[data-theme=dark] .markdown-body figure,
body[data-theme=dark] .markdown-body footer,
body[data-theme=dark] .markdown-body header,
body[data-theme=dark] .markdown-body hgroup,
body[data-theme=dark] .markdown-body main,
body[data-theme=dark] .markdown-body menu,
body[data-theme=dark] .markdown-body nav,
body[data-theme=dark] .markdown-body section,
body[data-theme=dark] .markdown-body summary {
  display: block
}

body[data-theme=dark] .markdown-body audio,
body[data-theme=dark] .markdown-body canvas,
body[data-theme=dark] .markdown-body progress,
body[data-theme=dark] .markdown-body video {
  display: inline-block;
  vertical-align: baseline
}

body[data-theme=dark] .markdown-body audio:not([controls]) {
  display: none;
  height: 0
}

body[data-theme=dark] .markdown-body [hidden],
body[data-theme=dark] .markdown-body template {
  display: none
}

body[data-theme=dark] .markdown-body a {
  background-color: transparent;
  border-color: transparent;
  text-decoration: none;
  color: var(--juejin-font-brand1-normal);
  transition: color .3s;
  box-shadow: none;
  border-bottom: 1px solid var(--juejin-font-brand1-normal)
}

body[data-theme=dark] .markdown-body a:after,
body[data-theme=dark] .markdown-body a:before {
  display: none
}

body[data-theme=dark] .markdown-body a:active,
body[data-theme=dark] .markdown-body a:hover {
  outline: 0;
  color: var(--juejin-font-brand2-hover);
  border-color: var(--juejin-font-brand2-hover)
}

body[data-theme=dark] .markdown-body p {
  margin: 22px 0;
  font-size: inherit;
  letter-spacing: inherit;
  word-spacing: inherit;
  color: var(--juejin-font-1);
  text-align: left;
  line-height: inherit
}

body[data-theme=dark] .markdown-body p[align=center] {
  text-align: center
}

body[data-theme=dark] .markdown-body p[align=right] {
  text-align: right
}

body[data-theme=dark] .markdown-body p:first-letter {
  color: inherit;
  font-size: inherit;
  font-weight: inherit;
  margin: 0
}

body[data-theme=dark] .markdown-body abbr[title] {
  border-bottom: 1px dotted
}

body[data-theme=dark] .markdown-body b,
body[data-theme=dark] .markdown-body strong {
  font-weight: 700;
  color: inherit
}

body[data-theme=dark] .markdown-body b:after,
body[data-theme=dark] .markdown-body b:before,
body[data-theme=dark] .markdown-body strong:after,
body[data-theme=dark] .markdown-body strong:before {
  display: none
}

body[data-theme=dark] .markdown-body em {
  font-style: italic;
  color: inherit;
  font-weight: 400;
  -webkit-text-emphasis: inherit;
  text-emphasis: inherit
}

body[data-theme=dark] .markdown-body blockquote {
  background-color: var(--juejin-gray-2);
  color: var(--juejin-font-2);
  padding: 1px 23px;
  margin: 22px 0;
  border: none;
  border-left: 4px solid var(--juejin-layer-3-border)
}

body[data-theme=dark] .markdown-body blockquote:after,
body[data-theme=dark] .markdown-body blockquote:before {
  display: none
}

body[data-theme=dark] .markdown-body blockquote>p {
  color: inherit;
  margin: 10px 0
}

body[data-theme=dark] .markdown-body dfn {
  font-style: italic
}

body[data-theme=dark] .markdown-body del {
  color: var(--juejin-font-1);
  -webkit-text-decoration-color: var(--juejin-font-1);
  text-decoration-color: var(--juejin-font-1)
}

body[data-theme=dark] .markdown-body h1,
body[data-theme=dark] .markdown-body h2,
body[data-theme=dark] .markdown-body h3,
body[data-theme=dark] .markdown-body h4,
body[data-theme=dark] .markdown-body h5,
body[data-theme=dark] .markdown-body h6 {
  color: var(--juejin-font-1);
  border: none;
  line-height: 1.5;
  margin: 35px 0 10px;
  padding: 0 0 5px;
  background: transparent;
  text-align: left;
  box-shadow: none;
  font-family: Menlo, Monaco, Consolas, Courier New, monospace
}

body[data-theme=dark] .markdown-body h1:after,
body[data-theme=dark] .markdown-body h1:before,
body[data-theme=dark] .markdown-body h2:after,
body[data-theme=dark] .markdown-body h2:before,
body[data-theme=dark] .markdown-body h3:after,
body[data-theme=dark] .markdown-body h3:before,
body[data-theme=dark] .markdown-body h4:after,
body[data-theme=dark] .markdown-body h4:before,
body[data-theme=dark] .markdown-body h5:after,
body[data-theme=dark] .markdown-body h5:before,
body[data-theme=dark] .markdown-body h6:after,
body[data-theme=dark] .markdown-body h6:before {
  display: none
}

body[data-theme=dark] .markdown-body h1 {
  font-size: 24px;
  margin-bottom: 5px;
  text-align: left
}

body[data-theme=dark] .markdown-body h4,
body[data-theme=dark] .markdown-body h5,
body[data-theme=dark] .markdown-body h6 {
  font-size: 16px
}

body[data-theme=dark] .markdown-body h2 {
  font-size: 20px
}

body[data-theme=dark] .markdown-body h3 {
  font-size: 18px
}

body[data-theme=dark] .markdown-body h6 {
  margin-top: 5px
}

body[data-theme=dark] .markdown-body ol,
body[data-theme=dark] .markdown-body ul {
  padding-left: 28px;
  color: var(--juejin-font-1)
}

body[data-theme=dark] .markdown-body ol li,
body[data-theme=dark] .markdown-body ul li {
  margin-bottom: 0;
  list-style: inherit;
  color: var(--juejin-font-1)
}

body[data-theme=dark] .markdown-body ol li.task-list-item,
body[data-theme=dark] .markdown-body ul li.task-list-item {
  list-style: none
}

body[data-theme=dark] .markdown-body ol li.task-list-item ol,
body[data-theme=dark] .markdown-body ol li.task-list-item ul,
body[data-theme=dark] .markdown-body ul li.task-list-item ol,
body[data-theme=dark] .markdown-body ul li.task-list-item ul {
  margin-top: 0
}

body[data-theme=dark] .markdown-body ol li.task-list-item:before,
body[data-theme=dark] .markdown-body ul li.task-list-item:before {
  display: none
}

body[data-theme=dark] .markdown-body ol li::marker,
body[data-theme=dark] .markdown-body ul li::marker {
  color: inherit
}

body[data-theme=dark] .markdown-body ol li:after,
body[data-theme=dark] .markdown-body ol li:before,
body[data-theme=dark] .markdown-body ul li:after,
body[data-theme=dark] .markdown-body ul li:before {
  display: none
}

body[data-theme=dark] .markdown-body ol ol,
body[data-theme=dark] .markdown-body ol ul,
body[data-theme=dark] .markdown-body ul ol,
body[data-theme=dark] .markdown-body ul ul {
  margin-top: 3px
}

body[data-theme=dark] .markdown-body ol li {
  padding-left: 6px
}

body[data-theme=dark] .markdown-body .contains-task-list {
  padding-left: 0
}

body[data-theme=dark] .markdown-body .task-list-item {
  list-style: none
}

body[data-theme=dark] .markdown-body mark {
  background: var(--juejin-sub-5-yellow);
  color: #fff
}

body[data-theme=dark] .markdown-body small {
  font-size: 80%
}

body[data-theme=dark] .markdown-body sub,
body[data-theme=dark] .markdown-body sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline
}

body[data-theme=dark] .markdown-body sup {
  top: -.5em
}

body[data-theme=dark] .markdown-body sub {
  bottom: -.25em
}

body[data-theme=dark] .markdown-body img {
  border: 0;
  background-color: transparent;
  box-shadow: none;
  max-width: 100%
}

body[data-theme=dark] .markdown-body svg:not(:root) {
  overflow: hidden
}

body[data-theme=dark] .markdown-body figure {
  margin: 1em 40px
}

body[data-theme=dark] .markdown-body hr {
  box-sizing: content-box;
  height: 0;
  border: none;
  border-top: 1px solid var(--juejin-gray-1-1);
  margin-top: 32px;
  margin-bottom: 32px
}

body[data-theme=dark] .markdown-body code {
  font-family: Menlo, Monaco, Consolas, Courier New, monospace;
  word-break: break-word;
  border-radius: 2px;
  overflow-x: auto;
  background-color: #2b2b2b;
  color: #f8f8f2;
  font-size: .87em;
  padding: .065em .4em;
  border: none
}

body[data-theme=dark] .markdown-body pre {
  overflow: auto;
  margin: 0;
  font-size: 12px;
  position: relative;
  line-height: 1.75;
  font-family: Menlo, Monaco, Consolas, Courier New, monospace;
  border: none;
  background: transparent
}

body[data-theme=dark] .markdown-body pre:after,
body[data-theme=dark] .markdown-body pre:before {
  display: none
}

body[data-theme=dark] .markdown-body pre>code {
  font-size: 12px;
  padding: 15px 12px;
  margin: 0;
  word-break: normal;
  display: block;
  overflow-x: auto;
  color: var(--juejin-font-2);
  background: var(--juejin-popover);
  background-image: none
}

body[data-theme=dark] .markdown-body code,
body[data-theme=dark] .markdown-body kbd,
body[data-theme=dark] .markdown-body pre,
body[data-theme=dark] .markdown-body samp {
  font-family: Menlo, Monaco, Consolas, Courier New, monospace;
  background-color: var(--juejin-layer-3-fill);
  color: var(--juejin-font_danger)
}

body[data-theme=dark] .markdown-body button,
body[data-theme=dark] .markdown-body input,
body[data-theme=dark] .markdown-body optgroup,
body[data-theme=dark] .markdown-body select,
body[data-theme=dark] .markdown-body textarea {
  color: inherit;
  font: inherit;
  margin: 0
}

body[data-theme=dark] .markdown-body button {
  overflow: visible
}

body[data-theme=dark] .markdown-body button,
body[data-theme=dark] .markdown-body select {
  text-transform: none
}

body[data-theme=dark] .markdown-body button,
body[data-theme=dark] .markdown-body html input[type=button],
body[data-theme=dark] .markdown-body input[type=reset],
body[data-theme=dark] .markdown-body input[type=submit] {
  -webkit-appearance: button;
  cursor: pointer
}

body[data-theme=dark] .markdown-body button[disabled],
body[data-theme=dark] .markdown-body html input[disabled] {
  cursor: default
}

body[data-theme=dark] .markdown-body button::-moz-focus-inner,
body[data-theme=dark] .markdown-body input::-moz-focus-inner {
  border: 0;
  padding: 0
}

body[data-theme=dark] .markdown-body input {
  line-height: normal
}

body[data-theme=dark] .markdown-body input[type=checkbox],
body[data-theme=dark] .markdown-body input[type=radio] {
  box-sizing: border-box;
  padding: 0
}

body[data-theme=dark] .markdown-body .contains-task-list .task-list-item input[type=checkbox]:before,
body[data-theme=dark] .markdown-body input[type=checkbox]:before {
  background: var(--juejin-layer-3-fill);
  border-color: transparent;
  content: ""
}

body[data-theme=dark] .markdown-body input[type=number]::-webkit-inner-spin-button,
body[data-theme=dark] .markdown-body input[type=number]::-webkit-outer-spin-button {
  height: auto
}

body[data-theme=dark] .markdown-body input[type=search] {
  -webkit-appearance: textfield;
  box-sizing: content-box
}

body[data-theme=dark] .markdown-body input[type=search]::-webkit-search-cancel-button,
body[data-theme=dark] .markdown-body input[type=search]::-webkit-search-decoration {
  -webkit-appearance: none
}

body[data-theme=dark] .markdown-body fieldset {
  border: 1px solid var(--juejin-layer-3-border);
  margin: 0 2px;
  padding: .35em .625em .75em
}

body[data-theme=dark] .markdown-body legend {
  border: 0;
  padding: 0
}

body[data-theme=dark] .markdown-body textarea {
  overflow: auto
}

body[data-theme=dark] .markdown-body optgroup {
  font-weight: 700
}

body[data-theme=dark] .markdown-body table {
  border-collapse: separate;
  border-spacing: 2px;
  border: 1px solid var(--juejin-layer-3-border);
  display: inline-block !important;
  font-size: 12px;
  width: auto;
  max-width: 100%;
  min-width: auto;
  overflow: auto;
  background: transparent;
  padding: 0;
  box-shadow: none;
  animation: none
}

body[data-theme=dark] .markdown-body table td,
body[data-theme=dark] .markdown-body table th {
  border-color: transparent;
  padding: 12px 7px;
  line-height: 24px;
  color: var(--juejin-font-1);
  font-size: inherit;
  background: transparent
}

body[data-theme=dark] .markdown-body table th {
  background-color: var(--juejin-gray-1-3)
}

body[data-theme=dark] .markdown-body tr {
  background-color: var(--juejin-layer-4-dropdown)
}

body[data-theme=dark] .markdown-body tr:nth-child(2n) {
  background-color: var(--juejin-layer-3-fill)
}

body[data-theme=dark] .markdown-body td {
  min-width: 120px
}

body[data-theme=dark] .markdown-body *,
body[data-theme=dark] .markdown-body :after,
body[data-theme=dark] .markdown-body :before {
  outline: 0
}

body[data-theme=dark] .markdown-body hr {
  border-top: 1px solid var(--juejin-layer-3-border);
  border-bottom: 0;
  border-left: none;
  border-right: 0;
  margin-top: 2em;
  margin-bottom: 2em
}

body[data-theme=dark] .markdown-body input {
  line-height: 1
}

body[data-theme=dark] .markdown-body .opacity-fade-transition {
  transition: opacity .3s
}

body[data-theme=dark] .markdown-body .opacity-fade-enter,
body[data-theme=dark] .markdown-body .opacity-fade-leave {
  opacity: 0
}

@media (min-width:800px) {
  body[data-theme=dark] .markdown-body .scroll-margin {
    margin-left: calc(100vw - 100%)
  }

  body[data-theme=dark] .markdown-body .scroll-padding {
    padding-left: calc(100vw - 100%)
  }
}

body[data-theme=dark] .markdown-body .clearfix,
body[data-theme=dark] .markdown-body .horizontal-nav,
body[data-theme=dark] .markdown-body header,
body[data-theme=dark] .markdown-body nav {
  *zoom: 1
}

body[data-theme=dark] .markdown-body .clearfix:after,
body[data-theme=dark] .markdown-body .clearfix:before,
body[data-theme=dark] .markdown-body .horizontal-nav:after,
body[data-theme=dark] .markdown-body .horizontal-nav:before,
body[data-theme=dark] .markdown-body header:after,
body[data-theme=dark] .markdown-body header:before,
body[data-theme=dark] .markdown-body nav:after,
body[data-theme=dark] .markdown-body nav:before {
  content: " ";
  display: table
}

body[data-theme=dark] .markdown-body .clearfix:after,
body[data-theme=dark] .markdown-body .horizontal-nav:after,
body[data-theme=dark] .markdown-body header:after,
body[data-theme=dark] .markdown-body nav:after {
  clear: both
}

body[data-theme=dark] .markdown-body .float-left {
  float: left
}

body[data-theme=dark] .markdown-body .float-right {
  float: right
}

body[data-theme=dark] .markdown-body .flex {
  display: -webkit-box;
  display: -moz-box;
  display: box;
  display: -moz-flex;
  display: flex;
  -webkit-box-lines: multiple;
  -moz-box-lines: multiple;
  box-lines: multiple;
  flex-wrap: wrap
}

body[data-theme=dark] .markdown-body .flex>.action {
  display: inline-block;
  box-flex: 1;
  -moz-flex: 1;
  flex: 1
}

body[data-theme=dark] .markdown-body .flex>.action>i {
  transition: color .3s
}

body[data-theme=dark] .markdown-body .flex>.action.true>i,
body[data-theme=dark] .markdown-body .flex>.action:hover>i {
  color: var(--juejin-brand-2-hover)
}

body[data-theme=dark] .markdown-body .vertical-center {
  display: -webkit-box;
  display: -moz-box;
  display: box;
  display: -moz-flex;
  display: flex;
  box-orient: vertical;
  box-direction: normal;
  -moz-flex-direction: column;
  flex-direction: column;
  box-pack: center;
  -moz-justify-content: center;
  -ms-justify-content: center;
  -o-justify-content: center;
  justify-content: center;
  -ms-flex-pack: center
}

body[data-theme=dark] .markdown-body .text-left {
  text-align: left
}

body[data-theme=dark] .markdown-body .text-center {
  text-align: center
}

body[data-theme=dark] .markdown-body .text-right {
  text-align: right
}

body[data-theme=dark] .markdown-body .hero-cover {
  position: fixed
}

body[data-theme=dark] .markdown-body .box-cover,
body[data-theme=dark] .markdown-body .hero-cover {
  top: 0;
  right: 0;
  bottom: 0;
  left: 0
}

body[data-theme=dark] .markdown-body .box-cover {
  position: absolute
}

body[data-theme=dark] .markdown-body .background-cover,
body[data-theme=dark] .markdown-body .entry-view .entry-hero {
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: cover
}

body[data-theme=dark] .markdown-body .box-list,
body[data-theme=dark] .markdown-body .dropdown-list,
body[data-theme=dark] .markdown-body .horizontal-nav .actions,
body[data-theme=dark] .markdown-body .related-users,
body[data-theme=dark] .markdown-body .ul-clear,
body[data-theme=dark] .markdown-body header .actions,
body[data-theme=dark] .markdown-body nav .actions {
  list-style: none;
  margin: 0;
  padding-left: 0
}

body[data-theme=dark] .markdown-body .text-normal {
  color: var(--juejin-font-1)
}

body[data-theme=dark] .markdown-body .text-muted {
  color: var(--juejin-font-3)
}

body[data-theme=dark] .markdown-body .text-muted2 {
  color: var(--juejin-font-2)
}

body[data-theme=dark] .markdown-body .text-gray {
  color: var(--juejin-gray-1-1)
}

body[data-theme=dark] .markdown-body .text-light {
  color: var(--juejin-font-4)
}

body[data-theme=dark] .markdown-body .text-blue {
  color: var(--juejin-brand-1-normal)
}

body[data-theme=dark] .markdown-body .text-blue-hover {
  color: var(--juejin-brand-2-hover)
}

body[data-theme=dark] .markdown-body .text-green {
  color: var(--juejin-success-1-normal)
}

body[data-theme=dark] .markdown-body .text-green-hover {
  color: var(--juejin-success-2-deep)
}

body[data-theme=dark] .markdown-body .text-orange {
  color: var(--juejin-warning-1-normal)
}

body[data-theme=dark] .markdown-body .text-red {
  color: var(--juejin-danger-1-normal)
}

body[data-theme=dark] .markdown-body .text-a,
body[data-theme=dark] .markdown-body .text-link {
  cursor: pointer;
  color: var(--juejin-brand-1-normal);
  transition: color .3s
}

body[data-theme=dark] .markdown-body .text-a:active,
body[data-theme=dark] .markdown-body .text-a:hover,
body[data-theme=dark] .markdown-body .text-link:active,
body[data-theme=dark] .markdown-body .text-link:hover {
  color: var(--juejin-brand-2-hover)
}

body[data-theme=dark] .markdown-body .text-link {
  color: var(--juejin-brand-1-normal)
}

body[data-theme=dark] .markdown-body .text-pointer {
  cursor: pointer
}

body[data-theme=dark] .markdown-body .line-wrap {
  white-space: pre-wrap;
  word-break: break-all
}

body[data-theme=dark] .markdown-body .ellipsis,
body[data-theme=dark] .markdown-body .tooltip .user-description,
body[data-theme=dark] .markdown-body .tooltip .user-name {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis
}

body[data-theme=dark] .markdown-body .text-bold,
body[data-theme=dark] .markdown-body .tooltip .user-name,
body[data-theme=dark] .markdown-body b,
body[data-theme=dark] .markdown-body strong {
  font-weight: 700
}

body[data-theme=dark] .markdown-body .show-when-small {
  display: none
}

@media (max-width:600px) {
  body[data-theme=dark] .markdown-body .hide-when-small {
    display: none !important
  }

  body[data-theme=dark] .markdown-body .show-when-small {
    display: block
  }
}

@media (max-width:960px) {
  body[data-theme=dark] .markdown-body .hide-when-not-large {
    display: none !important
  }
}

@media (min-width:960px) {
  body[data-theme=dark] .markdown-body .hide-when-large {
    display: none !important
  }
}

body[data-theme=dark] .markdown-body .box-content .box-meta .action,
body[data-theme=dark] .markdown-body .entry-view .entry-meta .action,
body[data-theme=dark] .markdown-body .inline-nav .action {
  display: inline-block
}

body[data-theme=dark] .markdown-body .box-content .box-meta .action+.action,
body[data-theme=dark] .markdown-body .entry-view .entry-meta .action+.action,
body[data-theme=dark] .markdown-body .inline-nav .action+.action {
  margin-left: 1em
}

body[data-theme=dark] .markdown-body .pointer {
  cursor: pointer
}

body[data-theme=dark] .markdown-body .fade {
  transition: opacity .3s
}

body[data-theme=dark] .markdown-body .fade-enter,
body[data-theme=dark] .markdown-body .fade-leave {
  opacity: 0
}

body[data-theme=dark] .markdown-body .fade-right {
  transition: transform .3s, opacity .3s
}

body[data-theme=dark] .markdown-body .fade-right-enter,
body[data-theme=dark] .markdown-body .fade-right-leave {
  opacity: 0;
  transform: translateX(2em)
}

body[data-theme=dark] .markdown-body .dropdown {
  position: relative
}

body[data-theme=dark] .markdown-body .dropdown i {
  display: inline-block;
  width: 1em;
  text-align: center
}

body[data-theme=dark] .markdown-body .dropdown.open .dropdown-active {
  color: var(--juejin-brand-1-normal)
}

body[data-theme=dark] .markdown-body .dropdown.dropdown-hover:hover .dropdown-list,
body[data-theme=dark] .markdown-body .dropdown.open .dropdown-list {
  display: block
}

body[data-theme=dark] .markdown-body .dropdown-list {
  position: absolute;
  z-index: 10;
  top: 2em;
  left: 0;
  display: none;
  color: var(--juejin-font-2);
  border: 1px solid var(--juejin-layer-3-border);
  background: var(--juejin-layer-1)
}

body[data-theme=dark] .markdown-body .dropdown-list li {
  padding: .8em 2em;
  white-space: nowrap
}

body[data-theme=dark] .markdown-body .dropdown-list li:hover {
  color: var(--juejin-font-2);
  background-color: var(--juejin-layer-2-1);
  transition: background .3s, color .3s
}

body[data-theme=dark] .markdown-body .dropdown-list li:hover a,
body[data-theme=dark] .markdown-body .dropdown-list li:hover a:active,
body[data-theme=dark] .markdown-body .dropdown-list li:hover a:hover {
  color: var(--juejin-font-2)
}

body[data-theme=dark] .markdown-body .dropdown-list li a {
  color: var(--juejin-brand-1-normal)
}

body[data-theme=dark] .markdown-body .dropdown-list li.hr {
  padding: 0;
  height: 1px;
  background-color: var(--juejin-layer-1)
}

body[data-theme=dark] .markdown-body .dropdown-list li.hr:first-child,
body[data-theme=dark] .markdown-body .dropdown-list li.hr:last-child {
  display: none
}

body[data-theme=dark] .markdown-body .box-list {
  width: 100%
}

body[data-theme=dark] .markdown-body .box-list>li {
  display: inline-block;
  text-align: center;
  width: 25%;
  margin-bottom: 1em;
  padding: 0 .5em
}

body[data-theme=dark] .markdown-body .box-list>li.half {
  width: 50%
}

@media (max-width:800px) {
  body[data-theme=dark] .markdown-body .box-list>li {
    width: 50%
  }

  body[data-theme=dark] .markdown-body .box-list>li.half {
    width: 100%
  }

  body[data-theme=dark] .markdown-body .box-list>li.half:last-child {
    margin-bottom: 0
  }
}

body[data-theme=dark] .markdown-body .box-content {
  overflow: hidden;
  border: 1px solid var(--juejin-layer-3-border);
  transition: border-color .3s
}

body[data-theme=dark] .markdown-body .box-content:hover {
  border-color: var(--juejin-brand-2-hover)
}

body[data-theme=dark] .markdown-body .box-content .box-clickable {
  display: block;
  cursor: pointer;
  padding: 1.5em .5em
}

body[data-theme=dark] .markdown-body .box-content .box-icon {
  display: inline-block;
  height: 2em
}

body[data-theme=dark] .markdown-body .box-content .box-title {
  margin: .5em 0 .3em;
  line-height: 1.5em
}

body[data-theme=dark] .markdown-body .box-content .box-meta {
  color: var(--juejin-font-3);
  font-size: .8em
}

body[data-theme=dark] .markdown-body .box-content .subscribe-button {
  margin-bottom: 1em
}

body[data-theme=dark] .markdown-body .tags.cloud .tag {
  margin-top: .3em;
  margin-bottom: .3em
}

body[data-theme=dark] .markdown-body .tags .tag {
  cursor: pointer;
  margin-right: .6em;
  padding: .2em .7em;
  border-radius: 2px
}

body[data-theme=dark] .markdown-body .tags .tag:last-child {
  margin-right: 0
}

body[data-theme=dark] .markdown-body .tag {
  line-height: 1.5em;
  display: inline-block;
  font-size: .8em;
  padding: 0 .5em;
  border: 1px solid var(--juejin-layer-3-border);
  color: var(--juejin-font-3);
  transition: color .3s, border-color .3s, background-color .3s
}

body[data-theme=dark] .markdown-body .tag.true,
body[data-theme=dark] .markdown-body .tag:hover {
  color: var(--juejin-brand-2-hover);
  border-color: var(--juejin-brand-fill2-hover);
  background-color: var(--juejin-layer-3-fill)
}

body[data-theme=dark] .markdown-body .modal {
  position: fixed;
  z-index: 4;
  top: -30em;
  left: 0;
  right: 0;
  background: var(--juejin-layer-1);
  border-bottom: 1px solid var(--juejin-layer-3-border);
  padding-top: 4.5em;
  padding-bottom: 1em;
  transition: transform .3s ease-in-out
}

body[data-theme=dark] .markdown-body .modal.open {
  transform: translateY(30em)
}

body[data-theme=dark] .markdown-body .modal .container {
  padding-left: 1em;
  padding-right: 1em
}

body[data-theme=dark] .markdown-body .modal-close {
  position: absolute;
  top: -1em;
  padding: 1em;
  right: 0;
  cursor: pointer
}

body[data-theme=dark] .markdown-body .input-relative {
  position: relative
}

body[data-theme=dark] .markdown-body .input-box input,
body[data-theme=dark] .markdown-body .input-box textarea {
  margin-top: .5em
}

body[data-theme=dark] .markdown-body .editable,
body[data-theme=dark] .markdown-body input[type=password],
body[data-theme=dark] .markdown-body input[type=text],
body[data-theme=dark] .markdown-body input[type=url],
body[data-theme=dark] .markdown-body select,
body[data-theme=dark] .markdown-body textarea {
  padding: .7em;
  width: 100%;
  display: block;
  border: 0;
  box-shadow: none;
  border: 1px solid var(--juejin-layer-3-border);
  border-radius: 2px;
  transition: border .3s;
  background: var(--juejin-layer-1)
}

body[data-theme=dark] .markdown-body .editable.inline,
body[data-theme=dark] .markdown-body input[type=password].inline,
body[data-theme=dark] .markdown-body input[type=text].inline,
body[data-theme=dark] .markdown-body input[type=url].inline,
body[data-theme=dark] .markdown-body select.inline,
body[data-theme=dark] .markdown-body textarea.inline {
  display: inline-block;
  width: auto;
  padding: 0 .2em
}

body[data-theme=dark] .markdown-body .editable:focus,
body[data-theme=dark] .markdown-body .editable:hover,
body[data-theme=dark] .markdown-body input[type=password]:focus,
body[data-theme=dark] .markdown-body input[type=password]:hover,
body[data-theme=dark] .markdown-body input[type=text]:focus,
body[data-theme=dark] .markdown-body input[type=text]:hover,
body[data-theme=dark] .markdown-body input[type=url]:focus,
body[data-theme=dark] .markdown-body input[type=url]:hover,
body[data-theme=dark] .markdown-body select:focus,
body[data-theme=dark] .markdown-body select:hover,
body[data-theme=dark] .markdown-body textarea:focus,
body[data-theme=dark] .markdown-body textarea:hover {
  border-color: var(--juejin-brand-2-hover)
}

body[data-theme=dark] .markdown-body input[type=submit] {
  border: 0;
  box-shadow: none
}

body[data-theme=dark] .markdown-body textarea {
  resize: none
}

body[data-theme=dark] .markdown-body select {
  -webkit-appearance: none;
  background: var(--juejin-layer-1);
  border-radius: 0
}

body[data-theme=dark] .markdown-body input[type=checkbox]+label {
  margin-left: .5em
}

body[data-theme=dark] .markdown-body input[type=search] {
  border: 0
}

body[data-theme=dark] .markdown-body .button,
body[data-theme=dark] .markdown-body button,
body[data-theme=dark] .markdown-body input[type=submit] {
  -webkit-appearance: none;
  background: var(--juejin-brand-1-normal);
  color: var(--juejin-font-1);
  border-radius: 2px;
  border: 0;
  padding: .5em 1em
}

body[data-theme=dark] .markdown-body .button+.button,
body[data-theme=dark] .markdown-body .button+button,
body[data-theme=dark] .markdown-body .button+input[type=submit],
body[data-theme=dark] .markdown-body button+.button,
body[data-theme=dark] .markdown-body button+button,
body[data-theme=dark] .markdown-body button+input[type=submit],
body[data-theme=dark] .markdown-body input[type=submit]+.button,
body[data-theme=dark] .markdown-body input[type=submit]+button,
body[data-theme=dark] .markdown-body input[type=submit]+input[type=submit] {
  margin-left: 1em
}

body[data-theme=dark] .markdown-body .button.disabled,
body[data-theme=dark] .markdown-body .button[disabled=true],
body[data-theme=dark] .markdown-body button.disabled,
body[data-theme=dark] .markdown-body button[disabled=true],
body[data-theme=dark] .markdown-body input[type=submit].disabled,
body[data-theme=dark] .markdown-body input[type=submit][disabled=true] {
  background-color: var(--juejin-font-white-disable);
  color: var(--juejin-font-1)
}

body[data-theme=dark] .markdown-body .button.gray,
body[data-theme=dark] .markdown-body button.gray,
body[data-theme=dark] .markdown-body input[type=submit].gray {
  background-color: var(--juejin-layer-2-1);
  color: var(--juejin-font-2)
}

body[data-theme=dark] .markdown-body .button.small,
body[data-theme=dark] .markdown-body button.small,
body[data-theme=dark] .markdown-body input[type=submit].small {
  display: inline-block;
  width: auto
}

body[data-theme=dark] .markdown-body .button.inline,
body[data-theme=dark] .markdown-body button.inline,
body[data-theme=dark] .markdown-body input[type=submit].inline {
  display: inline-block;
  padding: .15em .8em;
  font-size: .8em;
  vertical-align: middle
}

body[data-theme=dark] .markdown-body .button.inline+span,
body[data-theme=dark] .markdown-body button.inline+span,
body[data-theme=dark] .markdown-body input[type=submit].inline+span,
body[data-theme=dark] .markdown-body span+.button.inline,
body[data-theme=dark] .markdown-body span+button.inline,
body[data-theme=dark] .markdown-body span+input[type=submit].inline {
  margin-left: .5em
}

body[data-theme=dark] .markdown-body .button.normal,
body[data-theme=dark] .markdown-body button.normal,
body[data-theme=dark] .markdown-body input[type=submit].normal {
  padding: .1em 2.5em
}

body[data-theme=dark] .markdown-body .button.transparent,
body[data-theme=dark] .markdown-body button.transparent,
body[data-theme=dark] .markdown-body input[type=submit].transparent {
  background-color: transparent;
  color: var(--juejin-font-2)
}

body[data-theme=dark] .markdown-body .button.fullwidth,
body[data-theme=dark] .markdown-body button.fullwidth,
body[data-theme=dark] .markdown-body input[type=submit].fullwidth {
  width: 100%
}

body[data-theme=dark] .markdown-body .button.border,
body[data-theme=dark] .markdown-body button.border,
body[data-theme=dark] .markdown-body input[type=submit].border {
  background: transparent;
  border: 1px solid var(--juejin-brand-1-normal);
  color: var(--juejin-brand-1-normal)
}

body[data-theme=dark] .markdown-body input[type=submit][disabled] {
  background-color: var(--juejin-font-white-disable);
  color: var(--juejin-font-1)
}

body[data-theme=dark] .markdown-body a.button {
  color: var(--juejin-font-1)
}

body[data-theme=dark] .markdown-body a.button.gray {
  color: var(--juejin-font-2)
}

body[data-theme=dark] .markdown-body .button {
  cursor: pointer
}

body[data-theme=dark] .markdown-body .validation-button {
  position: absolute;
  right: 0;
  top: .3em;
  padding: .2em 1em
}

body[data-theme=dark] .markdown-body .subscribe-button {
  position: relative;
  display: inline-block;
  width: 3.5em;
  height: 1.5em;
  border: 1px solid var(--juejin-success-2-deep);
  cursor: pointer;
  color: var(--juejin-success-1-normal);
  border-radius: 2px;
  text-align: center;
  transition: width .3s, border-color .3s, background-color .3s
}

body[data-theme=dark] .markdown-body .subscribe-button+.subscribe-button {
  margin-left: 1em
}

body[data-theme=dark] .markdown-body .subscribe-button:hover {
  border-color: var(--juejin-success-2-deep);
  background-color: var(--juejin-layer-2-1)
}

body[data-theme=dark] .markdown-body .subscribe-button:after {
  content: "\5173\6CE8";
  display: inline-block
}

body[data-theme=dark] .markdown-body .subscribe-button.true {
  width: 4.5em;
  background: var(--juejin-font-success);
  color: var(--juejin-font-1)
}

body[data-theme=dark] .markdown-body .subscribe-button.true:after {
  content: "\5DF2\5173\6CE8"
}

body[data-theme=dark] .markdown-body .subscribe-button.loading {
  color: var(--juejin-font-success);
  animation: subscribe-loading .9s linear infinite alternate
}

body[data-theme=dark] .markdown-body .subscribe-button.loading:after {
  content: "\22EF"
}

body[data-theme=dark] .markdown-body .horizontal-nav,
body[data-theme=dark] .markdown-body header,
body[data-theme=dark] .markdown-body nav {
  color: var(--juejin-font-3)
}

body[data-theme=dark] .markdown-body .horizontal-nav .actions,
body[data-theme=dark] .markdown-body header .actions,
body[data-theme=dark] .markdown-body nav .actions {
  display: inline-block;
  white-space: nowrap
}

body[data-theme=dark] .markdown-body .horizontal-nav .actions.secondary,
body[data-theme=dark] .markdown-body header .actions.secondary,
body[data-theme=dark] .markdown-body nav .actions.secondary {
  float: right
}

body[data-theme=dark] .markdown-body .horizontal-nav .action,
body[data-theme=dark] .markdown-body header .action,
body[data-theme=dark] .markdown-body nav .action {
  display: inline-block;
  cursor: pointer
}

body[data-theme=dark] .markdown-body .horizontal-nav .action:hover,
body[data-theme=dark] .markdown-body header .action:hover,
body[data-theme=dark] .markdown-body nav .action:hover {
  color: var(--juejin-font-2)
}

body[data-theme=dark] .markdown-body .horizontal-nav .action.true,
body[data-theme=dark] .markdown-body .horizontal-nav a,
body[data-theme=dark] .markdown-body header .action.true,
body[data-theme=dark] .markdown-body header a,
body[data-theme=dark] .markdown-body nav .action.true,
body[data-theme=dark] .markdown-body nav a {
  color: var(--juejin-brand-1-normal)
}

body[data-theme=dark] .markdown-body .horizontal-nav a:active,
body[data-theme=dark] .markdown-body .horizontal-nav a:hover,
body[data-theme=dark] .markdown-body header a:active,
body[data-theme=dark] .markdown-body header a:hover,
body[data-theme=dark] .markdown-body nav a:active,
body[data-theme=dark] .markdown-body nav a:hover {
  color: var(--juejin-brand-2-hover)
}

body[data-theme=dark] .markdown-body nav {
  margin-bottom: .5em
}

body[data-theme=dark] .markdown-body nav .actions>.action {
  padding: .8em 1.5em;
  transition: border-bottom .3s, color .3s
}

body[data-theme=dark] .markdown-body nav .actions>.action.dropdown {
  border-bottom-color: transparent !important
}

body[data-theme=dark] .markdown-body nav .actions>.action .dropdown-active {
  padding-bottom: 0
}

body[data-theme=dark] .markdown-body nav .actions>.action .dropdown-list {
  top: 3em
}

body[data-theme=dark] .markdown-body nav.bg {
  background-color: var(--juejin-layer-3-fill);
  border-bottom: 1px solid var(--juejin-layer-3-border)
}

body[data-theme=dark] .markdown-body nav.bg .actions>.action {
  font-size: .8em;
  border-bottom: 2px solid transparent
}

body[data-theme=dark] .markdown-body nav.bg .actions>.action.true,
body[data-theme=dark] .markdown-body nav.bg .actions>.action:hover {
  color: var(--juejin-brand-1-normal);
  border-bottom-color: var(--juejin-brand-1-normal)
}

body[data-theme=dark] .markdown-body nav.bg .actions>.action.true {
  font-weight: 700
}

body[data-theme=dark] .markdown-body nav.sparse .actions>.action {
  vertical-align: top;
  padding: .8em .3em;
  margin: 0 .5em
}

body[data-theme=dark] .markdown-body nav .secondary .dropdown-list {
  left: auto;
  right: 0
}

@media (max-width:800px) {
  body[data-theme=dark] .markdown-body nav .container {
    overflow-x: scroll
  }
}

body[data-theme=dark] .markdown-body .tooltip {
  position: fixed;
  z-index: 9;
  border: 1px solid var(--juejin-layer-3-border);
  background: var(--juejin-layer-1);
  padding: 1em;
  text-align: center;
  width: 12em
}

body[data-theme=dark] .markdown-body .tooltip .user-name {
  line-height: 2
}

body[data-theme=dark] .markdown-body .tooltip .user-description {
  color: var(--juejin-gray-1-1);
  font-size: .7em
}

body[data-theme=dark] .markdown-body .tooltip .user-meta {
  margin-top: 1em
}

body[data-theme=dark] .markdown-body .tooltip .user-meta small {
  font-size: .7em
}

body[data-theme=dark] .markdown-body img.avatar {
  display: inline-block;
  width: 3em;
  height: 3em;
  border-radius: 50%
}

body[data-theme=dark] .markdown-body img.avatar.inline {
  width: 1.3em
}

body[data-theme=dark] .markdown-body img.inline {
  height: 1.3em;
  vertical-align: bottom
}

body[data-theme=dark] .markdown-body img.inline+span,
body[data-theme=dark] .markdown-body span+img.inline {
  margin-left: .5em
}

body[data-theme=dark] .markdown-body img.inline.square {
  width: 1.3em
}

body[data-theme=dark] .markdown-body img.desaturate {
  filter: grayscale(100%)
}

body[data-theme=dark] .markdown-body .table {
  color: var(--juejin-gray-1-1);
  width: 100%;
  font-size: .8em
}

body[data-theme=dark] .markdown-body .table th {
  padding: 1em .5em
}

body[data-theme=dark] .markdown-body .table td,
body[data-theme=dark] .markdown-body .table tr {
  padding: 1em .5em;
  vertical-align: top;
  text-align: left
}

body[data-theme=dark] .markdown-body .no-scroll {
  overflow: hidden
}

body[data-theme=dark] .markdown-body header {
  position: fixed;
  z-index: 5;
  top: 0;
  left: 0;
  right: 0;
  background: var(--juejin-layer-1);
  border-bottom: 1px solid var(--juejin-layer-3-border);
  color: var(--juejin-font-1);
  height: 4em
}

body[data-theme=dark] .markdown-body header .invite-tag {
  cursor: pointer;
  position: absolute;
  right: 5.18em;
  top: 4em;
  padding: .4em 1em .5em;
  background-color: var(--juejin-brand-1-normal);
  border-radius: 3px;
  z-index: 10
}

body[data-theme=dark] .markdown-body header .invite-tag:before {
  width: .8rem;
  height: .8rem;
  background-color: var(--juejin-brand-1-normal);
  content: "";
  position: absolute;
  left: 50%;
  margin-left: -.4rem;
  top: -.4rem;
  transform: rotate(45deg)
}

body[data-theme=dark] .markdown-body header .invite-tag .text {
  display: inline-block;
  font-size: .8em;
  color: var(--juejin-font-1)
}

body[data-theme=dark] .markdown-body header .invite-tag .close {
  cursor: pointer;
  display: inline-block;
  margin-left: 1em;
  position: relative;
  top: .05em;
  color: var(--juejin-font-1)
}

body[data-theme=dark] .markdown-body header .action {
  padding: 1.25em .75em;
  vertical-align: top
}

body[data-theme=dark] .markdown-body header .action-image {
  padding: 1em .75em
}

body[data-theme=dark] .markdown-body header .header-icon {
  font-size: 1.2em;
  line-height: 1.25em
}

body[data-theme=dark] .markdown-body header .dropdown-list {
  top: 4em;
  left: auto;
  right: 0
}

body[data-theme=dark] .markdown-body header .avatar-block {
  position: relative;
  height: 2em
}

body[data-theme=dark] .markdown-body header .avatar-block .have-new {
  position: absolute;
  top: -.1em;
  right: -.1em;
  background-color: var(--juejin-font_danger);
  width: 11px;
  height: 11px;
  border-radius: 50%;
  border: 1px solid var(--juejin-layer-3-border)
}

body[data-theme=dark] .markdown-body header .avatar.inline {
  width: 2em;
  height: 2em
}

body[data-theme=dark] .markdown-body header .home-logo {
  height: 2em
}

body[data-theme=dark] .markdown-body .main {
  margin-top: 4em
}

body[data-theme=dark] .markdown-body .main+.main {
  margin-top: 0
}

body[data-theme=dark] .markdown-body .container {
  width: 960px;
  position: relative
}

body[data-theme=dark] .markdown-body .container,
body[data-theme=dark] .markdown-body .inner {
  margin-left: auto;
  margin-right: auto
}

body[data-theme=dark] .markdown-body .inner {
  width: 25vw;
  min-width: 480px
}

body[data-theme=dark] .markdown-body .view.no-padding {
  padding: 0
}

body[data-theme=dark] .markdown-body .view article {
  margin: 2em 0
}

body[data-theme=dark] .markdown-body .view .inner {
  width: 50vw;
  max-width: 480px
}

@media (max-width:960px) {
  body[data-theme=dark] .markdown-body .container {
    width: 100%
  }

  body[data-theme=dark] .markdown-body .view>.container {
    padding: 0
  }
}

@media (max-width:600px) {
  body[data-theme=dark] .markdown-body header .action {
    padding-left: .5em;
    padding-right: .5em
  }

  body[data-theme=dark] .markdown-body .view .inner {
    width: 100%
  }

  body[data-theme=dark] .markdown-body .inner {
    width: 80vw;
    min-width: 0
  }
}

body[data-theme=dark] .markdown-body footer {
  position: fixed;
  z-index: 5;
  bottom: 0;
  left: 0;
  right: 0;
  padding: .5em 1em;
  background: var(--juejin-layer-2-1);
  border-top: 1px solid var(--juejin-layer-3-border)
}

body[data-theme=dark] .markdown-body .entry-view {
  padding: 0 1em;
  max-width: 600px
}

body[data-theme=dark] .markdown-body .entry-view .original-tag {
  background-color: transparent;
  border-color: var(--juejin-font-3);
  vertical-align: text-top;
  border-radius: 2px;
  padding: 0 .7em;
  font-size: 1em;
  margin-top: -.2em
}

body[data-theme=dark] .markdown-body .entry-view .entry-hero {
  margin: 0 -1em;
  height: 15em
}

body[data-theme=dark] .markdown-body .entry-view .entry-title {
  line-height: 1.5em;
  margin-bottom: .5em
}

body[data-theme=dark] .markdown-body .entry-view .entry-meta {
  font-size: .8em;
  color: var(--juejin-font-3)
}

body[data-theme=dark] .markdown-body .entry-view .entry-original-url {
  color: var(--juejin-font-3)
}

body[data-theme=dark] .markdown-body .entry-view .related-users {
  margin-top: 1em;
  padding-bottom: 4em
}

body[data-theme=dark] .markdown-body .entry-view .related-users .avatar {
  width: 2em;
  height: 2em
}

body[data-theme=dark] .markdown-body .entry-view .related-users li {
  margin-top: .5em;
  margin-right: .5em
}

body[data-theme=dark] .markdown-body .entry-view hr.no-margin {
  border-color: var(--juejin-layer-3-fill);
  margin: 2em -1em
}

body[data-theme=dark] .markdown-body .entry-pop-up {
  position: absolute;
  right: 0;
  bottom: 3em;
  transform: scale(0);
  transform-origin: 80% 100%;
  transition: transform .3s
}

body[data-theme=dark] .markdown-body .entry-pop-up.open {
  transform: scale(1)
}

body[data-theme=dark] .markdown-body .entry-pop-up .pop-up-content {
  position: relative;
  padding: .8em 1.2em;
  border-radius: 4px;
  font-size: .8em;
  background-color: var(--juejin-brand-1-normal);
  color: var(--juejin-font-1);
  font-weight: 700
}

body[data-theme=dark] .markdown-body .entry-pop-up .pop-up-content:after {
  content: " ";
  position: absolute;
  bottom: -1.2em;
  right: 20%;
  border: .7em solid transparent;
  border-top: .7em solid var(--juejin-brand-1-normal)
}

body[data-theme=dark] .markdown-body .entry-content {
  word-break: break-word;
  line-height: 1.7em;
  font-weight: 400
}

body[data-theme=dark] .markdown-body .entry-content::-webkit-scrollbar {
  display: none
}

body[data-theme=dark] .markdown-body .entry-content h1 {
  margin: 1em 0;
  line-height: 1.2
}

body[data-theme=dark] .markdown-body .entry-content p {
  line-height: 1.7em
}

body[data-theme=dark] .markdown-body .entry-content img,
body[data-theme=dark] .markdown-body .entry-content video {
  max-width: 100%;
  max-height: 668px
}

body[data-theme=dark] .markdown-body .entry-content img.full-screen {
  max-height: none
}

body[data-theme=dark] .markdown-body .entry-content figure {
  margin: 2em auto;
  text-align: center
}

body[data-theme=dark] .markdown-body .entry-content figure figcaption {
  text-align: center;
  font-size: .8em;
  line-height: 2em;
  color: var(--juejin-font-3)
}

body[data-theme=dark] .markdown-body .entry-content pre {
  line-height: 1.45em
}

body[data-theme=dark] .markdown-body .entry-content code,
body[data-theme=dark] .markdown-body .entry-content pre {
  font-family: Menlo, Monaco, Consolas, Courier New, monospace
}

body[data-theme=dark] .markdown-body .entry-content code {
  font-size: .8em;
  padding: .2em .4em;
  word-break: break-word;
  color: var(--juejin-font-2);
  background-color: var(--juejin-layer-2-2);
  border-radius: 2px
}

body[data-theme=dark] .markdown-body .entry-content pre>code {
  font-size: .8em;
  padding: .5em 1em;
  margin: 0;
  word-break: normal;
  color: var(--juejin-font-2)
}

body[data-theme=dark] .markdown-body .entry-content a {
  color: var(--juejin-brand-1-normal)
}

body[data-theme=dark] .markdown-body .entry-content a:active,
body[data-theme=dark] .markdown-body .entry-content a:hover {
  color: var(--juejin-brand-2-hover)
}

body[data-theme=dark] .markdown-body .entry-content table {
  display: block;
  font-size: .8em;
  width: 100%;
  overflow: auto;
  border: 1px solid var(--juejin-layer-3-border)
}

body[data-theme=dark] .markdown-body .entry-content thead {
  background: var(--juejin-layer-2-2);
  color: var(--juejin-font-4);
  text-align: left
}

body[data-theme=dark] .markdown-body .entry-content tr:nth-child(2n) {
  background-color: var(--juejin-layer-2-2)
}

body[data-theme=dark] .markdown-body .entry-content td,
body[data-theme=dark] .markdown-body .entry-content th {
  padding: .8em .5em;
  line-height: 1.5em
}

body[data-theme=dark] .markdown-body .entry-content td {
  min-width: 7.5em
}

body[data-theme=dark] .markdown-body .entry-content blockquote {
  margin: 1em 0;
  border-left: 4px solid var(--juejin-layer-3-border);
  padding: 0 1em;
  color: var(--juejin-font-3)
}

body[data-theme=dark] .markdown-body .entry-content blockquote>p {
  margin: .5em 0
}

body[data-theme=dark] .markdown-body .entry-content ol,
body[data-theme=dark] .markdown-body .entry-content ul {
  padding-left: 2em
}

body[data-theme=dark] .markdown-body .entry-content ol li,
body[data-theme=dark] .markdown-body .entry-content ul li {
  margin-bottom: .5em
}

body[data-theme=dark] .markdown-body .entry-content ol ol,
body[data-theme=dark] .markdown-body .entry-content ol ul,
body[data-theme=dark] .markdown-body .entry-content ul ol,
body[data-theme=dark] .markdown-body .entry-content ul ul {
  margin-top: .2em
}

body[data-theme=dark] .markdown-body pre>code.hljs {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  color: var(--juejin-font-1);
  background: var(--juejin-mask-2)
}

body[data-theme=dark] .markdown-body .hljs-comment,
body[data-theme=dark] .markdown-body .hljs-quote {
  color: var(--juejin-font-4);
  font-style: italic
}

body[data-theme=dark] .markdown-body .hljs-keyword,
body[data-theme=dark] .markdown-body .hljs-selector-tag,
body[data-theme=dark] .markdown-body .hljs-subst {
  color: #dcc6e0;
  font-weight: 700
}

body[data-theme=dark] .markdown-body .hljs-literal,
body[data-theme=dark] .markdown-body .hljs-tag .hljs-attr,
body[data-theme=dark] .markdown-body .hljs-template-variable,
body[data-theme=dark] .markdown-body .hljs-variable {
  color: #ffa07a
}

body[data-theme=dark] .markdown-body .hljs-addition,
body[data-theme=dark] .markdown-body .hljs-bullet,
body[data-theme=dark] .markdown-body .hljs-doctag,
body[data-theme=dark] .markdown-body .hljs-string,
body[data-theme=dark] .markdown-body .hljs-symbol {
  color: #abe338
}

body[data-theme=dark] .markdown-body .hljs-section,
body[data-theme=dark] .markdown-body .hljs-selector-id,
body[data-theme=dark] .markdown-body .hljs-title {
  color: #00e0e0;
  font-weight: 700
}

body[data-theme=dark] .markdown-body .hljs-subst {
  font-weight: 400
}

body[data-theme=dark] .markdown-body .hljs-class .hljs-title,
body[data-theme=dark] .markdown-body .hljs-number,
body[data-theme=dark] .markdown-body .hljs-params,
body[data-theme=dark] .markdown-body .hljs-type {
  color: #f5ab35
}

body[data-theme=dark] .markdown-body .hljs-attribute,
body[data-theme=dark] .markdown-body .hljs-name,
body[data-theme=dark] .markdown-body .hljs-tag {
  color: var(--juejin-font-golden-1);
  font-weight: 400
}

body[data-theme=dark] .markdown-body .hljs-link,
body[data-theme=dark] .markdown-body .hljs-regexp {
  color: var(--juejin-success-1-normal)
}

body[data-theme=dark] .markdown-body .hljs-bullet,
body[data-theme=dark] .markdown-body .hljs-symbol {
  color: var(--juejin-danger-2-deep)
}

body[data-theme=dark] .markdown-body .hljs-built_in,
body[data-theme=dark] .markdown-body .hljs-builtin-name {
  color: var(--juejin-sub-2-blue)
}

body[data-theme=dark] .markdown-body .hljs-meta {
  color: var(--juejin-font-4);
  font-weight: 700
}

body[data-theme=dark] .markdown-body .hljs-deletion {
  background: rgba(246, 66, 66, .24)
}

body[data-theme=dark] .markdown-body .hljs-addition {
  background: rgba(16, 173, 117, .24)
}

body[data-theme=dark] .markdown-body .hljs-emphasis {
  font-style: italic
}

body[data-theme=dark] .markdown-body .hljs-strong {
  font-weight: 700
}

body[data-theme=dark] .markdown-body .recommended-entries {
  margin: 2em -1em;
  padding: 1em;
  background-color: var(--juejin-layer-2-1);
  width: auto
}

body[data-theme=dark] .markdown-body .recommended-entries .box-content {
  padding: .5em 1em !important;
  background-color: var(--juejin-layer-1)
}

body[data-theme=dark] .markdown-body .related-users {
  margin-bottom: 1em
}

body[data-theme=dark] .markdown-body .related-users li {
  display: inline-block;
  margin: 1em 1em 0 0
}

body[data-theme=dark] .markdown-body .related-users.sparse li {
  margin: 1em 2em 0 0
}

body[data-theme=dark] .markdown-body .related-users .ion-more {
  width: 1.3em;
  text-align: center;
  display: inline-block
}

@media (max-width:600px) {
  body[data-theme=dark] .markdown-body .entry-view .entry-hero {
    height: 50vw
  }

  body[data-theme=dark] .markdown-body .entry-content>pre {
    margin: 0 -1em
  }

  body[data-theme=dark] .markdown-body .entry-content>pre>code {
    padding: .5em 1em/.8em
  }
}

body[data-theme=dark] .markdown-body i.spin {
  animation: spin .9s linear infinite
}

body[data-theme=dark] .markdown-body i+i,
body[data-theme=dark] .markdown-body i+span,
body[data-theme=dark] .markdown-body span+i {
  margin-left: .5em
}

body[data-theme=dark] .markdown-body header .new-entry-button {
  padding: .25em 1.5em;
  background-color: var(--juejin-brand-1-normal);
  border-radius: 2em;
  color: var(--juejin-font-1);
  line-height: 2em;
  font-size: .8em;
  font-weight: 700
}

body[data-theme=dark] .markdown-body header .share-editor-icon {
  font-size: 1.4em;
  line-height: 1em
}

body[data-theme=dark] .markdown-body header .share-editor-list {
  right: -2.5em
}

body[data-theme=dark] .markdown-body header .share-editor-list:before {
  content: "";
  width: 1em;
  height: 1em;
  border: 1px solid var(--juejin-layer-3-border);
  transform: rotate(45deg);
  position: absolute;
  top: -.5em;
  border-right: 0;
  border-bottom: 0;
  background-color: var(--juejin-layer-1);
  left: 50%;
  margin-left: -.5em;
  z-index: -1
}

body[data-theme=dark] .markdown-body header .login {
  border-radius: 2em;
  padding: .5em 1.5em
}

body[data-theme=dark] .markdown-body header .notification {
  position: relative
}

body[data-theme=dark] .markdown-body header .notification .notification-count {
  position: absolute;
  top: -.5em;
  right: -1em;
  padding: .2em .5em;
  border-radius: 1em;
  line-height: 1em;
  background-color: var(--juejin-layer-2-2);
  color: var(--juejin-brand-1-normal);
  font-size: .8em;
  font-weight: 500
}

body[data-theme=dark] .markdown-body .bottom-right {
  position: fixed;
  z-index: 5;
  bottom: 1em;
  right: 1em;
  text-align: center
}

body[data-theme=dark] .markdown-body .bottom-right .corner-circle {
  display: block;
  width: 2.5em;
  height: 2.5em;
  line-height: 2.5em;
  border-radius: 50%;
  border: 1px solid var(--juejin-layer-3-border);
  background-color: var(--juejin-layer-1);
  color: var(--juejin-font-4);
  cursor: pointer;
  box-shadow: 0 0 5px var(--juejin-layer-3-border);
  transition: text-shadow .3s, color .3s
}

body[data-theme=dark] .markdown-body .bottom-right .corner-circle:active,
body[data-theme=dark] .markdown-body .bottom-right .corner-circle:hover {
  box-shadow: 0 0 5px var(--juejin-layer-3-border)
}

body[data-theme=dark] .markdown-body .bottom-right .corner-circle.true {
  color: var(--juejin-brand-1-normal)
}

body[data-theme=dark] .markdown-body .bottom-right .corner-circle+.corner-circle {
  margin-top: 1em
}

body[data-theme=dark] .markdown-body .bottom-right .to-top-icon {
  font-size: 1.2em
}

body[data-theme=dark] .markdown-body .box {
  text-align: center;
  border-bottom: 1px solid var(--juejin-layer-3-border);
  color: var(--juejin-font-4);
  padding: 1em
}

@media (max-width:600px) {
  body[data-theme=dark] .markdown-body .bottom-right {
    display: none
  }
}

body[data-theme=dark] .markdown-body .entry-share-view {
  padding-top: 4em;
  padding-bottom: 3em
}

body[data-theme=dark] .markdown-body .entry-meta .action {
  display: inline-block;
  white-space: nowrap
}

body[data-theme=dark] .markdown-body .entry-meta .action:last-child {
  padding-right: 0
}

body[data-theme=dark] .markdown-body .read-origin {
  width: 100%;
  margin: 1em 0 2em
}

body[data-theme=dark] .markdown-body .share-by {
  margin-top: 1.5em;
  padding: 1em;
  border: 1px solid var(--juejin-layer-3-border);
  border-radius: 4px;
  background-color: var(--juejin-layer-1);
  font-size: .8em
}

body[data-theme=dark] .markdown-body .share-by .share-content {
  margin-top: .5em
}

body[data-theme=dark] .markdown-body .share-by .share-link {
  color: var(--juejin-brand-1-normal)
}

body[data-theme=dark] .markdown-body .ios-weibo-tip {
  position: fixed;
  display: none;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: var(--juejin-layer-1)
}

body[data-theme=dark] .markdown-body .ios-weibo-tip-img {
  width: 100%
}

@media (max-width:600px) {
  body[data-theme=dark] .markdown-body header {
    display: none
  }

  body[data-theme=dark] .markdown-body .entry-share-view {
    padding-top: 0;
    padding-bottom: 3em
  }

  body[data-theme=dark] .markdown-body h1 {
    font-size: 24px
  }

  body[data-theme=dark] .markdown-body h2 {
    font-size: 20px
  }

  body[data-theme=dark] .markdown-body h3 {
    font-size: 18px
  }
}

@keyframes subscribe-loading {
  0% {
    background-color: var(--juejin-layer-1)
  }

  to {
    background-color: var(--juejin-layer-3-fill)
  }
}

@keyframes spin {
  0% {
    transform: rotate(0)
  }

  to {
    transform: rotate(1turn)
  }
}

body[data-theme=dark] .markdown-body embed,
body[data-theme=dark] .markdown-body iframe,
body[data-theme=dark] .markdown-body video {
  max-width: 100% !important;
  margin: 0 !important
}

body[data-theme=dark] .markdown-body img.equation-invert {
  filter: invert(1)
}

body[data-theme=dark] .markdown-body .bytemd-mermaid {
  background-color: var(--juejin-font-white);
  filter: brightness(.94);
  margin: inherit
}

body[data-theme=dark] .markdown-body .math .katex {
  color: inherit;
  background: transparent;
  font-size: inherit;
  padding: inherit;
  margin: inherit
}

body[data-theme=dark] .markdown-body .katex-display,
body[data-theme=dark] .markdown-body .math-inline {
  padding: 4px
}

.main {
  position: relative
}

.medium-zoom-image,
.medium-zoom-overlay {
  z-index: 10000
}

.markdown-body {
  overflow-x: hidden;
  -webkit-user-select: text;
  -moz-user-select: text;
  user-select: text
}

.markdown-body .math-inline {
  font-size: 20px
}

.markdown-body .code-editor-container {
  width: 100%;
  height: 432px
}

@media (max-width:600px) {
  .markdown-body .code-editor-container {
    height: 104vw;
    min-height: 392px
  }
}

@keyframes skeleton-keyframes-data-v-c1f3c8ba {
  0% {
    background-position: 0 0
  }

  to {
    background-position: 480px 0
  }
}

.audit-tag[data-v-c1f3c8ba] {
  display: inline-block;
  box-sizing: border-box;
  padding: 3px 8px;
  border-radius: 5px;
  opacity: .8;
  font-size: 12px;
  font-weight: 400;
  text-align: center;
  white-space: nowrap
}

.audit-wait[data-v-c1f3c8ba] {
  color: #ff7d00;
  background: #fff7e8
}

.audit-fail[data-v-c1f3c8ba] {
  color: #f03535;
  background: #ffece8
}

@keyframes skeleton-keyframes-data-v-50548bfc {
  0% {
    background-position: 0 0
  }

  to {
    background-position: 480px 0
  }
}

.dislike-modal[data-v-50548bfc] .byte-modal__content {
  top: 275px;
  width: 311px !important;
  height: 219px !important;
  padding: 2.33rem 1.333rem 2rem !important;
  box-sizing: border-box
}

.dislike-modal[data-v-50548bfc] .byte-modal__content .byte-modal__body {
  height: 100%
}

.dislike-modal[data-v-50548bfc] .byte-modal__content .container {
  display: flex;
  height: 100%;
  flex-direction: column;
  justify-content: space-around
}

.dislike-modal[data-v-50548bfc] .byte-modal__content .container:after {
  display: none !important
}

.dislike-modal[data-v-50548bfc] .byte-modal__content .container .title {
  color: var(--juejin-font-2);
  font-size: 18px;
  font-weight: 700;
  text-align: center
}

.dislike-modal[data-v-50548bfc] .byte-modal__content .container .content {
  font-size: 14px;
  color: var(--juejin-font-2);
  text-align: center
}

.dislike-modal[data-v-50548bfc] .byte-modal__content .container .content .username {
  color: #ff7426
}

.dislike-modal[data-v-50548bfc] .byte-modal__content .container .footer {
  display: flex
}

.dislike-modal[data-v-50548bfc] .byte-modal__content .container .footer .btn-confirm {
  background: var(--juejin-brand-1-normal);
  border-radius: 4px;
  outline: none;
  border: none;
  color: #fff;
  font-size: 1.167rem;
  text-align: center;
  line-height: 3.333rem;
  width: 10rem;
  height: 3.333rem;
  box-sizing: border-box;
  cursor: pointer;
  padding: 0;
  margin-left: 1.667rem
}

.dislike-modal[data-v-50548bfc] .byte-modal__content .container .footer .btn-confirm:active,
.dislike-modal[data-v-50548bfc] .byte-modal__content .container .footer .btn-confirm:hover {
  background-color: var(--juejin-brand-2-hover)
}

.dislike-modal[data-v-50548bfc] .byte-modal__content .container .footer .btn-confirm:disabled {
  background: var(--juejin-brand-4-disable);
  cursor: not-allowed
}

.dislike-modal[data-v-50548bfc] .byte-modal__content .container .footer .btn-cancel {
  background: var(--juejin-brand-fill1-normal);
  border-radius: 4px;
  outline: none;
  border: 1px solid var(--juejin-brand-4-disable);
  color: var(--juejin-font-brand1-normal);
  font-size: 1.167rem;
  text-align: center;
  line-height: 3.333rem;
  width: 10rem;
  height: 3.333rem;
  box-sizing: border-box;
  cursor: pointer;
  padding: 0
}

.dislike-modal[data-v-50548bfc] .byte-modal__content .container .footer .btn-cancel:active,
.dislike-modal[data-v-50548bfc] .byte-modal__content .container .footer .btn-cancel:hover {
  color: #1171ee;
  border-color: #1171ee
}

.fade-enter-active[data-v-10b7b0e6],
.fade-leave-active[data-v-10b7b0e6] {
  transition: opacity .2s
}

.fade-enter[data-v-10b7b0e6],
.fade-leave-to[data-v-10b7b0e6] {
  opacity: 0
}

.image-box[data-v-10b7b0e6] {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  line-height: 0;
  background-color: rgba(0, 0, 0, .8);
  overflow: auto
}

.image[data-v-10b7b0e6] {
  position: absolute;
  transition: all .2s;
  cursor: zoom-out
}

.image.error[data-v-10b7b0e6] {
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%)
}

.fade-enter-active[data-v-93a27598],
.fade-leave-active[data-v-93a27598] {
  transition: opacity .2s
}

.fade-enter[data-v-93a27598],
.fade-leave-to[data-v-93a27598] {
  opacity: 0
}

.image-box[data-v-93a27598] {
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  line-height: 0;
  background-color: rgba(0, 0, 0, .8);
  overflow: auto;
  -webkit-overflow-scrolling: touch
}

.image-box.large-long[data-v-93a27598] {
  display: block
}

.image[data-v-93a27598] {
  position: absolute;
  max-width: 100%;
  transition: all .1s
}

.image.zoom[data-v-93a27598] {
  max-width: 1000%
}

.image.error[data-v-93a27598] {
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%)
}

[data-v-34cee571] .image-viewer {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 10000
}

[data-v-34cee571] .image-viewer.loading:after {
  content: "";
  position: absolute;
  top: 0;
  right: 100%;
  width: 50%;
  height: .2rem;
  background-color: #007fff;
  z-index: 1;
  animation: pro-data-v-34cee571 1s ease-in-out infinite;
  animation-delay: 1s
}

@keyframes pro-data-v-34cee571 {
  0% {
    transform: translateZ(0)
  }

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

@keyframes skeleton-keyframes-data-v-2320b114 {
  0% {
    background-position: 0 0
  }

  to {
    background-position: 480px 0
  }
}

.comment-input[data-v-2320b114] {
  position: relative
}

.comment-input[data-v-2320b114],
.comment-input[data-v-2320b114] * {
  box-sizing: border-box
}

.comment-input[data-v-2320b114] .emoji-container .picker:after {
  left: 10px
}

.comment-input .input-box[data-v-2320b114] {
  min-height: 88px;
  font-size: 0;
  transition: all .3s;
  background: var(--juejin-gray-2);
  border: 1px solid transparent;
  border-radius: 4px;
  position: relative
}

.comment-input .input-box[data-v-2320b114]:hover {
  background: var(--juejin-gray-1-1)
}

.comment-input .input-box.focused[data-v-2320b114] {
  background: var(--juejin-layer-1)
}

.comment-input .input-box.focused[data-v-2320b114],
.comment-input .input-box.not-empty[data-v-2320b114] {
  border-color: var(--juejin-brand-1-normal)
}

.comment-input .input-box.disabled[data-v-2320b114] {
  border: 1px solid transparent;
  background: var(--juejin-gray-2);
  cursor: not-allowed
}

.comment-input .input-box .rich-input[data-v-2320b114] {
  position: relative;
  padding: 8px 12px;
  color: var(--juejin-font-2);
  outline: none;
  box-sizing: border-box;
  line-height: 28px;
  font-size: 16px;
  min-height: 44px;
  max-height: 100px;
  overflow: auto
}

.comment-input .input-box .rich-input[data-v-2320b114]:-webkit-scrollbar {
  width: 4px;
  height: 30px
}

.comment-input .input-box .rich-input[data-v-2320b114]::-webkit-scrollbar-thumb {
  background-color: var(--juejin-gray-1-1);
  outline: none;
  border-radius: 50px
}

.comment-input .input-box .rich-input[data-v-2320b114]::-webkit-scrollbar-track {
  box-shadow: none;
  border-radius: 2px
}

.comment-input .input-box .rich-input[data-v-2320b114]:before {
  content: attr(placeholder);
  position: absolute;
  pointer-events: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  color: #8a919f
}

.comment-input .input-box .rich-input[data-v-2320b114]:not(.empty):before {
  display: none
}

.comment-input .input-box .rich-input[data-v-2320b114]:empty:before {
  color: var(--juejin-font-3)
}

.comment-input .input-box .rich-input[data-v-2320b114] .emoji {
  vertical-align: sub;
  cursor: default;
  height: 20px;
  margin: 0 2px
}

.comment-input .input-box .image-preview-box[data-v-2320b114] {
  display: inline-block;
  position: relative;
  margin-left: 12px;
  align-self: flex-start
}

.comment-input .input-box .image-preview-box .image-preview[data-v-2320b114] {
  width: 64px;
  height: 64px;
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: cover;
  border-radius: 4px;
  border: 1px solid var(--juejin-gray-1-2)
}

.comment-input .input-box .image-preview-box .clean-btn[data-v-2320b114] {
  position: absolute;
  top: 4px;
  right: 4px;
  cursor: pointer;
  opacity: .8;
  transition: all .2s
}

.comment-input .input-box .image-preview-box .clean-btn[data-v-2320b114]:hover {
  opacity: 1
}

.comment-input .input-box .action-box[data-v-2320b114] {
  height: 48px;
  padding: 0 12px 0 6px;
  display: flex;
  align-items: center
}

.comment-input .input-box .action-box[data-v-2320b114] .emoji-btn {
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none
}

.comment-input .input-box .action-box[data-v-2320b114] .emoji-btn .emoji-box {
  padding: 6px
}

.comment-input .input-box .action-box[data-v-2320b114] .emoji-btn .emoji-box .icon {
  fill: var(--juejin-font-3);
  margin: 0;
  width: 20px;
  height: 20px;
  transition: fill .3s
}

.comment-input .input-box .action-box[data-v-2320b114] .emoji-btn .emoji-box.active .icon,
.comment-input .input-box .action-box[data-v-2320b114] .emoji-btn .emoji-box:hover .icon {
  fill: var(--juejin-brand-1-normal)
}

.comment-input .input-box .action-box .image-btn[data-v-2320b114] {
  cursor: pointer;
  margin-left: 12px;
  padding: 6px
}

.comment-input .input-box .action-box .image-btn .icon[data-v-2320b114] {
  fill: var(--juejin-font-3);
  background-repeat: no-repeat;
  background-size: cover;
  margin: 0;
  transition: fill .3s;
  width: 20px;
  height: 20px;
  display: block
}

.comment-input .input-box .action-box .image-btn.active .icon[data-v-2320b114],
.comment-input .input-box .action-box .image-btn:hover .icon[data-v-2320b114] {
  fill: var(--juejin-brand-1-normal)
}

.comment-input .input-box .action-box .text-count-wrapper[data-v-2320b114] {
  display: flex;
  align-items: center;
  color: var(--juejin-font-3);
  margin-right: 16px
}

.comment-input .input-box .action-box .text-count-wrapper .text-count[data-v-2320b114] {
  font-size: 14px;
  font-weight: 400;
  line-height: 28px;
  margin-right: 8px
}

.comment-input .input-box .action-box .text-count-wrapper .text-count .text-count-real[data-v-2320b114] {
  color: var(--juejin-font-2)
}

.comment-input .input-box .action-box .text-count-wrapper .text-count.danger .text-count-real[data-v-2320b114] {
  color: var(--juejin-danger-1-normal)
}

.comment-input .input-box .action-box .text-count-wrapper .count-info[data-v-2320b114] {
  line-height: normal
}

.comment-input .input-box .action-box .text-count-wrapper .count-info .info-icon[data-v-2320b114] {
  cursor: pointer
}

.comment-input .input-box .action-box .submit-btn[data-v-2320b114] {
  border-radius: 4px;
  background: var(--juejin-brand-4-disable);
  height: 32px;
  flex-shrink: 0;
  color: var(--juejin-font-white);
  font-size: 14px;
  font-weight: 400;
  line-height: 22px;
  display: flex;
  justify-content: center;
  align-items: center;
  min-width: 60px
}

.comment-input .input-box .action-box .submit-btn.disabled[data-v-2320b114] {
  background: var(--juejin-brand-4-disable);
  cursor: not-allowed
}

.comment-input .input-box .action-box .submit-btn.active[data-v-2320b114] {
  background: var(--juejin-brand-1-normal);
  cursor: pointer
}

.comment-input .input-box .action-box .submit-btn.active[data-v-2320b114]:hover {
  background: var(--juejin-brand-2-hover)
}

.comment-input .input-box .action-box .submit-btn.loading[data-v-2320b114] {
  cursor: progress
}

.comment-input .input-box .action-box.active[data-v-2320b114] .emoji-btn .emoji-box .icon {
  fill: var(--juejin-font-2)
}

.comment-input .input-box .action-box.active[data-v-2320b114] .emoji-btn .emoji-box.active .icon,
.comment-input .input-box .action-box.active[data-v-2320b114] .emoji-btn .emoji-box:hover .icon {
  fill: var(--juejin-brand-1-normal)
}

.comment-input .input-box .action-box.active .image-btn .icon[data-v-2320b114] {
  fill: var(--juejin-font-2)
}

.comment-input .input-box .action-box.active .image-btn.active .icon[data-v-2320b114],
.comment-input .input-box .action-box.active .image-btn:hover .icon[data-v-2320b114] {
  fill: var(--juejin-brand-1-normal)
}

.comment-input .input-box .action-box.active .text-count[data-v-2320b114] {
  color: var(--juejin-font-2)
}

.comment-input .input-box .action-box.active .text-count.danger[data-v-2320b114] {
  color: var(--juejin-danger-1-normal)
}

.comment-input .input-box .action-box.disabled[data-v-2320b114] .emoji-btn .emoji-box {
  cursor: not-allowed
}

.comment-input .input-box .action-box.disabled[data-v-2320b114] .emoji-btn .emoji-box.active .icon,
.comment-input .input-box .action-box.disabled[data-v-2320b114] .emoji-btn .emoji-box .icon,
.comment-input .input-box .action-box.disabled[data-v-2320b114] .emoji-btn .emoji-box:hover .icon {
  fill: var(--juejin-font-3)
}

.comment-input .input-box .action-box.disabled .image-btn[data-v-2320b114] {
  cursor: not-allowed
}

.comment-input .input-box .action-box.disabled .image-btn.active .icon[data-v-2320b114],
.comment-input .input-box .action-box.disabled .image-btn .icon[data-v-2320b114],
.comment-input .input-box .action-box.disabled .image-btn:hover .icon[data-v-2320b114] {
  fill: var(--juejin-font-3)
}

.comment-input .input-box .action-box.disabled .text-count[data-v-2320b114] {
  color: var(--juejin-font-2)
}

.comment-input.small .input-box .rich-input[data-v-2320b114] {
  padding: 8px 12px;
  color: var(--juejin-font-1);
  line-height: 24px;
  font-size: 14px;
  min-height: 44px;
  max-height: 92px
}

.comment-input.small .input-box .action-box[data-v-2320b114] {
  height: 48px;
  padding: 0 12px 0 6px
}

.comment-input.small .input-box .action-box[data-v-2320b114] .emoji-btn .emoji-box .icon {
  margin: 0;
  width: 20px;
  height: 20px;
  transition: fill .3s
}

.comment-input.small .input-box .action-box .image-btn[data-v-2320b114] {
  margin-left: 8px
}

.comment-input.small .input-box .action-box .text-count-wrapper[data-v-2320b114] {
  margin-right: 12px
}

.comment-input.small .input-box .action-box .text-count[data-v-2320b114] {
  font-size: 12px;
  line-height: 28px
}

.comment-input.small .input-box .action-box .submit-btn[data-v-2320b114] {
  font-size: 12px;
  height: 28px
}

@keyframes skeleton-keyframes-data-v-673c9859 {
  0% {
    background-position: 0 0
  }

  to {
    background-position: 480px 0
  }
}

.comment-form[data-v-673c9859] {
  display: flex;
  position: relative;
  border-radius: 2px;
  flex-direction: column
}

.comment-form .content[data-v-673c9859] {
  display: flex;
  align-items: flex-start
}

.comment-form .content .form-box[data-v-673c9859] {
  flex: 1
}

.comment-form .avatar-box[data-v-673c9859] {
  flex: 0 0 auto
}

.comment-form .avatar[data-v-673c9859] {
  margin-right: 16px;
  width: 40px;
  height: 40px;
  border-radius: 50%
}

.comment-form .login-guide[data-v-673c9859] {
  width: 100%;
  height: 100%;
  background-color: var(--juejin-background);
  position: absolute;
  top: 0;
  left: 0;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  color: var(--juejin-font-1);
  font-size: 15px;
  font-weight: 400
}

.comment-form .login-guide-button[data-v-673c9859] {
  color: var(--juejin-brand-1-normal);
  font-weight: 500;
  cursor: pointer;
  margin: 0 4px
}

@keyframes skeleton-keyframes-data-v-734d9ec8 {
  0% {
    background-position: 0 0
  }

  to {
    background-position: 480px 0
  }
}

.username[data-v-734d9ec8] {
  font-size: 1.25rem;
  font-weight: 600;
  color: var(--juejin-font-1);
  display: flex;
  align-items: center
}

.username .name[data-v-734d9ec8] {
  display: inline-block;
  vertical-align: top;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap
}

.tag[data-v-734d9ec8] {
  flex: none;
  font-size: .8rem;
  margin: 0 0 0 .433rem;
  padding: 0 .4rem;
  height: 1.2rem;
  line-height: 1.2rem;
  border-radius: 4px
}

.robot-tag[data-v-734d9ec8] {
  background: var(--juejin-layer-golden-1);
  color: var(--juejin-font-golden-1)
}

.robot-offline[data-v-734d9ec8] {
  background: var(--juejin-component-hover);
  color: var(--juejin-font-2)
}

@keyframes skeleton-keyframes-data-v-5ae2b6bc {
  0% {
    background-position: 0 0
  }

  to {
    background-position: 480px 0
  }
}

.emoji.old[data-v-5ae2b6bc] {
  transform: scale(.9)
}

@media (max-width:600px) {
  .web-only[data-v-5ae2b6bc] {
    display: none
  }
}

.container[data-v-5ae2b6bc] {
  width: 14px;
  height: 14px;
  position: relative;
  border-top: 1px solid var(--juejin-layer-1);
  transform: rotate(180deg);
  display: inline-block
}

.container .triangle[data-v-5ae2b6bc] {
  position: absolute;
  margin: auto;
  top: -6px;
  left: 0;
  right: 0;
  width: 10px;
  height: 10px;
  transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  border-right: 1px solid var(--juejin-gray-1-2);
  border-bottom: 1px solid var(--juejin-gray-1-2);
  background: var(--juejin-layer-1)
}

@keyframes skeleton-keyframes-data-v-487cbd49 {
  0% {
    background-position: 0 0
  }

  to {
    background-position: 480px 0
  }
}

.popover-box[data-v-487cbd49] {
  display: flex;
  align-items: center
}

.popover-content[data-v-487cbd49] {
  position: fixed;
  top: 20rem;
  left: 2rem;
  padding: 1.333rem 1.333rem 1.833rem;
  width: 267px;
  font-weight: 400;
  line-height: 1.2;
  background-color: var(--juejin-popup);
  border: 1px solid #ebebeb;
  box-shadow: 0 2px 6px 0 rgba(0, 0, 0, .08);
  box-sizing: border-box;
  border-radius: 2px;
  cursor: default;
  z-index: 250
}

@media (max-width:600px) {
  .popover-content[data-v-487cbd49] {
    display: none
  }
}

span.triangle-bottom[data-v-487cbd49] {
  position: absolute;
  bottom: -15px;
  left: 50%;
  margin-left: -5px
}

span.triangle-bottom.container[data-v-487cbd49] {
  transform: rotate(0deg)
}

span.triangle-bottom.isTop[data-v-487cbd49] {
  bottom: auto;
  top: -15px
}

span.triangle-bottom.isTop.container[data-v-487cbd49] {
  transform: rotate(180deg)
}

span.triangle-bottom[data-v-487cbd49] .triangle {
  background-color: var(--juejin-popup);
  border-right: 1px solid var(--juejin-popup);
  border-bottom: 1px solid var(--juejin-popup)
}

.fade-enter-active[data-v-487cbd49],
.fade-leave-active[data-v-487cbd49] {
  transition: opacity .2s
}

.fade-enter[data-v-487cbd49],
.fade-leave-to[data-v-487cbd49] {
  opacity: 0
}

@keyframes skeleton-keyframes-data-v-e1243e7c {
  0% {
    background-position: 0 0
  }

  to {
    background-position: 480px 0
  }
}

.ui-btn[data-v-e1243e7c] {
  box-sizing: border-box;
  font-size: 14px;
  line-height: 22px;
  padding: 5px 16px;
  color: var(--juejin-font-white);
  border: none;
  white-space: nowrap
}

.ui-btn .img[data-v-e1243e7c] {
  width: 14px;
  height: 14px
}

.ui-btn.primary[data-v-e1243e7c] {
  background-color: var(--juejin-brand-1-normal)
}

.ui-btn.primary[data-v-e1243e7c]:focus,
.ui-btn.primary[data-v-e1243e7c]:hover {
  background-color: var(--juejin-brand-2-hover)
}

.ui-btn.primary[data-v-e1243e7c]:active {
  background-color: var(--juejin-brand-3-click)
}

.ui-btn.primary[data-v-e1243e7c]:disabled {
  background-color: var(--juejin-brand-4-disable)
}

.ui-btn.line[data-v-e1243e7c] {
  border-radius: 4px;
  background-color: var(--juejin-brand-fill1-normal);
  color: var(--juejin-font-brand1-normal);
  border: 1px solid var(--juejin-brand-stroke1-normal)
}

.ui-btn.line[data-v-e1243e7c]:focus,
.ui-btn.line[data-v-e1243e7c]:hover {
  background-color: var(--juejin-brand-fill2-hover)
}

.ui-btn.line[data-v-e1243e7c]:active {
  background-color: var(--juejin-brand-fill3-click)
}

.ui-btn.line[data-v-e1243e7c]:disabled {
  background-color: var(--juejin-brand-fill1-normal)
}

.ui-btn.line[data-v-e1243e7c]:focus,
.ui-btn.line[data-v-e1243e7c]:hover {
  color: var(--juejin-font-brand2-hover)
}

.ui-btn.line[data-v-e1243e7c]:active {
  color: var(--juejin-font-brand3-click)
}

.ui-btn.line[data-v-e1243e7c]:disabled {
  color: var(--juejin-font-brand4-disable)
}

.ui-btn.line[data-v-e1243e7c]:focus,
.ui-btn.line[data-v-e1243e7c]:hover {
  border: 1px solid var(--juejin-brand-stroke2-hover)
}

.ui-btn.line[data-v-e1243e7c]:active {
  border: 1px solid var(--juejin-brand-stroke3-click)
}

.ui-btn.line[data-v-e1243e7c]:disabled {
  border: 1px solid var(--juejin-brand-stroke1-normal)
}

.ui-btn.line.alert[data-v-e1243e7c] {
  border-radius: 4px;
  background-color: var(--juejin-brand-fill1-normal);
  color: var(--juejin-font-brand1-normal);
  border: 1px solid var(--juejin-brand-stroke1-normal)
}

.ui-btn.line.alert[data-v-e1243e7c]:focus,
.ui-btn.line.alert[data-v-e1243e7c]:hover {
  background-color: var(--juejin-brand-fill2-hover)
}

.ui-btn.line.alert[data-v-e1243e7c]:active {
  background-color: var(--juejin-brand-fill3-click)
}

.ui-btn.line.alert[data-v-e1243e7c]:disabled {
  background-color: var(--juejin-brand-fill1-normal)
}

.ui-btn.line.alert[data-v-e1243e7c]:focus,
.ui-btn.line.alert[data-v-e1243e7c]:hover {
  color: var(--juejin-font-brand2-hover)
}

.ui-btn.line.alert[data-v-e1243e7c]:active {
  color: var(--juejin-font-brand3-click)
}

.ui-btn.line.alert[data-v-e1243e7c]:disabled {
  color: var(--juejin-font-brand4-disable)
}

.ui-btn.line.alert[data-v-e1243e7c]:focus,
.ui-btn.line.alert[data-v-e1243e7c]:hover {
  border: 1px solid var(--juejin-brand-stroke2-hover)
}

.ui-btn.line.alert[data-v-e1243e7c]:active {
  border: 1px solid var(--juejin-brand-stroke3-click)
}

.ui-btn.line.alert[data-v-e1243e7c]:disabled {
  border: 1px solid var(--juejin-brand-stroke1-normal)
}

.ui-btn.line.gray[data-v-e1243e7c] {
  border-radius: 4px;
  background-color: var(--juejin-brand-fill1-normal);
  color: var(--juejin-font-brand1-normal);
  border: 1px solid var(--juejin-brand-stroke1-normal)
}

.ui-btn.line.gray[data-v-e1243e7c]:focus,
.ui-btn.line.gray[data-v-e1243e7c]:hover {
  background-color: var(--juejin-brand-fill2-hover)
}

.ui-btn.line.gray[data-v-e1243e7c]:active {
  background-color: var(--juejin-brand-fill3-click)
}

.ui-btn.line.gray[data-v-e1243e7c]:disabled {
  background-color: var(--juejin-brand-fill1-normal)
}

.ui-btn.line.gray[data-v-e1243e7c]:focus,
.ui-btn.line.gray[data-v-e1243e7c]:hover {
  color: var(--juejin-font-brand2-hover)
}

.ui-btn.line.gray[data-v-e1243e7c]:active {
  color: var(--juejin-font-brand3-click)
}

.ui-btn.line.gray[data-v-e1243e7c]:disabled {
  color: var(--juejin-font-brand4-disable)
}

.ui-btn.line.gray[data-v-e1243e7c]:focus,
.ui-btn.line.gray[data-v-e1243e7c]:hover {
  border: 1px solid var(--juejin-brand-stroke2-hover)
}

.ui-btn.line.gray[data-v-e1243e7c]:active {
  border: 1px solid var(--juejin-brand-stroke3-click)
}

.ui-btn.line.gray[data-v-e1243e7c]:disabled {
  border: 1px solid var(--juejin-brand-stroke1-normal)
}

.ui-btn.secondary[data-v-e1243e7c] {
  background-color: #fafafa;
  color: #1d2129
}

.ui-btn.secondary[data-v-e1243e7c]:focus,
.ui-btn.secondary[data-v-e1243e7c]:hover {
  background-color: #e5e6eb
}

.ui-btn.secondary[data-v-e1243e7c]:active {
  background-color: #c9cdd4
}

.ui-btn.secondary[data-v-e1243e7c]:disabled {
  background-color: #fafafa
}

.ui-btn.secondary[data-v-e1243e7c]:active,
.ui-btn.secondary[data-v-e1243e7c]:focus,
.ui-btn.secondary[data-v-e1243e7c]:hover {
  color: #1d2129
}

.ui-btn.secondary[data-v-e1243e7c]:disabled {
  color: #c9cdd4
}

.ui-btn.text[data-v-e1243e7c] {
  border-radius: 4px;
  background-color: var(--juejin-brand-fill1-normal);
  color: var(--juejin-font-brand1-normal);
  background-color: transparent;
  border: none
}

.ui-btn.text[data-v-e1243e7c]:focus,
.ui-btn.text[data-v-e1243e7c]:hover {
  background-color: var(--juejin-brand-fill2-hover)
}

.ui-btn.text[data-v-e1243e7c]:active {
  background-color: var(--juejin-brand-fill3-click)
}

.ui-btn.text[data-v-e1243e7c]:disabled {
  background-color: var(--juejin-brand-fill1-normal)
}

.ui-btn.text[data-v-e1243e7c]:focus,
.ui-btn.text[data-v-e1243e7c]:hover {
  color: var(--juejin-font-brand2-hover)
}

.ui-btn.text[data-v-e1243e7c]:active {
  color: var(--juejin-font-brand3-click)
}

.ui-btn.text[data-v-e1243e7c]:disabled {
  color: var(--juejin-font-brand4-disable)
}

.ui-btn.text[data-v-e1243e7c]:focus,
.ui-btn.text[data-v-e1243e7c]:hover {
  border: 1px solid var(--juejin-brand-stroke2-hover)
}

.ui-btn.text[data-v-e1243e7c]:active {
  border: 1px solid var(--juejin-brand-stroke3-click)
}

.ui-btn.text[data-v-e1243e7c]:disabled {
  border: 1px solid var(--juejin-brand-stroke1-normal)
}

.ui-btn.text[data-v-e1243e7c]:active,
.ui-btn.text[data-v-e1243e7c]:disabled,
.ui-btn.text[data-v-e1243e7c]:focus,
.ui-btn.text[data-v-e1243e7c]:hover {
  border: none
}

.ui-btn.text.alert[data-v-e1243e7c] {
  border-radius: 4px;
  background-color: var(--juejin-brand-fill1-normal);
  color: var(--juejin-font-brand1-normal);
  border: none
}

.ui-btn.text.alert[data-v-e1243e7c]:focus,
.ui-btn.text.alert[data-v-e1243e7c]:hover {
  background-color: var(--juejin-brand-fill2-hover)
}

.ui-btn.text.alert[data-v-e1243e7c]:active {
  background-color: var(--juejin-brand-fill3-click)
}

.ui-btn.text.alert[data-v-e1243e7c]:disabled {
  background-color: var(--juejin-brand-fill1-normal)
}

.ui-btn.text.alert[data-v-e1243e7c]:focus,
.ui-btn.text.alert[data-v-e1243e7c]:hover {
  color: var(--juejin-font-brand2-hover)
}

.ui-btn.text.alert[data-v-e1243e7c]:active {
  color: var(--juejin-font-brand3-click)
}

.ui-btn.text.alert[data-v-e1243e7c]:disabled {
  color: var(--juejin-font-brand4-disable)
}

.ui-btn.text.alert[data-v-e1243e7c]:focus,
.ui-btn.text.alert[data-v-e1243e7c]:hover {
  border: 1px solid var(--juejin-brand-stroke2-hover)
}

.ui-btn.text.alert[data-v-e1243e7c]:active {
  border: 1px solid var(--juejin-brand-stroke3-click)
}

.ui-btn.text.alert[data-v-e1243e7c]:disabled {
  border: 1px solid var(--juejin-brand-stroke1-normal)
}

.ui-btn.text.alert[data-v-e1243e7c]:active,
.ui-btn.text.alert[data-v-e1243e7c]:disabled,
.ui-btn.text.alert[data-v-e1243e7c]:focus,
.ui-btn.text.alert[data-v-e1243e7c]:hover {
  border: none
}

.ui-btn.text.gray[data-v-e1243e7c] {
  border-radius: 4px;
  background-color: var(--juejin-brand-fill1-normal);
  color: var(--juejin-font-brand1-normal);
  border: none
}

.ui-btn.text.gray[data-v-e1243e7c]:focus,
.ui-btn.text.gray[data-v-e1243e7c]:hover {
  background-color: var(--juejin-brand-fill2-hover)
}

.ui-btn.text.gray[data-v-e1243e7c]:active {
  background-color: var(--juejin-brand-fill3-click)
}

.ui-btn.text.gray[data-v-e1243e7c]:disabled {
  background-color: var(--juejin-brand-fill1-normal)
}

.ui-btn.text.gray[data-v-e1243e7c]:focus,
.ui-btn.text.gray[data-v-e1243e7c]:hover {
  color: var(--juejin-font-brand2-hover)
}

.ui-btn.text.gray[data-v-e1243e7c]:active {
  color: var(--juejin-font-brand3-click)
}

.ui-btn.text.gray[data-v-e1243e7c]:disabled {
  color: var(--juejin-font-brand4-disable)
}

.ui-btn.text.gray[data-v-e1243e7c]:focus,
.ui-btn.text.gray[data-v-e1243e7c]:hover {
  border: 1px solid var(--juejin-brand-stroke2-hover)
}

.ui-btn.text.gray[data-v-e1243e7c]:active {
  border: 1px solid var(--juejin-brand-stroke3-click)
}

.ui-btn.text.gray[data-v-e1243e7c]:disabled {
  border: 1px solid var(--juejin-brand-stroke1-normal)
}

.ui-btn.text.gray[data-v-e1243e7c]:active,
.ui-btn.text.gray[data-v-e1243e7c]:disabled,
.ui-btn.text.gray[data-v-e1243e7c]:focus,
.ui-btn.text.gray[data-v-e1243e7c]:hover {
  border: none
}

.ui-btn.attention[data-v-e1243e7c] {
  display: flex;
  align-items: center
}

.ui-btn.attention.line.cancel[data-v-e1243e7c],
.ui-btn.attention.line.cancel[data-v-e1243e7c]:active,
.ui-btn.attention.line.cancel[data-v-e1243e7c]:disabled,
.ui-btn.attention.line.cancel[data-v-e1243e7c]:focus,
.ui-btn.attention.line.cancel[data-v-e1243e7c]:hover {
  border: 1px solid #fafafa
}

.ui-btn.attention .img[data-v-e1243e7c] {
  flex: none;
  margin-right: 4px
}

.ui-btn.attention.medium[data-v-e1243e7c] {
  text-align: right;
  padding: 5px 23px 5px 16px
}

.ui-btn.attention.medium .img[data-v-e1243e7c] {
  margin-right: 14px
}

.ui-btn.attention.medium.cancel[data-v-e1243e7c]:not(.loading) {
  padding-right: 16px
}

.ui-btn.attention.medium.cancel:not(.loading) .img[data-v-e1243e7c] {
  margin-right: 6px
}

.ui-btn.attention.small[data-v-e1243e7c] {
  padding: 3px 15px 3px 8px
}

.ui-btn.attention.small .img[data-v-e1243e7c] {
  margin-right: 10px
}

.ui-btn.attention.small.cancel[data-v-e1243e7c]:not(.loading) {
  padding-right: 8px
}

.ui-btn.attention.small.cancel:not(.loading) .img[data-v-e1243e7c] {
  margin-right: 3px
}

.ui-btn.attention.mini[data-v-e1243e7c] {
  width: 60px;
  height: 28px;
  justify-content: center
}

.ui-btn.attention.cancel[data-v-e1243e7c] {
  background-color: rgba(81, 87, 103, .05);
  color: var(--juejin-font-3);
  border: 1px solid rgba(81, 87, 103, .3)
}

.ui-btn.attention.cancel[data-v-e1243e7c]:hover {
  background-color: var(--juejin-gray-3)
}

.ui-btn.large[data-v-e1243e7c] {
  padding: 7px 20px
}

.ui-btn.medium[data-v-e1243e7c] {
  padding: 5px 16px
}

.ui-btn.small[data-v-e1243e7c] {
  padding: 3px 16px
}

.ui-btn.mini[data-v-e1243e7c] {
  font-size: 12px;
  line-height: 20px;
  padding: 2px 12px
}

.ui-btn .loading[data-v-e1243e7c] {
  animation: rotate-data-v-e1243e7c 1s linear infinite
}

@keyframes rotate-data-v-e1243e7c {
  0% {
    transform: rotate(0)
  }

  to {
    transform: rotate(1turn)
  }
}

@keyframes skeleton-keyframes-data-v-4d33cb53 {
  0% {
    background-position: 0 0
  }

  to {
    background-position: 480px 0
  }
}

.emoji.old[data-v-4d33cb53] {
  transform: scale(.9)
}

@media (max-width:600px) {
  .web-only[data-v-4d33cb53] {
    display: none
  }
}

.avatar[data-v-4d33cb53] .avatar-img {
  border-radius: .333rem
}

.info-row[data-v-4d33cb53] {
  display: flex
}

.info-row .avatar[data-v-4d33cb53] {
  margin-right: 1rem;
  width: 5.5rem;
  height: 5.5rem;
  border-radius: 50%
}

.info-row .user-info[data-v-4d33cb53] {
  line-height: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis
}

.info-row .user-info .username[data-v-4d33cb53] {
  display: flex;
  align-items: center;
  font-size: 1.33rem;
  line-height: 2rem;
  font-weight: 500;
  color: var(--juejin-font-1)
}

.info-row .user-info .position[data-v-4d33cb53] {
  margin: .333rem 0 0;
  font-size: 1rem;
  line-height: 1.67rem;
  max-width: 250px;
  color: var(--juejin-font-2);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis
}

.info-row .user-info .developer[data-v-4d33cb53] {
  color: var(--juejin-font-1);
  margin: .333rem 0 0;
  font-size: 1rem
}

.info-row .user-info .developer-user[data-v-4d33cb53] {
  color: var(--juejin-font-brand1-normal)
}

.info-row .robot_info_tips[data-v-4d33cb53] {
  position: absolute;
  top: 75px;
  left: 48px;
  z-index: 1000;
  padding: 2px 4px;
  font-size: 12px;
  line-height: 22px;
  background-color: var(--juejin-popover);
  color: var(--juejin-gray-0)
}

.info-row .robot_info_tips .triangle-top[data-v-4d33cb53] {
  position: absolute;
  top: -14px;
  left: 50%;
  margin-left: -5px
}

.info-row .robot_info_tips .triangle-top[data-v-4d33cb53] .triangle {
  background-color: var(--juejin-popover);
  border-right: 1px solid var(--juejin-popover);
  border-bottom: 1px solid var(--juejin-popover)
}

.operate-btn[data-v-4d33cb53] {
  display: flex;
  position: relative;
  align-items: center;
  justify-content: space-around;
  margin-top: 16px
}

.operate-btn .btn[data-v-4d33cb53] {
  width: 122px;
  border-radius: 4px;
  margin-top: 1.334rem
}

.operate-btn .create-btn[data-v-4d33cb53] {
  font-size: 14px;
  margin-left: 16px;
  display: flex;
  height: 36px;
  background: var(--juejin-brand-fill1-normal);
  border: 1px solid var(--juejin-brand-stroke1-normal);
  color: var(--juejin-font-brand1-normal);
  justify-content: center;
  align-items: center
}

.operate-btn .create-btn[data-v-4d33cb53]:hover {
  border: 1px solid var(--juejin-brand-stroke2-hover);
  background: var(--juejin-brand-fill2-hover)
}

.operate-btn p.tip[data-v-4d33cb53] {
  position: absolute;
  top: -28px;
  left: 2px;
  z-index: 1000;
  padding: 2px 4px;
  font-size: 12px;
  line-height: 22px;
  height: 22px;
  background-color: var(--juejin-popover);
  color: var(--juejin-gray-0)
}

.operate-btn p.tip .triangle-bottom[data-v-4d33cb53] {
  position: absolute;
  bottom: 0;
  left: 50%;
  margin-left: -5px
}

.operate-btn p.tip .triangle-bottom[data-v-4d33cb53] .triangle {
  background-color: var(--juejin-popover);
  border-right: 1px solid var(--juejin-popover);
  border-bottom: 1px solid var(--juejin-popover)
}

@keyframes skeleton-keyframes-data-v-78a63d78 {
  0% {
    background-position: 0 0
  }

  to {
    background-position: 480px 0
  }
}

.emoji.old[data-v-78a63d78] {
  transform: scale(.9)
}

@media (max-width:600px) {
  .web-only[data-v-78a63d78] {
    display: none
  }
}

.popover-box[data-v-78a63d78] .popover-content {
  padding: 1.667rem;
  box-shadow: 0 8px 24px rgba(81, 87, 103, .16);
  border-radius: 4px;
  border: none
}

.user-popover[data-v-78a63d78] .popover-content {
  width: 300px
}

@keyframes skeleton-keyframes-data-v-403a3f54 {
  0% {
    background-position: 0 0
  }

  to {
    background-position: 480px 0
  }
}

.emoji.old[data-v-403a3f54] {
  transform: scale(.9)
}

@media (max-width:600px) {
  .web-only[data-v-403a3f54] {
    display: none
  }
}

.im-button[data-v-403a3f54] {
  font-size: 14px;
  box-sizing: border-box;
  display: flex;
  width: 122px;
  height: 36px;
  background: var(--juejin-brand-fill1-normal);
  border: 1px solid var(--juejin-brand-stroke1-normal);
  border-radius: 4px;
  color: var(--juejin-font-brand1-normal);
  justify-content: center;
  align-items: center
}

.im-button[data-v-403a3f54]:hover {
  border: 1px solid var(--juejin-brand-stroke2-hover);
  background: var(--juejin-brand-fill2-hover)
}

.im-button.has-icon[data-v-403a3f54] {
  width: 96px;
  height: 34px;
  line-height: 34px
}

.im-button.has-icon .im-icon[data-v-403a3f54] {
  margin-right: 6px;
  width: 14px;
  height: 14px
}

.user-popover[data-v-889b6f90] .popover-content {
  width: 300px
}

.user-popover .meta-row .meta-list[data-v-889b6f90] {
  position: relative
}

.user-popover .meta-row .meta-list .divider[data-v-889b6f90] {
  width: 260px;
  height: 1px;
  top: -9px;
  position: absolute
}

.operate-btn[data-v-889b6f90] {
  display: flex;
  align-items: center;
  margin-top: 16px
}

.operate-btn .im-btn[data-v-889b6f90] {
  margin-left: 16px
}

.operate-btn .follow-btn[data-v-889b6f90] {
  margin: 0 !important;
  width: 122px
}

@keyframes skeleton-keyframes-data-v-889b6f90 {
  0% {
    background-position: 0 0
  }

  to {
    background-position: 480px 0
  }
}

.emoji.old[data-v-889b6f90] {
  transform: scale(.9)
}

@media (max-width:600px) {
  .web-only[data-v-889b6f90] {
    display: none
  }
}

.popover-box[data-v-889b6f90] .popover-content {
  padding: 1.667rem;
  box-shadow: 0 8px 24px rgba(81, 87, 103, .16);
  border-radius: 4px;
  border: none
}

.info-row[data-v-889b6f90] {
  display: flex
}

.info-row .avatar[data-v-889b6f90] {
  margin-right: 1rem;
  width: 4rem;
  height: 4rem;
  border-radius: 50%
}

.info-row .user-info[data-v-889b6f90] {
  line-height: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis
}

.info-row .user-info .username[data-v-889b6f90] {
  display: flex;
  align-items: center;
  font-size: 1.33rem;
  line-height: 2rem;
  font-weight: 500;
  color: var(--juejin-font-1)
}

.info-row .user-info .position[data-v-889b6f90] {
  margin: .333rem 0 0;
  font-size: 1rem;
  line-height: 1.67rem;
  max-width: 165px;
  color: var(--juejin-font-2);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis
}

.follow-btn[data-v-889b6f90] {
  border-radius: 4px;
  margin-top: 1.334rem;
  width: 100%;
  justify-content: center
}

.meta-row[data-v-889b6f90] {
  display: flex;
  align-items: center;
  margin-top: 2rem
}

.meta-row .meta-list[data-v-889b6f90] {
  flex: 1 1 auto;
  display: flex;
  margin: 0;
  padding: 0;
  list-style: none;
  align-items: center
}

.meta-row .meta-list .item[data-v-889b6f90] {
  flex: 1 1 auto;
  cursor: pointer;
  display: flex;
  align-items: center;
  flex-direction: column
}

.meta-row .meta-list .item .count[data-v-889b6f90] {
  font-size: 1.333rem;
  font-weight: 500;
  color: var(--juejin-font-1);
  line-height: 2.333rem
}

.meta-row .meta-list .item .title[data-v-889b6f90] {
  font-size: 1.167rem;
  line-height: 2rem;
  color: var(--juejin-font-3)
}

.meta-row .meta-list .divider[data-v-889b6f90] {
  width: 1px;
  height: 32px;
  background-color: var(--juejin-gray-1-1)
}

span.triangle-bottom[data-v-889b6f90] {
  position: absolute;
  bottom: -15px;
  left: 50%;
  margin-left: -5px
}

span.triangle-bottom.container[data-v-889b6f90] {
  transform: rotate(0deg)
}

span.triangle-bottom.isTop[data-v-889b6f90] {
  bottom: 158px
}

span.triangle-bottom.isTop.container[data-v-889b6f90] {
  transform: rotate(180deg)
}

.fade-enter-active[data-v-889b6f90],
.fade-leave-active[data-v-889b6f90] {
  transition: opacity .2s
}

.fade-enter[data-v-889b6f90],
.fade-leave-to[data-v-889b6f90] {
  opacity: 0
}

.carousel-loading[data-v-5212cd74] {
  width: 80px;
  height: 76px;
  overflow: hidden
}

.carousel-loading .content[data-v-5212cd74] {
  position: relative;
  transform: scale(1.8)
}

.carousel-loading .section[data-v-5212cd74] {
  margin-left: 22px;
  position: absolute;
  animation: fade-data-v-5212cd74 1.2s infinite
}

.carousel-loading .section.a[data-v-5212cd74] {
  top: 0;
  left: 14px
}

.carousel-loading .section.b[data-v-5212cd74] {
  top: 12px;
  left: 7px;
  animation-delay: .2s
}

.carousel-loading .section.c[data-v-5212cd74] {
  top: 20px;
  left: 0;
  animation-delay: .4s
}

@keyframes fade-data-v-5212cd74 {
  0% {
    opacity: 0
  }

  35% {
    opacity: 1
  }

  60% {
    opacity: 0
  }

  to {
    opacity: 0
  }
}

.gallery-wrap[data-v-e5611d14] {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  z-index: 1301
}

.gallery-overlay[data-v-e5611d14] {
  position: absolute;
  top: 0;
  width: 100%;
  height: 600px;
  background-color: #000
}

.gallery-inner[data-v-e5611d14] {
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none
}

.gallery-inner .control[data-v-e5611d14],
.gallery-inner .counter-bar-wrapper[data-v-e5611d14] {
  position: absolute;
  cursor: pointer;
  z-index: 1003
}

.gallery-inner .control.next[data-v-e5611d14],
.gallery-inner .control.prev[data-v-e5611d14],
.gallery-inner .counter-bar-wrapper.next[data-v-e5611d14],
.gallery-inner .counter-bar-wrapper.prev[data-v-e5611d14] {
  width: 30vw;
  height: 100vh
}

.gallery-inner .control.prev[data-v-e5611d14],
.gallery-inner .counter-bar-wrapper.prev[data-v-e5611d14] {
  left: 0;
  cursor: url(data:;base64,AAABAAEAHDIAAAEAIADQFgAAFgAAACgAAAAcAAAAZAAAAAEAIAAAAAAA4BUAABILAAASCwAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAEAAAAEAAAACQAAAAwAAAAKAAAABQAAAAIAAAABAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAEAAAAEAAAACwAAABQAAAAYAAAAFQAAAAwAAAAFAAAAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAEAAAAEAAAACwAAABUAAAAeAAAAIgAAAB8AAAAWAAAADAAAAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAEAAAAEAAAACwAAABUAAAAew8PDhOTk5P/l5eX7dnZ2NAAAABQAAAAIAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAEAAAAEAAAACwAAABUAAAAewcHBg+bm5vb8/Pz/8vLy++Hh4eh9fX0rAAAACgAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAEAAAAEAAAACwAAABQAAAAewMDAgeXl5ff8/Pz////////////z8/P65OTk47OzsxsAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAEAAAAEAAAACgAAABQAAAAev7+/gObm5vb8/Pz//////////////////v7+/+rq6uvj4+OmAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAEAAAAEAAAACgAAABQAAAAewMDAfuXl5ff8/Pz//////////////////f39/+jo6PTl5eWIAAAAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAEAAAAEAAAACgAAABQAAAAewMDAfeXl5ff8/Pz//////////////////f39/+jo6PTl5eWJAAAAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAEAAAAEAAAACgAAABQAAAAev7+/fOTk5Pf8/Pz//////////////////v7+/+jo6PTj4+OLAAAAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAEAAAAEAAAACgAAABQAAAAev7+/e+Xl5fb8/Pz//////////////////v7+/+jo6PTk5OSNAAAAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAEAAAAEAAAACgAAABQAAAAevLy8eeTk5Pf8/Pz//////////////////v7+/+jo6PTk5OSPAAAAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAEAAAAEAAAACgAAABQAAAAeu7u7eOTk5Pf8/Pz//////////////////v7+/+jo6PTk5OSQAAAAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAEAAAAEAAAACgAAABQAAAAeurq6duXl5ff8/Pz//////////////////v7+/+np6fTl5eWSAAAAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAEAAAAEAAAACgAAABQAAAAeurq6duTk5Pf8/Pz//////////////////v7+/+np6fTl5eWTAAAAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAEAAAAEAAAACgAAABQAAAAeu7u7dOXl5ff7+/v//////////////////v7+/+np6fTk5OSVAAAAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAEAAAAEAAAACgAAABQAAAAdurq6c+Tk5Pf7+/v//////////////////v7+/+np6fTm5uaWAAAAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAEAAAAEAAAACgAAABQAAAAdubm5ceXl5ff7+/v//////////////////v7+/+np6fTk5OSYAAAAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAEAAAAEAAAACgAAABQAAAAdt7e3ceXl5ff7+/v//////////////////v7+/+np6fTl5eWaAAAAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAEAAAAEAAAACgAAABQAAAAdtra2cOXl5ff7+/v//////////////////v7+/+np6fTm5uabAAAAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAEAAAAEAAAACgAAABQAAAAdtbW1buTk5Pf7+/v//////////////////v7+/+np6fTl5eWdAAAAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAEAAAACgAAABQAAAAdsrKybeXl5ff7+/v//////////////////v7+/+rq6vTl5eWe////AQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACQAAABMAAAAdtbW1a+Xl5ff7+/v//////////////////v7+/+rq6vTl5eWf////AQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA4AAAAatLS0auXl5ff7+/v//////////////////v7+/+rq6vTk5OSh////AQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAANwcHBYuXl5ff7+/v//////////////////v7+/+np6fXf39+mQEBABAAAAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA29vbYubm5vD7+/v//////////////////f39/+np6fTX19elAAAAFAAAAAoAAAAEAAAAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAODg4DHl5eXz9/f3///////////////////////s7Oz329vbyC0tLSIAAAATAAAACgAAAAMAAAABAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAB3d3dNeXl5fT4+Pj//////////////////////+rq6vfc3NzDJycnIQAAABMAAAAKAAAAAwAAAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAHg4OA55eXl9Pj4+P//////////////////////6+vr9tra2r8gICAgAAAAEwAAAAkAAAADAAAAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAd3d3Tzm5ub1+fn5///////////////////////p6en22dnZuxkZGR8AAAATAAAACQAAAAMAAAABAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAB39/fQObm5vX5+fn//////////////////////+np6fbW1ta2ERERHgAAABMAAAAJAAAAAwAAAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAHh4eFE5ubm9fn5+f//////////////////////6Ojo9tfX17IJCQkcAAAAEgAAAAkAAAADAAAAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAd/f30jl5eX2+vr6//////////////////7+/v/o6Oj21NTUrQkJCRwAAAASAAAACQAAAAMAAAABAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAB4eHhTebm5vb6+vr//////////////////v7+/+jo6PXU1NSnAAAAHAAAABIAAAAIAAAAAwAAAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAHg4OBR5ubm9vv7+//////////////////+/v7/5+fn9tHR0aIAAAAcAAAAEgAAAAgAAAADAAAAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAeHh4VXm5ub2+/v7//////////////////7+/v/o6Oj10NDQnQAAABwAAAARAAAACAAAAAMAAAABAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAB4ODgW+bm5vb7+/v//////////////////v7+/+bm5vbOzs6XAAAAGwAAABEAAAAIAAAAAwAAAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAHi4uJh5ubm9fz8/P/////////////////9/f3/5ubm9szMzJIAAAAbAAAAEQAAAAgAAAADAAAAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAeHh4WXl5eX2/Pz8//////////////////39/f/n5+f2ysrKjAAAABsAAAARAAAACAAAAAMAAAABAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAB4uLia+fn5/X8/Pz//////////////////f39/+Xl5fbFxcWIAAAAGwAAABAAAAAIAAAAAgAAAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAHi4uJy5+fn9f39/f/////////////////9/f3/5ubm9sTExIIAAAAbAAAAEAAAAAcAAAACAAAAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAeHh4Xfm5ub1/f39//////////////////z8/P/m5ub2wsLCfQAAABoAAAAQAAAABwAAAAIAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAEAAAAB4uLifejo6PX9/f3//////////////////Pz8/+Xl5fa9vb14AAAAGgAAAA8AAAAGAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAQAAAAHi4uKF5+fn9f39/f/////////////////8/Pz/5OTk98DAwHEAAAAUAAAACAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABAAAAAeLi4ozp6en0/v7+//////////////////v7+//l5eX3zMzMZAAAAAcAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAEAAAAB4+Pjk+np6fT+/v7//////////////////Pz8/+fn5+vg4OBJAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAQAAAALj4+OZ6enp9P7+/v///////////+3t7fbl5eXH////CQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABAAAAAuTk5J/q6ur0/v7+/+7u7vbk5OTJ////CQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAH///8B5eXlpOTk5P/l5eXR5ubmCgAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAEAAAABAAAAAQAAAAAAAAAAAAAAAP//8AD//+AA///AAP//gAD//wAA//4AAP/8AAD/+AAA//AAEP/gADD/wABw/4AA8P8AAfD+AAPw/AAH8PgAD/DwAB/w4AA/8MAAf/CAAP/wAAH/8AAD//AAB//wAA//8AAP//AAB//wAAP/8AAB//CAAP/wwAB/8OAAP/DwAB/w+AAP8PwAB/D+AAPw/wAB8P+AAPD/wABw/+AAMP/wABD/+AAA//wAAP/8AAD//gAA//8AAP//gAD//8AA///gEP//8DD///xw), auto
}

.gallery-inner .control.next[data-v-e5611d14],
.gallery-inner .counter-bar-wrapper.next[data-v-e5611d14] {
  right: 0;
  cursor: url(data:;base64,AAABAAEAHDIAAAEAIADQFgAAFgAAACgAAAAcAAAAZAAAAAEAIAAAAAAA4BUAABILAAASCwAAAAAAAAAAAAAAAAABAAAAAgAAAAUAAAAKAAAADAAAAAkAAAAEAAAAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAQAAAAUAAAAMAAAAFQAAABgAAAAUAAAACwAAAAQAAAABAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAQAAAAMAAAAFgAAAB8AAAAiAAAAHgAAABUAAAALAAAABAAAAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAIAAAAFHZ2djTl5eX75OTk/8PDw4QAAAAeAAAAFQAAAAsAAAAEAAAAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACn19fSvh4eHo8vLy+/z8/P/m5ub2wcHBgwAAAB4AAAAVAAAACwAAAAQAAAABAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAALOzsxvk5OTj8/Pz+v///////////Pz8/+bm5vbAwMCCAAAAHgAAABQAAAALAAAABAAAAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAADj4+Oa8fHx1P7+/v/////////////////8/Pz/5ubm9r+/v4AAAAAeAAAAFAAAAAoAAAAEAAAAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAeXl5Yrn5+f0/f39//////////////////z8/P/m5ub2v7+/fwAAAB4AAAAUAAAACgAAAAQAAAABAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAB4+Pji+jo6PT9/f3//////////////////Pz8/+Tk5PfAwMB9AAAAHgAAABQAAAAKAAAABAAAAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAHk5OSN6Ojo9P7+/v/////////////////8/Pz/5ubm9sDAwH0AAAAeAAAAFAAAAAoAAAAEAAAAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAeTk5I/p6en0/v7+//////////////////z8/P/l5eX2v7+/ewAAAB4AAAAUAAAACgAAAAQAAAABAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAB5OTkkOnp6fT+/v7//////////////////Pz8/+Xl5fa8vLx6AAAAHgAAABQAAAAKAAAABAAAAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAHl5eWS6enp9P7+/v/////////////////8/Pz/5eXl97u7u3gAAAAeAAAAFAAAAAoAAAAEAAAAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAeXl5ZTp6en0/v7+//////////////////z8/P/l5eX3urq6dwAAAB4AAAAUAAAACgAAAAQAAAABAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAB5OTklejo6PT+/v7//////////////////Pz8/+Tk5Pe6urp2AAAAHgAAABQAAAAKAAAABAAAAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAHk5OSW6enp9P7+/v/////////////////8/Pz/5eXl97u7u3UAAAAeAAAAFAAAAAoAAAAEAAAAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAeTk5Jjo6Oj0/v7+//////////////////v7+//l5eX2u7u7dAAAAB0AAAAUAAAACgAAAAQAAAABAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAB5OTkmenp6fT+/v7/////////////////+/v7/+Xl5fe6urpyAAAAHQAAABQAAAAKAAAABAAAAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAHm5uab6Ojo9P7+/v/////////////////7+/v/5eXl97m5uXEAAAAdAAAAFAAAAAoAAAAEAAAAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAebm5pzp6en0/v7+//////////////////v7+//k5OT3t7e3cQAAAB0AAAAUAAAACgAAAAQAAAABAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAB5eXln+np6fT+/v7/////////////////+/v7/+Tk5Pe1tbVvAAAAHQAAABQAAAAKAAAABAAAAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAHk5OSg6urq9P7+/v/////////////////7+/v/5OTk97W1tW4AAAAdAAAAFAAAAAoAAAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA////AeTk5KHp6en0/v7+//////////////////v7+//l5eX3s7OzbAAAAB0AAAATAAAACQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAD///8B5OTkourq6vT+/v7/////////////////+/v7/+Xl5fe1tbVrAAAAGgAAAA4AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAUBAQATf39+n6enp9f7+/v/////////////////7+/v/5eXl98HBwWMAAAANAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAQAAAAQAAAAKAAAAFNfX16Xp6en1/v7+//////////////////v7+//n5+fw29vbYwAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAQAAAAMAAAAKAAAAEy0tLSLd3d3J7Ozs9v/////////////////////39/f/5eXl8+Dg4DEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAQAAAAMAAAAKAAAAEycnJyHc3NzF6+vr9v/////////////////////4+Pj/5eXl9N3d3TUAAAABAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAQAAAAMAAAAJAAAAEyAgICDa2trB6+vr9v/////////////////////4+Pj/5ubm9ODg4DkAAAABAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAQAAAAMAAAAJAAAAExkZGR/a2tq86enp9v/////////////////////5+fn/5ubm9N7e3j0AAAABAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAQAAAAMAAAAJAAAAExERER7Y2Ni36urq9f/////////////////////5+fn/5ubm9d/f30AAAAABAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAQAAAAMAAAAJAAAAEgkJCRzZ2dmz6enp9f/////////////////////6+vr/5ubm9uHh4UQAAAABAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAQAAAAMAAAAJAAAAEgAAABzV1dWv6enp9f7+/v/////////////////6+vr/5eXl9uDg4EkAAAABAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAQAAAAMAAAAIAAAAEgAAABzV1dWp6enp9f7+/v/////////////////6+vr/5ubm9uHh4U0AAAABAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAQAAAAMAAAAIAAAAEgAAABzS0tKj6Ojo9f7+/v/////////////////7+/v/5ubm9uDg4FEAAAABAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAQAAAAMAAAAIAAAAEQAAABzPz8+f6Ojo9f7+/v/////////////////7+/v/5ubm9uHh4VYAAAABAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAQAAAAMAAAAIAAAAEQAAABvOzs6X5ubm9v7+/v/////////////////7+/v/5ubm9uHh4VwAAAABAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAQAAAAMAAAAIAAAAEQAAABvMzMyQ5+fn9v39/f/////////////////8/Pz/5eXl9uLi4mEAAAABAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAQAAAAMAAAAIAAAAEQAAABvKysqL5+fn9v39/f/////////////////8/Pz/5eXl9uHh4WYAAAABAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAQAAAAIAAAAIAAAAEAAAABvGxsaH5ubm9v39/f/////////////////8/Pz/5+fn9eDg4GwAAAABAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAQAAAAIAAAAHAAAAEAAAABvExMSB5ubm9v39/f/////////////////9/f3/5+fn9eLi4nMAAAABAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAIAAAAHAAAAEAAAABrBwcF75eXl9/z8/P/////////////////9/f3/5ubm9eHh4XgAAAABAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAGAAAADwAAABq9vb135eXl9vz8/P/////////////////9/f3/5+fn9ePj434AAAABAAAAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACAAAABS/v79w5eXl9/z8/P/////////////////9/f3/6Ojo9OLi4oYAAAABAAAAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAfLy8tj5eXl9/v7+//////////////////+/v7/6Ojo9OPj44sAAAABAAAAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAADj4+Nu6Ojo3vz8/P/////////////////+/v7/6enp9OPj45IAAAABAAAAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA////CeTk5Mru7u72///////////+/v7/6enp9OTk5JcAAAACAAAAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAD///8J5eXly+7u7vb+/v7/6urq9OTk5J4AAAACAAAAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAObm5grm5ubS5OTk/+Tk5KP///8BAAAAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAQAAAAEAAAABAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAD///AAf//wAD//8AAf//AAD//wAAf/8AAD//AAAf/wgAD/8MAAf/DgAD/w8AAf8PgAD/D8AAfw/gAD8P8AAfD/gADw/8AAcP/gADD/8AAQ//gAAP/8AAD//gAA//8AAP//AAD//gAA//wAAP/4AAD/8AAQ/+AAMP/AAHD/gADw/wAB8P4AA/D8AAfw+AAP8PAAH/DgAD/wwAB/8IAA//AAAf/wAAP/8AAD//AAB//wAA//8AAf//AAP//wgH//8MD///Dj///w), auto
}

.gallery-inner .control.close[data-v-e5611d14],
.gallery-inner .counter-bar-wrapper.close[data-v-e5611d14] {
  top: 20px;
  right: 20px;
  width: 60px;
  height: 60px;
  border-radius: 50%;
  background-color: hsla(0, 0%, 41.2%, .2);
  transition: .2s
}

.gallery-inner .control.close[data-v-e5611d14]:hover,
.gallery-inner .counter-bar-wrapper.close[data-v-e5611d14]:hover {
  transform: rotate(-90deg);
  background-color: hsla(0, 0%, 58.8%, .5)
}

.gallery-inner .control.close .close-icon[data-v-e5611d14],
.gallery-inner .counter-bar-wrapper.close .close-icon[data-v-e5611d14] {
  position: absolute;
  top: 35%;
  left: 35%;
  width: 30%;
  height: 30%
}

.gallery-inner .control.close .close-icon .close-path[data-v-e5611d14],
.gallery-inner .counter-bar-wrapper.close .close-icon .close-path[data-v-e5611d14] {
  fill: #fff
}

.gallery-inner.control-hidden .control[data-v-e5611d14] {
  display: none
}

.gallery-inner .counter-bar-wrapper[data-v-e5611d14] {
  bottom: 0;
  width: 100%;
  height: 66px;
  line-height: 66px;
  text-align: center;
  cursor: default
}

.gallery-inner .counter-bar-wrapper:hover .counter-bar[data-v-e5611d14] {
  transform: translateY(0)
}

.gallery-inner .counter-bar-wrapper .counter-bar[data-v-e5611d14] {
  background-color: rgba(0, 0, 0, .6);
  transition: .3s
}

.gallery-inner .counter-bar-wrapper .counter-hinter[data-v-e5611d14] {
  font-size: 24px;
  font-weight: 600;
  color: hsla(0, 0%, 100%, .6)
}

.gallery-inner .counter-bar-wrapper .counter-hinter .current-index[data-v-e5611d14] {
  margin-right: 8px;
  font-size: 36px;
  color: #fff
}

.gallery-contents[data-v-e5611d14] {
  position: absolute;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: #222
}

.gallery-contents .slide[data-v-e5611d14] {
  position: absolute;
  top: 0;
  width: 100vw;
  height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center
}

.gallery-contents .slide.zoomable[data-v-e5611d14] {
  cursor: zoom-in
}

.gallery-contents .slide.zoomed[data-v-e5611d14] {
  align-items: baseline;
  cursor: zoom-out;
  overflow: auto
}

.gallery-contents .slide.zoomed .slide-img[data-v-e5611d14] {
  max-width: 100%;
  max-height: inherit
}

.gallery-contents .slide .slide-img[data-v-e5611d14] {
  position: relative;
  max-width: 100vw;
  max-height: 100vh;
  z-index: 1000
}

.gallery-contents .slide .loading[data-v-e5611d14] {
  position: absolute;
  top: calc(50% - 38px);
  z-index: 999
}

.fade-enter-active[data-v-e5611d14],
.fade-leave-active[data-v-e5611d14] {
  transition: opacity .3s
}

.fade-enter[data-v-e5611d14],
.fade-leave-to[data-v-e5611d14] {
  opacity: 0
}

.mobile-gallery[data-v-1775a238] {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  color: #fff;
  background-color: #000;
  z-index: 10000
}

.mobile-gallery-close[data-v-1775a238],
.mobile-gallery-counter[data-v-1775a238] {
  position: fixed;
  z-index: 10001
}

.mobile-gallery-counter[data-v-1775a238] {
  top: 24px;
  width: 100%;
  font-size: 16px;
  letter-spacing: 2px;
  text-shadow: 0 0 3px #333;
  text-align: center
}

.mobile-gallery-close[data-v-1775a238] {
  top: 20px;
  right: 20px;
  padding: 4px 16px;
  font-size: 14px;
  border-radius: 3px;
  background-color: rgba(0, 0, 0, .3);
  border: 1px solid hsla(0, 0%, 100%, .3)
}

.mobile-gallery-loading[data-v-1775a238] {
  position: absolute;
  top: 50%;
  left: 50%;
  margin: -20px 0 0 -20px;
  z-index: 10001
}

.mobile-gallery-group[data-v-1775a238],
.mobile-gallery-img[data-v-1775a238] {
  height: 100%;
  overflow-y: scroll
}

.mobile-gallery-group[data-v-1775a238] {
  font-size: 0
}

.mobile-gallery-img[data-v-1775a238] {
  float: left
}

.mobile-gallery-img img[data-v-1775a238] {
  position: relative;
  display: block;
  width: 100%
}

@keyframes skeleton-keyframes-data-v-6c6510ce {
  0% {
    background-position: 0 0
  }

  to {
    background-position: 480px 0
  }
}

.content[data-v-6c6510ce] {
  display: flex !important;
  justify-content: center;
  align-items: center
}

.content .icon-svg[data-v-6c6510ce],
.content[data-v-6c6510ce] {
  width: 100%;
  height: 100%
}

.content .icon-svg path[data-v-6c6510ce] {
  fill: var(--juejin-brand-1-normal)
}

.content .icon-count[data-v-6c6510ce] {
  position: absolute;
  display: flex;
  height: 100%;
  left: 3px;
  top: 1.2px;
  align-items: center;
  color: var(--juejin-gray-0)
}

.content .icon-count .plus[data-v-6c6510ce] {
  margin-bottom: 1.2px
}

@keyframes skeleton-keyframes-data-v-204d24f0 {
  0% {
    background-position: 0 0
  }

  to {
    background-position: 480px 0
  }
}

.comment-img[data-v-204d24f0] {
  position: relative;
  border-radius: 4px;
  display: inline-block;
  width: 120px;
  height: 120px;
  margin-right: 12px;
  border: 1px solid var(--juejin-gray-1-2);
  overflow: hidden;
  cursor: zoom-in
}

.comment-img .img-more-icon[data-v-204d24f0] {
  position: absolute;
  right: 4px;
  bottom: 4px;
  width: 24px;
  height: 24px
}

.comment-img img[data-v-204d24f0] {
  -o-object-fit: cover;
  object-fit: cover;
  width: 100%;
  height: 100%
}

@keyframes skeleton-keyframes-data-v-60ec746e {
  0% {
    background-position: 0 0
  }

  to {
    background-position: 480px 0
  }
}

.reply-card[data-v-60ec746e] {
  display: flex;
  min-width: 0;
  box-sizing: border-box;
  font-style: normal;
  position: relative
}

.reply-card[data-v-60ec746e]:before {
  content: " ";
  position: absolute;
  pointer-events: none;
  background: transparent;
  top: -4px;
  left: -4px;
  right: -4px;
  bottom: -4px;
  transition: all .3s
}

.reply-card[data-v-60ec746e] * {
  box-sizing: border-box
}

.reply-card .reply-avatar[data-v-60ec746e] {
  position: relative;
  width: 28px;
  flex-shrink: 0;
  flex-grow: 0;
  margin-right: 12px
}

.reply-card .reply-avatar .avatar[data-v-60ec746e] {
  width: 28px;
  height: 28px
}

.reply-card .reply-avatar .avatar .avatar-tag[data-v-60ec746e] {
  position: absolute;
  right: -3px;
  bottom: -4px;
  margin-left: 0 !important;
  width: 17px;
  height: 17px
}

.reply-card .reply-avatar .avatar .avatar-tag[data-v-60ec746e] img {
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
  object-fit: contain
}

.reply-card .reply-wrapper[data-v-60ec746e] {
  position: relative;
  flex: 1;
  min-width: 0
}

.reply-card .reply-wrapper .reply-content .content[data-v-60ec746e] {
  color: var(--juejin-font-1);
  font-size: 16px;
  font-weight: 400;
  line-height: 28px;
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 6
}

.reply-card .reply-wrapper .reply-content .content[data-v-60ec746e] .emoji {
  vertical-align: sub;
  width: auto;
  position: relative;
  top: 1px;
  height: 20px;
  margin: 0 2px
}

.reply-card .reply-wrapper .reply-content .content .user-info[data-v-60ec746e] {
  display: inline;
  color: var(--juejin-font-1);
  font-size: 16px;
  font-weight: 400;
  line-height: 28px
}

.reply-card .reply-wrapper .reply-content .content .user-info[data-v-60ec746e] .popover-box {
  display: inline-flex
}

.reply-card .reply-wrapper .reply-content .content .user-info .username[data-v-60ec746e] {
  color: var(--juejin-font-2);
  font-size: 16px;
  font-weight: 400;
  line-height: 28px
}

.reply-card .reply-wrapper .reply-content .content .user-info .author-tag[data-v-60ec746e] {
  color: var(--juejin-font-brand1-normal);
  font-size: 12px;
  font-weight: 400;
  line-height: 14px;
  border-radius: 2px;
  background: var(--juejin-brand-5-light);
  height: 18px;
  width: 30px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-left: 4px;
  flex-shrink: 0;
  position: relative;
  top: -2px
}

.reply-card .reply-wrapper .reply-content .content.expand[data-v-60ec746e] {
  -webkit-line-clamp: initial
}

.reply-card .reply-wrapper .reply-content .expand-action-wrap[data-v-60ec746e] {
  margin-top: 8px
}

.reply-card .reply-wrapper .reply-content .expand-action-wrap .expand-action[data-v-60ec746e] {
  display: inline-block;
  font-size: 14px;
  line-height: 22px;
  color: var(--juejin-brand-1-normal);
  cursor: pointer
}

.reply-card .reply-wrapper .reply-content .reply-img-box[data-v-60ec746e] {
  margin-top: 8px
}

.reply-card .reply-wrapper .reply-content .reply-img-box .reply-img[data-v-60ec746e] {
  border-radius: 4px;
  display: inline-block;
  width: 120px;
  height: 120px;
  margin-right: 12px;
  border: 1px solid var(--juejin-gray-1-2);
  overflow: hidden;
  cursor: zoom-in
}

.reply-card .reply-wrapper .reply-content .reply-img-box .reply-img img[data-v-60ec746e] {
  -o-object-fit: cover;
  object-fit: cover;
  width: 100%;
  height: 100%
}

.reply-card .reply-wrapper .reply-action[data-v-60ec746e] {
  margin-top: 8px;
  display: flex;
  align-items: center;
  color: var(--juejin-font-3);
  font-size: 14px;
  font-weight: 400;
  line-height: 22px
}

.reply-card .reply-wrapper .reply-action .action-time[data-v-60ec746e] {
  margin-right: 10px;
  display: flex;
  align-items: center
}

.reply-card .reply-wrapper .reply-action .action-digg[data-v-60ec746e],
.reply-card .reply-wrapper .reply-action .action-reply[data-v-60ec746e] {
  cursor: pointer;
  display: flex;
  align-items: center;
  transition: all .2s;
  padding: 0 10px
}

.reply-card .reply-wrapper .reply-action .action-digg .icon[data-v-60ec746e],
.reply-card .reply-wrapper .reply-action .action-reply .icon[data-v-60ec746e] {
  margin-right: 4px
}

.reply-card .reply-wrapper .reply-action .action-digg svg path[data-v-60ec746e],
.reply-card .reply-wrapper .reply-action .action-reply svg path[data-v-60ec746e] {
  transition: all .2s;
  fill: currentColor
}

.reply-card .reply-wrapper .reply-action .action-digg.active[data-v-60ec746e],
.reply-card .reply-wrapper .reply-action .action-digg[data-v-60ec746e]:hover,
.reply-card .reply-wrapper .reply-action .action-reply.active[data-v-60ec746e],
.reply-card .reply-wrapper .reply-action .action-reply[data-v-60ec746e]:hover {
  color: var(--juejin-brand-1-normal)
}

.reply-card .reply-wrapper .reply-action .more-action[data-v-60ec746e] {
  cursor: pointer
}

.reply-card .reply-wrapper .reply-action .more-action .more-btn[data-v-60ec746e] {
  display: flex;
  align-items: center;
  padding: 0 6px;
  transition: all .2s;
  border-radius: 2px
}

.reply-card .reply-wrapper .reply-action .more-action .more-btn svg circle[data-v-60ec746e] {
  fill: var(--juejin-font-2)
}

.reply-card .reply-wrapper .reply-action .more-action .more-btn:hover svg circle[data-v-60ec746e] {
  fill: var(--juejin-font-brand1-normal)
}

.reply-card .reply-wrapper .reply-action .more-action .more-menu[data-v-60ec746e] {
  color: var(--juejin-font-1);
  font-size: 14px;
  font-weight: 400;
  line-height: 24px
}

.reply-card .reply-wrapper .reply-action .more-action .more-menu li[data-v-60ec746e] {
  height: 32px;
  padding: 0 16px 0 12px;
  display: flex;
  align-items: center;
  transition: all .2s;
  cursor: pointer;
  min-width: 0
}

.reply-card .reply-wrapper .reply-action .more-action .more-menu li .menu-icon[data-v-60ec746e] {
  margin-right: 8px;
  flex-shrink: 0;
  color: var(--juejin-font-2)
}

.reply-card .reply-wrapper .reply-action .more-action .more-menu li .menu-label[data-v-60ec746e] {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  word-break: break-all
}

.reply-card .reply-wrapper .reply-action .more-action .more-menu li[data-v-60ec746e]:hover {
  background: var(--juejin-gray-3)
}

.reply-card .reply-wrapper .reply-action .more-action[data-v-60ec746e] .more-popover .byte-popover {
  border-radius: 4px;
  padding: 0
}

.reply-card .reply-wrapper .reply-action .more-action[data-v-60ec746e] .more-popover .byte-popover__content {
  margin: 0
}

.reply-card .reply-wrapper .reply-action .more-action[data-v-60ec746e] .more-popover .popper__arrow {
  display: none
}

.reply-card .reply-wrapper .reply-editor[data-v-60ec746e] {
  margin-top: 8px
}

.reply-card .reply-editor[data-v-60ec746e] {
  margin-top: 12px
}

.reply-card.small .reply-avatar[data-v-60ec746e] {
  width: 28px;
  margin-right: 12px
}

.reply-card.small .reply-avatar .avatar[data-v-60ec746e] {
  width: 28px;
  height: 28px
}

.reply-card.small .reply-avatar .avatar .avatar-tag[data-v-60ec746e] {
  position: absolute;
  right: -2px;
  bottom: -3px;
  width: 16px;
  height: 16px
}

.reply-card.small .reply-wrapper[data-v-60ec746e] {
  flex: 1;
  min-width: 0
}

.reply-card.small .reply-wrapper .reply-content[data-v-60ec746e] {
  margin-top: 4px
}

.reply-card.small .reply-wrapper .reply-content .content .user-info .username[data-v-60ec746e],
.reply-card.small .reply-wrapper .reply-content .content .user-info[data-v-60ec746e],
.reply-card.small .reply-wrapper .reply-content .content[data-v-60ec746e] {
  font-size: 14px;
  line-height: 24px
}

.reply-card.small .reply-wrapper .reply-content .content .user-info .author-tag[data-v-60ec746e] {
  margin-left: 2px;
  font-size: 10px;
  line-height: 12px;
  border-radius: 1px;
  height: 16px;
  width: 30px;
  top: -1px
}

.reply-card.small .reply-wrapper .reply-content .expand-action-wrap[data-v-60ec746e] {
  margin-top: 4px
}

.reply-card.small .reply-wrapper .reply-content .expand-action-wrap .expand-action[data-v-60ec746e] {
  font-size: 12px;
  line-height: 22px
}

.reply-card.small .reply-wrapper .reply-content .reply-img-box[data-v-60ec746e] {
  margin-top: 6px
}

.reply-card.small .reply-wrapper .reply-content .reply-img-box .reply-img[data-v-60ec746e] {
  width: 100px;
  height: 100px
}

.reply-card.small .reply-wrapper .reply-action[data-v-60ec746e] {
  margin-top: 6px;
  font-size: 12px;
  line-height: 20px
}

.reply-card.small .reply-wrapper .reply-action .action-digg[data-v-60ec746e],
.reply-card.small .reply-wrapper .reply-action .action-reply[data-v-60ec746e] {
  padding: 0 8px
}

.reply-card.small .reply-wrapper .reply-action .action-digg svg[data-v-60ec746e],
.reply-card.small .reply-wrapper .reply-action .action-reply svg[data-v-60ec746e] {
  width: 14px;
  height: 14px
}

@keyframes skeleton-keyframes-data-v-48aabfe4 {
  0% {
    background-position: 0 0
  }

  to {
    background-position: 480px 0
  }
}

.top-has-more[data-v-48aabfe4] {
  margin-top: 8px;
  color: var(--juejin-font-3);
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 22px;
  cursor: pointer
}

@media (max-width:600px) {
  .top-has-more[data-v-48aabfe4] {
    font-size: 13px
  }
}

.top-has-more svg[data-v-48aabfe4] {
  fill: currentColor;
  vertical-align: middle;
  position: relative;
  top: -1px
}

.top-has-more[data-v-48aabfe4]:hover {
  color: var(--juejin-font-brand1-normal)
}

.top-has-more.small[data-v-48aabfe4] {
  font-size: 13px;
  line-height: 20px
}

.reply-list[data-v-48aabfe4] {
  margin-top: 8px;
  margin-bottom: -8px
}

.reply-list .reply-item[data-v-48aabfe4] {
  padding: 8px 0
}

.reply-list .reply-item.anchor-active[data-v-48aabfe4]:before {
  background: var(--juejin-brand-5-light);
  left: -64px;
  right: -20px
}

.reply-list .top-has-more[data-v-48aabfe4] {
  padding: 8px 0;
  margin-top: 0;
  margin-left: 40px
}

.reply-list.small[data-v-48aabfe4] {
  margin-top: 6px;
  margin-bottom: -6px
}

.reply-list.small .reply-item[data-v-48aabfe4] {
  padding: 6px 0
}

.reply-list.small .top-has-more[data-v-48aabfe4] {
  margin-left: 40px;
  line-height: 20px;
  padding: 6px 0
}

@keyframes skeleton-keyframes-data-v-2c3ce642 {
  0% {
    background-position: 0 0
  }

  to {
    background-position: 480px 0
  }
}

.comment-card[data-v-2c3ce642] {
  display: flex;
  min-width: 0;
  box-sizing: border-box;
  font-style: normal;
  position: relative
}

.comment-card[data-v-2c3ce642]:before {
  content: " ";
  position: absolute;
  pointer-events: none;
  background: transparent;
  top: 0;
  left: -10px;
  right: -10px;
  transition: all .3s
}

.comment-card[data-v-2c3ce642] * {
  box-sizing: border-box
}

.comment-card .comment-avatar[data-v-2c3ce642] {
  position: relative;
  width: 36px;
  flex-shrink: 0;
  flex-grow: 0;
  margin-right: 16px
}

.comment-card .comment-avatar .avatar[data-v-2c3ce642] {
  width: 36px;
  height: 36px
}

.comment-card .comment-avatar .avatar .avatar-tag[data-v-2c3ce642] {
  position: absolute;
  right: -3px;
  bottom: -4px;
  margin-left: 0 !important;
  width: 19px;
  height: 19px
}

.comment-card .comment-avatar .avatar .avatar-tag[data-v-2c3ce642] img {
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
  object-fit: contain
}

.comment-card .comment-wrapper[data-v-2c3ce642] {
  position: relative;
  flex: 1;
  min-width: 0
}

.comment-card .comment-wrapper .comment-header[data-v-2c3ce642] {
  display: flex;
  align-items: center;
  padding: 1px 0
}

.comment-card .comment-wrapper .comment-header .username[data-v-2c3ce642] {
  color: var(--juejin-font-2);
  font-size: 16px;
  font-weight: 400;
  line-height: 24px
}

.comment-card .comment-wrapper .comment-header .author-tag[data-v-2c3ce642] {
  vertical-align: text-top;
  color: var(--juejin-font-brand1-normal);
  font-size: 12px;
  font-weight: 400;
  line-height: 14px;
  border-radius: 2px;
  background: var(--juejin-brand-5-light);
  height: 18px;
  width: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-left: 4px;
  flex-shrink: 0
}

.comment-card .comment-wrapper .comment-header .author-intro[data-v-2c3ce642] {
  color: var(--juejin-font-3);
  font-size: 14px;
  font-weight: 400;
  line-height: 22px;
  margin-left: 12px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  word-break: break-all
}

.comment-card .comment-wrapper .comment-header .hot-icon[data-v-2c3ce642] {
  width: 43px;
  height: 20px
}

.comment-card .comment-wrapper .comment-content[data-v-2c3ce642] {
  margin-top: 4px
}

.comment-card .comment-wrapper .comment-content .content[data-v-2c3ce642] {
  color: var(--juejin-font-1);
  font-size: 16px;
  font-weight: 400;
  line-height: 28px;
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 6
}

.comment-card .comment-wrapper .comment-content .content[data-v-2c3ce642] .emoji {
  vertical-align: sub;
  width: auto;
  position: relative;
  top: 1px;
  height: 20px;
  margin: 0 2px
}

.comment-card .comment-wrapper .comment-content .content.expand[data-v-2c3ce642] {
  -webkit-line-clamp: initial
}

.comment-card .comment-wrapper .comment-content .expand-action-wrap[data-v-2c3ce642] {
  margin-top: 8px
}

.comment-card .comment-wrapper .comment-content .expand-action-wrap .expand-action[data-v-2c3ce642] {
  display: inline-block;
  font-size: 14px;
  line-height: 22px;
  color: var(--juejin-font-brand1-normal);
  cursor: pointer
}

.comment-card .comment-wrapper .comment-content .comment-img-box[data-v-2c3ce642] {
  margin-top: 8px
}

.comment-card .comment-wrapper .comment-action[data-v-2c3ce642] {
  margin-top: 8px;
  display: flex;
  align-items: center;
  color: var(--juejin-font-3);
  font-size: 14px;
  font-weight: 400;
  line-height: 22px
}

.comment-card .comment-wrapper .comment-action .action-time[data-v-2c3ce642] {
  margin-right: 10px;
  display: flex;
  align-items: center
}

.comment-card .comment-wrapper .comment-action .action-digg[data-v-2c3ce642],
.comment-card .comment-wrapper .comment-action .action-reply[data-v-2c3ce642] {
  cursor: pointer;
  display: flex;
  align-items: center;
  transition: all .2s;
  padding: 0 10px
}

.comment-card .comment-wrapper .comment-action .action-digg .icon[data-v-2c3ce642],
.comment-card .comment-wrapper .comment-action .action-reply .icon[data-v-2c3ce642] {
  margin-right: 4px
}

.comment-card .comment-wrapper .comment-action .action-digg svg path[data-v-2c3ce642],
.comment-card .comment-wrapper .comment-action .action-reply svg path[data-v-2c3ce642] {
  transition: all .2s;
  fill: currentColor
}

.comment-card .comment-wrapper .comment-action .action-digg.active[data-v-2c3ce642],
.comment-card .comment-wrapper .comment-action .action-digg[data-v-2c3ce642]:hover,
.comment-card .comment-wrapper .comment-action .action-reply.active[data-v-2c3ce642],
.comment-card .comment-wrapper .comment-action .action-reply[data-v-2c3ce642]:hover {
  color: var(--juejin-font-brand1-normal)
}

.comment-card .comment-wrapper .comment-action .more-action[data-v-2c3ce642] {
  cursor: pointer
}

.comment-card .comment-wrapper .comment-action .more-action .more-btn[data-v-2c3ce642] {
  display: flex;
  align-items: center;
  padding: 0 6px;
  transition: all .2s;
  border-radius: 2px
}

.comment-card .comment-wrapper .comment-action .more-action .more-btn svg circle[data-v-2c3ce642] {
  fill: var(--juejin-font-2)
}

.comment-card .comment-wrapper .comment-action .more-action .more-btn:hover svg circle[data-v-2c3ce642] {
  fill: var(--juejin-font-brand1-normal)
}

.comment-card .comment-wrapper .comment-action .more-action .more-menu[data-v-2c3ce642] {
  color: var(--juejin-font-1);
  font-size: 14px;
  font-weight: 400;
  line-height: 24px
}

.comment-card .comment-wrapper .comment-action .more-action .more-menu li[data-v-2c3ce642] {
  height: 32px;
  padding: 0 16px 0 12px;
  display: flex;
  align-items: center;
  transition: all .2s;
  cursor: pointer;
  min-width: 0
}

.comment-card .comment-wrapper .comment-action .more-action .more-menu li .menu-icon[data-v-2c3ce642] {
  margin-right: 8px;
  flex-shrink: 0;
  color: var(--juejin-font-2)
}

.comment-card .comment-wrapper .comment-action .more-action .more-menu li .menu-label[data-v-2c3ce642] {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  word-break: break-all
}

.comment-card .comment-wrapper .comment-action .more-action .more-menu li[data-v-2c3ce642]:hover {
  background: var(--juejin-gray-3)
}

.comment-card .comment-wrapper .comment-action .more-action[data-v-2c3ce642] .more-popover .byte-popover {
  border-radius: 4px;
  padding: 0
}

.comment-card .comment-wrapper .comment-action .more-action[data-v-2c3ce642] .more-popover .byte-popover__content {
  margin: 0
}

.comment-card .comment-wrapper .comment-action .more-action[data-v-2c3ce642] .more-popover .popper__arrow {
  display: none
}

.comment-card .comment-reply-editor[data-v-2c3ce642] {
  margin-top: 8px
}

.comment-card .comment-form[data-v-2c3ce642] .avatar {
  margin-right: 12px;
  width: 28px;
  height: 28px
}

.comment-card.small .comment-avatar[data-v-2c3ce642] {
  width: 32px;
  margin-right: 12px
}

.comment-card.small .comment-avatar .avatar[data-v-2c3ce642] {
  width: 32px;
  height: 32px
}

.comment-card.small .comment-avatar .avatar .avatar-tag[data-v-2c3ce642] {
  position: absolute;
  right: -2px;
  bottom: -3px;
  width: 16px;
  height: 16px
}

.comment-card.small .comment-wrapper[data-v-2c3ce642] {
  flex: 1;
  min-width: 0
}

.comment-card.small .comment-wrapper .comment-header[data-v-2c3ce642] {
  display: flex;
  align-items: center;
  padding: 1px 0
}

.comment-card.small .comment-wrapper .comment-header .username[data-v-2c3ce642] {
  color: var(--juejin-font-2);
  font-size: 14px;
  font-weight: 400;
  line-height: 24px
}

.comment-card.small .comment-wrapper .comment-header .author-tag[data-v-2c3ce642] {
  margin-left: 2px;
  font-size: 10px;
  line-height: 12px;
  border-radius: 1px;
  height: 16px;
  width: 30px
}

.comment-card.small .comment-wrapper .comment-header .author-intro[data-v-2c3ce642] {
  color: var(--juejin-font-3);
  font-size: 12px;
  line-height: 18px;
  margin-left: 8px
}

.comment-card.small .comment-wrapper .comment-content[data-v-2c3ce642] {
  margin-top: 4px
}

.comment-card.small .comment-wrapper .comment-content .content[data-v-2c3ce642] {
  font-size: 14px;
  line-height: 24px
}

.comment-card.small .comment-wrapper .comment-content .expand-action-wrap[data-v-2c3ce642] {
  margin-top: 4px
}

.comment-card.small .comment-wrapper .comment-content .expand-action-wrap .expand-action[data-v-2c3ce642] {
  font-size: 12px;
  line-height: 22px
}

.comment-card.small .comment-wrapper .comment-content .comment-img-box[data-v-2c3ce642] {
  margin-top: 6px
}

.comment-card.small .comment-wrapper .comment-content .comment-img-box .comment-img[data-v-2c3ce642] {
  width: 100px;
  height: 100px
}

.comment-card.small .comment-wrapper .comment-action[data-v-2c3ce642] {
  margin-top: 6px;
  font-size: 12px;
  line-height: 20px
}

.comment-card.small .comment-wrapper .comment-action .action-digg[data-v-2c3ce642],
.comment-card.small .comment-wrapper .comment-action .action-reply[data-v-2c3ce642] {
  padding: 0 8px
}

.comment-card.small .comment-wrapper .comment-action .action-digg svg[data-v-2c3ce642],
.comment-card.small .comment-wrapper .comment-action .action-reply svg[data-v-2c3ce642] {
  width: 14px;
  height: 14px
}

@keyframes skeleton-keyframes-data-v-3c9d31de {
  0% {
    background-position: 0 0
  }

  to {
    background-position: 480px 0
  }
}

.comment-list-wrapper[data-v-3c9d31de] {
  padding: 0;
  box-sizing: border-box
}

.comment-list-wrapper [data-v-3c9d31de] {
  box-sizing: border-box
}

.comment-list-wrapper .comment-list-header .sort .item[data-v-3c9d31de] {
  font-size: 15px;
  font-weight: 500;
  line-height: 22px;
  display: inline-block;
  color: var(--juejin-font-2);
  font-weight: 400;
  cursor: pointer;
  border-radius: 2px;
  padding: 3px 4px
}

.comment-list-wrapper .comment-list-header .sort .item.active[data-v-3c9d31de] {
  color: var(--juejin-font-brand1-normal)
}

.comment-list-wrapper .comment-list-header .sort .divider[data-v-3c9d31de] {
  display: inline-block;
  width: 1px;
  height: 13px;
  background: var(--juejin-gray-1-1);
  position: relative;
  top: 2px;
  margin: 0 3px
}

.comment-list-wrapper .fetch-more-comment[data-v-3c9d31de] {
  margin-top: 12px;
  border-radius: 4px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--juejin-font-2);
  font-size: 15px;
  height: 52px;
  cursor: pointer;
  background: var(--juejin-gray-3);
  font-weight: 500;
  transition: all .2s
}

.comment-list-wrapper .fetch-more-comment svg[data-v-3c9d31de] {
  fill: currentColor;
  margin-left: 8px
}

.comment-list-wrapper .fetch-more-comment[data-v-3c9d31de]:hover {
  background: var(--juejin-gray-2)
}

.comment-list-wrapper .comment-list[data-v-3c9d31de] {
  min-height: 120px;
  margin-top: 4px
}

.comment-list-wrapper .comment-list .comment-item[data-v-3c9d31de] {
  padding: 16px 0
}

.comment-list-wrapper .comment-list .comment-item.anchor-active[data-v-3c9d31de]:before {
  background: var(--juejin-brand-5-light);
  left: -20px;
  right: -20px;
  bottom: var(--juejin-anchor-bottom)
}

.comment-list-wrapper.small .comment-list-header .sort .item[data-v-3c9d31de] {
  font-size: 14px
}

.comment-list-wrapper.small .comment-list-header .sort .divider[data-v-3c9d31de] {
  margin: 0 2px
}

.comment-list-wrapper.small .comment-list[data-v-3c9d31de] {
  margin-top: 4px;
  min-height: 104px
}

.comment-list-wrapper.small .comment-list .comment-item[data-v-3c9d31de] {
  padding: 12px 0
}

.comment-list-wrapper.small .fetch-more-comment[data-v-3c9d31de] {
  margin-top: 12px;
  font-size: 13px;
  height: 40px;
  cursor: pointer
}

.comment-list-wrapper.small .fetch-more-comment svg[data-v-3c9d31de] {
  margin-left: 6px
}

@keyframes skeleton-keyframes-data-v-3710f1dd {
  0% {
    background-position: 0 0
  }

  to {
    background-position: 480px 0
  }
}

.jj-comment-list-container[data-v-3710f1dd] {
  font-style: normal
}

.jj-comment-list-container .comment-editor[data-v-3710f1dd] {
  margin-top: 32px
}

.jj-comment-list-container .comment-editor[data-v-3710f1dd] .comment-input .input-box {
  display: flex;
  flex-direction: column
}

.jj-comment-list-container .comment-editor[data-v-3710f1dd] .comment-input .input-box.focused {
  min-height: 150px;
  max-height: 300px
}

.jj-comment-list-container .comment-editor[data-v-3710f1dd] .comment-input .input-box .rich-input {
  flex: 1;
  max-height: none
}

.jj-comment-list-container .comment-editor[data-v-3710f1dd] .comment-input .input-box .action-box {
  flex-shrink: 0
}

.jj-comment-list-container .hot-comment[data-v-3710f1dd] {
  margin-top: 0
}

.jj-comment-list-container .title[data-v-3710f1dd] {
  color: var(--juejin-font-1);
  font-size: 18px;
  font-weight: 600;
  line-height: 30px
}

.jj-comment-list-container .comment-list-root[data-v-3710f1dd] {
  margin-top: 32px
}

.jj-comment-list-container.hidden-title .comment-list-root[data-v-3710f1dd] {
  margin-top: 20px
}

.jj-comment-list-container.small .title[data-v-3710f1dd] {
  font-size: 16px;
  font-weight: 500;
  line-height: 24px
}

.jj-comment-list-container.small .comment-editor[data-v-3710f1dd] {
  margin-top: 16px
}

.jj-comment-list-container.small .comment-list-root[data-v-3710f1dd] {
  margin-top: 20px
}

@keyframes skeleton-keyframes-data-v-9554820c {
  0% {
    background-position: 0 0
  }

  to {
    background-position: 480px 0
  }
}

.jj-recommend-users-card[data-v-9554820c] {
  box-sizing: border-box;
  position: relative;
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: 20px;
  text-align: center;
  border: 1px solid var(--juejin-gray-1-3);
  background: var(--juejin-layer-1);
  border-radius: 4px;
  padding: 11px;
  display: flex;
  flex-direction: column;
  cursor: pointer;
  align-items: center
}

.jj-recommend-users-card [data-v-9554820c] {
  box-sizing: border-box
}

.jj-recommend-users-card .avatar[data-v-9554820c] {
  display: flex;
  width: 48px;
  height: 48px
}

.jj-recommend-users-card .level[data-v-9554820c] {
  position: absolute;
  bottom: -2px;
  left: 50%;
  transform: translateX(-50%);
  margin: 0
}

.jj-recommend-users-card .username[data-v-9554820c] {
  font-size: 14px;
  line-height: 22px;
  margin-bottom: 4px;
  color: var(--juejin-font-1)
}

.jj-recommend-users-card .count[data-v-9554820c],
.jj-recommend-users-card .username[data-v-9554820c] {
  min-width: 0;
  max-width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  word-break: break-all
}

.jj-recommend-users-card .count[data-v-9554820c] {
  opacity: .8;
  margin-bottom: 2px;
  color: var(--juejin-font-2)
}

.jj-recommend-users-card .count .split[data-v-9554820c] {
  margin: 0
}

.jj-recommend-users-card .reason[data-v-9554820c] {
  color: var(--juejin-font-2);
  background-color: var(--juejin-gray-3);
  margin-bottom: 8px;
  border-radius: 2px;
  padding: 2px 6px;
  min-width: 0;
  max-width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  word-break: break-all
}

.jj-recommend-users-card .close-btn[data-v-9554820c] {
  position: absolute;
  top: 6px;
  right: 7px;
  display: flex;
  padding: 4px;
  cursor: pointer
}

.jj-recommend-users-card .close-btn svg[data-v-9554820c] {
  fill: var(--juejin-font-4);
  transition: all .2s
}

.jj-recommend-users-card .close-btn:hover svg[data-v-9554820c] {
  fill: var(--juejin-font-2)
}

.jj-recommend-users-card .follow-btn[data-v-9554820c] {
  border-radius: 4px;
  border: 1px solid var(--juejin-brand-1-normal);
  background: var(--juejin-brand-1-normal);
  width: 80px;
  height: 28px;
  display: flex;
  color: #fff;
  color: var(--font-white, #fff);
  margin: auto;
  justify-content: center;
  align-items: center;
  cursor: pointer;
  transition: all .2s;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  word-break: break-all;
  max-width: 100%
}

.jj-recommend-users-card .follow-btn[data-v-9554820c]:hover {
  border: 1px solid var(--juejin-brand-2-hover);
  background: var(--juejin-brand-2-hover)
}

.jj-recommend-users-card .follow-btn.followed[data-v-9554820c] {
  border: 1px solid rgba(30, 128, 255, .3);
  border: 1px solid var(--secondary-stroke-1, rgba(30, 128, 255, .3));
  background: rgba(30, 128, 255, .05);
  background: var(--secondary-fill-1, rgba(30, 128, 255, .05));
  color: var(--juejin-brand-1-normal)
}

@media (max-width:600px) {
  .jj-recommend-users-card[data-v-9554820c] {
    padding: 11px 7px;
    font-size: 11px;
    font-weight: 400;
    line-height: 20px
  }

  .jj-recommend-users-card .count[data-v-9554820c] {
    font-size: 12px;
    color: var(--juejin-font-3)
  }

  .jj-recommend-users-card .count .split[data-v-9554820c] {
    display: none
  }

  .jj-recommend-users-card .reason[data-v-9554820c] {
    font-size: 11px;
    padding: 1px 4px
  }

  .jj-recommend-users-card .follow-btn[data-v-9554820c] {
    font-size: 13px;
    width: 76px
  }
}

@keyframes skeleton-keyframes-data-v-fd48baf4 {
  0% {
    background-position: 0 0
  }

  to {
    background-position: 480px 0
  }
}

.jj-recommend-users[data-v-fd48baf4] {
  box-sizing: border-box;
  overflow: hidden;
  position: relative;
  opacity: 1;
  height: auto;
  background-color: var(--juejin-layer-1);
  padding: 12px 14px;
  transition: all .2s
}

.jj-recommend-users.un-init[data-v-fd48baf4] {
  opacity: 0;
  height: 1px;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden
}

.jj-recommend-users [data-v-fd48baf4] {
  box-sizing: border-box
}

.jj-recommend-users .recommend-users-header[data-v-fd48baf4] {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 12px;
  padding: 0 6px
}

.jj-recommend-users .recommend-users-header .title[data-v-fd48baf4] {
  color: var(--juejin-font-1);
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 24px
}

.jj-recommend-users .recommend-users-header .change-page-btn[data-v-fd48baf4] {
  color: var(--juejin-font-2);
  font-size: 13px;
  font-style: normal;
  font-weight: 400;
  line-height: 20px;
  cursor: pointer;
  transition: all .2s
}

.jj-recommend-users .recommend-users-header .change-page-btn[data-v-fd48baf4]:hover {
  color: var(--juejin-brand-2-hover)
}

.jj-recommend-users .user-list[data-v-fd48baf4] {
  display: flex
}

.jj-recommend-users .user-list .user-item[data-v-fd48baf4] {
  padding: 0 6px;
  width: 25%;
  min-width: 0
}

.jj-recommend-users .user-list-scroll[data-v-fd48baf4] {
  display: flex;
  overflow: auto;
  flex-wrap: nowrap
}

.jj-recommend-users .user-list-scroll .user-item[data-v-fd48baf4] {
  padding: 0 2px 0 6px;
  width: 144px;
  min-width: 0;
  flex-shrink: 0
}

.light-theme,
body {
  --juejin-icon-close-bg: rgba(0, 0, 0, 0.3)
}

.dark-theme,
body[data-theme=dark] {
  --juejin-icon-close-bg: hsla(0, 0%, 100%, 0.2)
}

@keyframes skeleton-keyframes-data-v-dfa31b92 {
  0% {
    background-position: 0 0
  }

  to {
    background-position: 480px 0
  }
}

.icon-close-triangle[data-v-dfa31b92] {
  position: absolute;
  right: 0;
  top: 0;
  cursor: pointer;
  color: var(--juejin-icon-close-bg)
}

@keyframes skeleton-keyframes-data-v-1560bf14 {
  0% {
    background-position: 0 0
  }

  to {
    background-position: 480px 0
  }
}

.qrcode-popover[data-v-1560bf14] .byte-popover {
  border-radius: 4px;
  background: linear-gradient(180deg, #edf5ff, #fff);
  box-shadow: 0 8px 24px 0 rgba(81, 87, 103, .16);
  padding: 24px 0 20px;
  box-sizing: border-box
}

.qrcode-popover[data-v-1560bf14] .byte-popover .byte-popover__content {
  margin: 0
}

.qrcode-popover[data-v-1560bf14] .byte-popover .popper__arrow {
  border: none;
  background: #fff;
  border-radius: 0 2px 0 0
}

.qrcode-popover[data-v-1560bf14] .byte-popover[x-placement=bottom] .popper__arrow {
  background: #edf5ff
}

.qrcode-popover.dark[data-v-1560bf14] .byte-popover {
  background: linear-gradient(180deg, #272f39, #282828)
}

.qrcode-popover.dark[data-v-1560bf14] .byte-popover .popper__arrow {
  background: #282828
}

.qrcode-popover.dark[data-v-1560bf14] .byte-popover[x-placement=bottom] .popper__arrow {
  background: #272f39
}

.qrcode-popover .qrcode-popover__content[data-v-1560bf14] {
  display: flex;
  flex-direction: column;
  align-items: center
}

.qrcode-popover .qrcode-popover__content .qrcode-popover__qrcode[data-v-1560bf14] {
  width: 120px;
  height: 120px
}

.qrcode-popover .qrcode-popover__content .qrcode-popover__description[data-v-1560bf14] {
  margin-top: 18px;
  color: var(--juejin-font-2);
  text-align: center;
  font-size: 14px;
  font-weight: 400;
  line-height: 22px
}

@keyframes skeleton-keyframes-data-v-6c706188 {
  0% {
    background-position: 0 0
  }

  to {
    background-position: 480px 0
  }
}

.home-feed[data-v-6c706188] {
  position: relative
}

.home-feed .home-feed__content[data-v-6c706188] {
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 56px;
  box-sizing: border-box;
  background-size: 100%
}

.home-feed .home-feed__content .home-feed__title[data-v-6c706188] {
  cursor: pointer;
  padding: 0;
  margin: 0;
  color: var(--juejin-font-1);
  text-align: center;
  font-size: 15px;
  font-weight: 400;
  line-height: 24px
}

.home-feed .home-feed__content .home-feed__title[data-v-6c706188] em {
  font-style: normal;
  font-weight: 500;
  color: var(--juejin-font-brand1-normal);
  margin-right: 8px
}

@keyframes skeleton-keyframes-data-v-3b6095bc {
  0% {
    background-position: 0 0
  }

  to {
    background-position: 480px 0
  }
}

.advertisement[data-v-3b6095bc] {
  position: relative;
  cursor: pointer;
  padding: 12px 20px 0
}

.advertisement .meta-container .user-message[data-v-3b6095bc],
.advertisement .meta-container[data-v-3b6095bc] {
  display: flex;
  align-items: center
}

.advertisement .meta-container .user-message .userbox[data-v-3b6095bc] {
  max-width: 162px;
  font-size: 13px;
  line-height: 22px;
  color: var(--juejin-font-3);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  word-break: break-all
}

.advertisement .meta-container .user-message .userbox[data-v-3b6095bc]:hover {
  color: var(--juejin-font-brand1-normal)
}

.advertisement .meta-container .date[data-v-3b6095bc] {
  line-height: 22px;
  font-size: 13px;
  color: var(--juejin-font-3);
  margin-left: 20px
}

.advertisement .tag[data-v-3b6095bc] {
  position: absolute;
  bottom: 0;
  right: 0;
  box-sizing: border-box;
  border-radius: 4px 0 4px 0;
  line-height: 18px;
  width: 32px;
  text-align: center;
  color: var(--juejin-font-white);
  font-size: 12px;
  background-color: var(--juejin-shade-1)
}

.advertisement .main[data-v-3b6095bc] {
  padding-bottom: 12px;
  display: flex;
  border-bottom: 1px solid var(--juejin-gray-1-2);
  align-items: center
}

.advertisement .main .info-box[data-v-3b6095bc] {
  flex-grow: 1
}

.advertisement .main .info-box .title[data-v-3b6095bc] {
  font-weight: 600;
  font-size: 16px;
  line-height: 24px;
  color: var(--juejin-font-1);
  margin-bottom: 4px
}

.advertisement .main .info-box .description[data-v-3b6095bc],
.advertisement .main .info-box .title[data-v-3b6095bc] {
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1
}

.advertisement .main .info-box .description[data-v-3b6095bc] {
  font-weight: 400;
  font-size: 13px;
  line-height: 22px;
  color: var(--juejin-font-3)
}

.advertisement .thumb[data-v-3b6095bc] {
  flex: 0 0 auto;
  width: 108px;
  height: 72px;
  margin-left: 24px;
  border-radius: 4px;
  border: 1px solid var(--juejin-gray-1-2)
}

@media (max-width:600px) {
  .advertisement .thumb[data-v-3b6095bc] {
    margin-left: 12px
  }
}

.advertisement .thumb-wrap[data-v-3b6095bc] {
  position: relative;
  display: flex
}

.advertisement .footer[data-v-3b6095bc] {
  margin-top: 6px
}

body[data-theme=dark] .thumb[data-v-3b6095bc] {
  filter: brightness(.94)
}

@keyframes skeleton-keyframes-data-v-7e1924fd {
  0% {
    background-position: 0 0
  }

  to {
    background-position: 480px 0
  }
}

.content-box[data-v-7e1924fd] {
  display: block;
  position: relative;
  background: var(--juejin-layer-1);
  padding: 12px 20px 0
}

.content-box[data-v-7e1924fd]:hover {
  background: var(--juejin-gray-3)
}

.content-box .meta-container .user-message[data-v-7e1924fd],
.content-box .meta-container[data-v-7e1924fd] {
  display: flex;
  align-items: center
}

.content-box .meta-container .user-message .userbox[data-v-7e1924fd] {
  max-width: 162px;
  font-size: 13px;
  line-height: 22px;
  color: var(--juejin-font-2);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  word-break: break-all
}

.content-box .meta-container .user-message .userbox[data-v-7e1924fd]:hover {
  color: var(--juejin-brand-1-normal)
}

.content-box .tag[data-v-7e1924fd] {
  position: absolute;
  top: 12px;
  right: 20px;
  border: 1px solid var(--juejin-gray-1-1);
  box-sizing: border-box;
  border-radius: 2px;
  line-height: 18px;
  width: 42px;
  text-align: center;
  color: #ff85af;
  font-size: 13px
}

.content-box .main-row[data-v-7e1924fd] {
  padding-bottom: 12px;
  border-bottom: 1px solid var(--juejin-gray-1-1)
}

.content-box .main[data-v-7e1924fd] {
  margin-top: 6px
}

.content-box .main .info-box[data-v-7e1924fd] {
  flex-grow: 1
}

.content-box .main .info-box .title[data-v-7e1924fd] {
  font-weight: 700;
  font-size: 16px;
  line-height: 24px;
  color: var(--juejin-font-1)
}

.content-box .main .info-box .description[data-v-7e1924fd],
.content-box .main .info-box .title[data-v-7e1924fd] {
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1
}

.content-box .main .info-box .description[data-v-7e1924fd] {
  margin-top: 8px;
  font-weight: 400;
  font-size: 13px;
  line-height: 22px;
  color: var(--juejin-font-3)
}

.content-box .action-list[data-v-7e1924fd] {
  display: flex;
  align-items: center;
  margin-top: 10px
}

.content-box .action-list .item[data-v-7e1924fd] {
  position: relative;
  align-items: center;
  display: flex;
  margin-right: 32px;
  font-size: 13px;
  line-height: 20px;
  color: var(--juejin-font-3)
}

.content-box .action-list .item i[data-v-7e1924fd] {
  display: block;
  width: 16px;
  height: 16px;
  background-size: 100%
}

.content-box .action-list .item i+span[data-v-7e1924fd] {
  margin-left: 4px
}

.content-box .action-list .item.salecount i[data-v-7e1924fd] {
  background-image: url(//lf-web-assets.juejin.cn/obj/juejin-web/xitu_juejin_web/img/salecount.34b2b23.png)
}

.content-box .action-list .item.price i[data-v-7e1924fd] {
  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAYAAABXAvmHAAAACXBIWXMAACE4AAAhOAFFljFgAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAFQSURBVHgB7dlBSsNQEAbgfxKh7sQb1BvYG+gFJO7EjXYnbjyC9QbujCtxo1lq9QC5ifEEusumfWNGjSA0SSHhTWjng8AEpo/8Je81rwGMWW+EDkRHZ8MZMJT6NYlTeNQ6gFy8I3orz5lc9PJw+wxPArRUfvN/HG3Do9YBtFkAbRZAmwXQtgFP5AePEVxKzcTp9PHmHh3wFsABExCf/J6eFkcnAWwOaLMA2lZ7GZWlbw7sSR0C6VMSZ+iZ2gBz0B3RTwDHLJuUCD2z9C3EhC30kE1ibd4eJZZ1cHx+QQ67UhPcVdPC0bsAYL7m8r8S/r5BxnXtNge0WQBtFkCbBdBmAbRZAG0WQFt9AMInGhTP49n/EfmjojWrqCv7GO4dDWoDhPlgXGzm9+UI883DRT2y4QiYd6QnoNmo6g3lNIkn5VhBPhhVXlDZU4wln4ExptYX6V9l8F00/skAAAAASUVORK5CYII=)
}

@keyframes skeleton-keyframes-data-v-60035ee6 {
  0% {
    background-position: 0 0
  }

  to {
    background-position: 480px 0
  }
}

.content-box[data-v-60035ee6] {
  display: block;
  position: relative;
  background: var(--juejin-layer-1);
  padding: 12px 20px 0
}

.content-box[data-v-60035ee6]:hover {
  background: var(--juejin-gray-3)
}

.content-box .meta-container .user-message[data-v-60035ee6],
.content-box .meta-container[data-v-60035ee6] {
  display: flex;
  align-items: center
}

.content-box .meta-container .user-message .userbox[data-v-60035ee6] {
  max-width: 162px;
  font-size: 13px;
  line-height: 22px;
  color: var(--juejin-font-2);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  word-break: break-all
}

.content-box .meta-container .user-message .userbox[data-v-60035ee6]:hover {
  color: var(--juejin-brand-1-normal)
}

.content-box .meta-container .dividing[data-v-60035ee6] {
  width: 1px;
  height: 14px;
  background: var(--juejin-gray-1-1);
  margin: 0 8px
}

.content-box .meta-container .date[data-v-60035ee6] {
  line-height: 22px;
  font-size: 13px;
  color: var(--juejin-font-3)
}

.content-box .tag[data-v-60035ee6] {
  position: absolute;
  top: 12px;
  right: 20px;
  border: 1px solid #ffab1e;
  box-sizing: border-box;
  border-radius: 2px;
  line-height: 18px;
  width: 42px;
  text-align: center;
  color: #ffab1e;
  font-size: 13px
}

.content-box .main[data-v-60035ee6] {
  margin-top: 6px;
  padding-bottom: 12px;
  display: flex;
  border-bottom: 1px solid var(--juejin-gray-1-1)
}

.content-box .main .info-box[data-v-60035ee6] {
  flex-grow: 1
}

.content-box .main .info-box .title[data-v-60035ee6] {
  font-weight: 700;
  font-size: 16px;
  line-height: 24px;
  color: var(--juejin-font-1);
  -webkit-line-clamp: 1
}

.content-box .main .info-box .description[data-v-60035ee6],
.content-box .main .info-box .title[data-v-60035ee6] {
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical
}

.content-box .main .info-box .description[data-v-60035ee6] {
  margin-top: 8px;
  font-weight: 400;
  font-size: 13px;
  line-height: 22px;
  color: var(--juejin-font-3);
  -webkit-line-clamp: 2
}

.content-box .thumb[data-v-60035ee6] {
  flex: 0 0 auto;
  width: 120px;
  height: 80px;
  margin-left: 24px;
  border-radius: 2px
}

@media (max-width:600px) {
  .content-box .thumb[data-v-60035ee6] {
    margin-left: 12px
  }
}

@keyframes skeleton-keyframes-data-v-67a1ea44 {
  0% {
    background-position: 0 0
  }

  to {
    background-position: 480px 0
  }
}

.collection-button-wrap[data-v-67a1ea44] {
  display: flex;
  align-items: center;
  width: 108px;
  height: 22px;
  justify-content: space-between
}

.collection-button-wrap .common-button[data-v-67a1ea44] {
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
  color: #8a919f;
  font-weight: 400;
  font-size: 13px;
  line-height: 22px
}

.collection-button-wrap .common-button[data-v-67a1ea44]:hover {
  color: #1e80ff
}

.collection-button-wrap .common-button:hover .icon path[data-v-67a1ea44] {
  fill: #1e80ff
}

.collection-button-wrap .common-button .text[data-v-67a1ea44] {
  margin: 3px 7px 3px 3px
}

.collection-button-wrap .common-button .icon[data-v-67a1ea44] {
  width: 11px;
  height: 11px
}

.collection-button-wrap .common-button .icon path[data-v-67a1ea44] {
  fill: #8a919f
}

@keyframes skeleton-keyframes-data-v-30fd6c37 {
  0% {
    background-position: 0 0
  }

  to {
    background-position: 480px 0
  }
}

.dislike-button[data-v-30fd6c37] {
  display: inline-block;
  cursor: pointer
}

.dislike-button[data-v-30fd6c37]:after {
  display: block;
  content: " ";
  position: absolute;
  padding: 10px;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  transform: translate(-10px, -10px)
}

.dislike-button .icon-close[data-v-30fd6c37] {
  color: #c9cdd4;
  font-weight: bolder;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  height: 100%;
  display: flex;
  align-items: center
}

.dislike-button:hover .icon-close svg circle[data-v-30fd6c37] {
  fill: #1e80ff
}

@keyframes skeleton-keyframes-data-v-1ba6cc8a {
  0% {
    background-position: 0 0
  }

  to {
    background-position: 480px 0
  }
}

.dislike-menu[data-v-1ba6cc8a] {
  z-index: 100;
  display: flex;
  flex-direction: column;
  width: 17.67rem;
  border-radius: 4px;
  background-color: var(--juejin-popup);
  box-shadow: 0 8px 20px rgba(0, 0, 0, .1);
  overflow: visible
}

.dislike-menu .menu-item[data-v-1ba6cc8a] {
  height: 2.67rem;
  display: flex;
  align-items: center;
  flex-direction: row;
  padding: 0 1rem
}

.dislike-menu .menu-item[data-v-1ba6cc8a]:first-child {
  padding-top: 2px
}

.dislike-menu .menu-item[data-v-1ba6cc8a]:last-child {
  padding-bottom: 2px
}

.dislike-menu .menu-item[data-v-1ba6cc8a]:hover {
  background: var(--juejin-gray-3)
}

.dislike-menu .menu-item .icon-block-user[data-v-1ba6cc8a] {
  flex: 0 0 auto
}

.dislike-menu .menu-item .icon-block-tag path[data-v-1ba6cc8a],
.dislike-menu .menu-item .icon-block-user path[data-v-1ba6cc8a],
.dislike-menu .menu-item .icon-dislike path[data-v-1ba6cc8a],
.dislike-menu .menu-item .icon-report path[data-v-1ba6cc8a] {
  fill: var(--juejin-font-2)
}

.dislike-menu .menu-item .icon-arrow[data-v-1ba6cc8a] {
  margin-left: auto;
  background-image: url(//lf-web-assets.juejin.cn/obj/juejin-web/xitu_juejin_web/806fb5956ad7e61948539f496097b0b1.svg);
  transform: rotate(180deg)
}

.dislike-menu .menu-item .icon-arrow.active[data-v-1ba6cc8a] {
  transform: none
}

.dislike-menu .menu-item .menu-icon[data-v-1ba6cc8a] {
  width: 1.333rem;
  height: 1.333rem;
  background-repeat: no-repeat;
  background-position: 0 0;
  background-size: 100% 100%
}

.dislike-menu .menu-item .menu-text[data-v-1ba6cc8a] {
  margin-left: .667rem;
  font-size: 1.167rem;
  line-height: 2rem;
  color: var(--juejin-font-1)
}

@media (max-width:600px) {
  .dislike-menu .menu-item .menu-text[data-v-1ba6cc8a] {
    margin-left: 1.334rem
  }
}

.dislike-menu .menu-item a.menu-text[data-v-1ba6cc8a] {
  flex: 1 0 auto
}

.dislike-menu .menu-item .tooltip[data-v-1ba6cc8a] {
  flex: 0 1 auto;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  word-break: break-all
}

.dislike-menu .tags-row[data-v-1ba6cc8a] {
  padding: .333rem 1rem 1rem
}

.dislike-menu .tags-row .tag-list[data-v-1ba6cc8a] {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: flex-start;
  align-content: flex-start;
  justify-content: flex-start
}

.dislike-menu .tags-row .tag-list .tag-item[data-v-1ba6cc8a] {
  color: var(--juejin-font-2);
  box-sizing: border-box;
  font-size: 1rem;
  height: 2rem;
  max-width: 15.67rem;
  padding: 0 .667rem;
  border-radius: 4px;
  background-color: var(--juejin-gray-2);
  margin-bottom: .667rem;
  line-height: 2rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  word-break: break-all
}

@media screen and (min-width:961px) {
  .dislike-menu .tags-row .tag-list .tag-item[data-v-1ba6cc8a]:not(:last-child) {
    margin-right: .667rem
  }
}

.dislike-menu .tags-row .tag-list .tag-item.active[data-v-1ba6cc8a] {
  background-color: var(--juejin-brand-fill1-normal);
  border-color: var(--juejin-brand-stroke1-normal);
  color: var(--juejin-font-brand1-normal)
}

.dislike-menu .tags-row .btn-block-tag[data-v-1ba6cc8a] {
  background: var(--juejin-brand-1-normal);
  border-radius: 4px;
  outline: none;
  border: none;
  color: #fff;
  font-size: 1rem;
  text-align: center;
  line-height: 28px;
  width: 100%;
  height: 28px;
  box-sizing: border-box;
  cursor: pointer;
  padding: 0;
  margin-top: .333rem;
  font-size: 12px
}

.dislike-menu .tags-row .btn-block-tag[data-v-1ba6cc8a]:active,
.dislike-menu .tags-row .btn-block-tag[data-v-1ba6cc8a]:hover {
  background-color: var(--juejin-brand-2-hover)
}

.dislike-menu .tags-row .btn-block-tag[data-v-1ba6cc8a]:disabled {
  background: var(--juejin-brand-4-disable);
  cursor: not-allowed
}

@media (max-width:600px) {
  .dislike-menu .tags-row .btn-block-tag[data-v-1ba6cc8a] {
    font-size: 16px
  }
}

@media screen and (max-width:960px) {
  .dislike-menu[data-v-1ba6cc8a] {
    width: calc(100% - 2.667rem);
    border-radius: 8px
  }

  .dislike-menu .tags-row[data-v-1ba6cc8a] {
    position: relative
  }

  .dislike-menu .tags-row[data-v-1ba6cc8a]:after {
    display: inline-block;
    position: absolute;
    bottom: 0;
    left: 2rem;
    right: 2rem;
    height: 1px;
    content: " ";
    background: #e5e6eb
  }
}

@media screen and (max-width:960px) and (-webkit-min-device-pixel-ratio:2) {
  .dislike-menu .tags-row[data-v-1ba6cc8a]:after {
    transform: scaleY(.5)
  }
}

@media screen and (max-width:960px) and (-webkit-min-device-pixel-ratio:3) {
  .dislike-menu .tags-row[data-v-1ba6cc8a]:after {
    transform: scaleY(.333)
  }
}

@media screen and (max-width:960px) {
  .dislike-menu .menu-item[data-v-1ba6cc8a] {
    padding: 0 2rem;
    height: 4.333rem
  }

  .dislike-menu .menu-item[data-v-1ba6cc8a]:hover {
    background: transparent
  }

  .dislike-menu .menu-item[data-v-1ba6cc8a]:not(:last-child):not(.active) {
    position: relative
  }

  .dislike-menu .menu-item[data-v-1ba6cc8a]:not(:last-child):not(.active):after {
    display: inline-block;
    position: absolute;
    bottom: 0;
    left: 2rem;
    right: 2rem;
    height: 1px;
    content: " ";
    background: #e5e6eb
  }
}

@media screen and (max-width:960px) and (-webkit-min-device-pixel-ratio:2) {
  .dislike-menu .menu-item[data-v-1ba6cc8a]:not(:last-child):not(.active):after {
    transform: scaleY(.5)
  }
}

@media screen and (max-width:960px) and (-webkit-min-device-pixel-ratio:3) {
  .dislike-menu .menu-item[data-v-1ba6cc8a]:not(:last-child):not(.active):after {
    transform: scaleY(.333)
  }
}

@media screen and (max-width:960px) {
  .dislike-menu .menu-item .menu-icon[data-v-1ba6cc8a]:not(.icon-arrow) {
    width: 1.667rem;
    height: 1.667rem
  }

  .dislike-menu .menu-item .menu-text[data-v-1ba6cc8a] {
    font-size: 1.333rem;
    line-height: 2.333rem
  }

  .dislike-menu .tags-row[data-v-1ba6cc8a] {
    padding: 0 2rem 1.333rem
  }

  .dislike-menu .tags-row .tag-list .tag-item[data-v-1ba6cc8a] {
    width: calc(50% - .625rem);
    height: 2.667rem;
    font-size: 1.167rem;
    line-height: 2.667rem;
    padding: 0 .833rem;
    text-align: center;
    margin-bottom: 1rem
  }

  .dislike-menu .tags-row .tag-list .tag-item[data-v-1ba6cc8a]:nth-child(odd) {
    margin-right: 1.25rem
  }

  .dislike-menu .tags-row .btn-block-tag[data-v-1ba6cc8a] {
    height: 4rem;
    line-height: 4rem
  }
}

@keyframes skeleton-keyframes-data-v-012280ec {
  0% {
    background-position: 0 0
  }

  to {
    background-position: 480px 0
  }
}

[data-v-012280ec] em {
  color: red;
  font-style: normal
}

.text-highlight[data-v-012280ec] .keyword {
  background-color: #fff;
  color: #f03535
}

.meta-row[data-v-012280ec] {
  justify-content: space-between
}

.meta-row[data-v-012280ec],
.tag_list[data-v-012280ec] {
  display: flex;
  align-items: center
}

.tag_list[data-v-012280ec] {
  padding: 0 4px
}

.tag_list .tag[data-v-012280ec] {
  display: flex;
  position: relative;
  flex-shrink: 0;
  font-size: 13px;
  line-height: 22px;
  align-items: center;
  padding: 0 8px;
  color: var(--juejin-font-3)
}

.tag_list .tag[data-v-012280ec]:hover {
  color: var(--juejin-font-brand2-hover)
}

.tag_list .tag[data-v-012280ec]:not(:last-child):after {
  position: absolute;
  right: -1px;
  display: block;
  content: " ";
  width: 2px;
  height: 2px;
  border-radius: 50%;
  background: var(--juejin-font-2)
}

.entry[data-v-012280ec] {
  cursor: pointer;
  position: relative;
  background: var(--juejin-layer-1);
  padding: 12px 20px 0;
  display: flex;
  flex-direction: column;
  align-items: flex-start
}

.entry.entry-last-one[data-v-012280ec] {
  margin-bottom: 20px
}

.entry.entry-last-one .content-wrapper-special[data-v-012280ec],
.entry.entry-last-one .content-wrapper[data-v-012280ec] {
  border-bottom: unset
}

.entry .dislike-menu[data-v-012280ec] {
  position: absolute;
  top: 100%;
  right: 0
}

.entry .dislike-button[data-v-012280ec] {
  transition: all .15s linear
}

.entry .collection-button-wrap[data-v-012280ec] {
  position: absolute;
  top: 1rem;
  right: 1.667rem;
  transition: all .15s linear
}

.entry[data-v-012280ec]:hover {
  background: var(--juejin-gray-3)
}

@media screen and (min-width:961px) {
  .entry .dislike-button[data-v-012280ec] {
    display: none
  }

  .entry:hover .dislike-button[data-v-012280ec] {
    display: block;
    margin-right: 24px
  }
}

@media screen and (max-width:960px) {
  .entry .dislike-button[data-v-012280ec] {
    display: block
  }
}

.entry .fade-enter-active[data-v-012280ec],
.entry .fade-leave-active[data-v-012280ec] {
  transition: opacity .15s ease-in
}

.entry .fade-enter[data-v-012280ec],
.entry .fade-leave-to[data-v-012280ec] {
  opacity: 0
}

.entry .is-top-tag[data-v-012280ec] {
  height: 22px;
  width: 50px;
  box-sizing: border-box;
  border-radius: 4px;
  font-size: 12px;
  font-weight: 400;
  line-height: 20px;
  text-align: center;
  white-space: nowrap;
  flex-shrink: 0;
  transform: none;
  margin-right: 8px;
  color: var(--juejin-warning-1-normal);
  background: #fff7e8;
  display: flex;
  justify-content: center;
  align-items: center
}

.entry svg.jj-icon[data-v-012280ec],
.entry svg.jj-icon line[data-v-012280ec],
.entry svg.jj-icon path[data-v-012280ec] {
  stroke: currentColor
}

.content-wrapper[data-v-012280ec] {
  display: flex;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--juejin-gray-1-2);
  width: 100%
}

.content-wrapper .content-main[data-v-012280ec] {
  flex: 1 1 auto
}

.meta-container .user-message[data-v-012280ec],
.meta-container[data-v-012280ec] {
  display: flex;
  align-items: center;
  color: var(--juejin-font-3)
}

.meta-container .user-message[data-v-012280ec] {
  max-width: 132px;
  font-size: 13px;
  line-height: 22px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  word-break: break-all
}

.meta-container .user-message[data-v-012280ec]:hover {
  color: var(--juejin-font-brand2-hover)
}

.meta-container .user-message .user-popover[data-v-012280ec] {
  display: inline;
  overflow: hidden;
  text-overflow: ellipsis
}

.meta-container .date[data-v-012280ec] {
  position: relative;
  padding: 0 12px;
  line-height: 22px;
  font-size: 13px;
  flex-shrink: 0
}

.meta-container .date[data-v-012280ec]:after,
.meta-container .date[data-v-012280ec]:before {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  display: block;
  width: 1px;
  height: 12px;
  background: var(--juejin-gray-1-1);
  content: " "
}

.meta-container .date[data-v-012280ec]:before {
  left: 0
}

.meta-container .date[data-v-012280ec]:after {
  right: 0
}

.footer-divider[data-v-012280ec] {
  width: 1px;
  height: 12px;
  background-color: var(--juejin-gray-1-1);
  margin: 0 -13px 0 12px
}

.action-list>.item[data-v-012280ec],
.action-list[data-v-012280ec] {
  display: flex;
  align-items: center
}

.action-list>.item[data-v-012280ec] {
  position: relative;
  margin-right: 24px;
  font-size: 13px;
  line-height: 20px;
  color: var(--juejin-font-3);
  flex-shrink: 0
}

.action-list>.item.dislike-item[data-v-012280ec] {
  margin: 0
}

.action-list>.item i[data-v-012280ec] {
  display: block;
  width: 16px;
  height: 16px;
  background-size: 100%
}

.action-list>.item span[data-v-012280ec] {
  margin-left: 4px
}

.action-list>.item.comment:hover span[data-v-012280ec],
.action-list>.item.like:hover span[data-v-012280ec],
.action-list>.item.more:hover span[data-v-012280ec] {
  color: var(--juejin-font-brand2-hover)
}

.action-list>.item.like i[data-v-012280ec] {
  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAACXBIWXMAABYlAAAWJQFJUiTwAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAJ9SURBVHgB7VZNbtNQEP7GP7AkN8DcoJyA5gRNTwCR2kqsUm9YEKEaoZRl0hUSBLWcAHOCpjdIT1AfIewgTjzM+AccxwHXLRYS/STnvbyxZ743b34e8L+DcEMMhu+fERk7DLTAuAwRjjz3eVD1+xsROD75eARmr7AczDlsVyVhoCbeDt85mXHmqLtkbst0Ko9jk31aVU9tAgvYW7FxYNJ3D85eufuTOZtKYiZu3X4z/LBdRU9tAia4E0+YL7I1z+3OmPEpkWOrip7aBED0RAcb7K8KeBb/alD+LQIa+TI48kxfuAfTVSlVMlybgAafpN1RYgujopwIOzpGEhuogGuloTc8bd2j5TmS8/VfHu7t5uUaeCaRygORPaqi00JFJAVn2UuNa667xXfEeJZ+rePR+Kool7gIQg67+RpBJTvo5QMoZHPXxFLW8Tld2lhoUqMOfg/JlKjdT2Pnpwf0bDlx3worG1EnPlENF0m5OayO5+7NyjRLHXgMfCsNQhumrBviRfRAhnqyu0KAYXmpcX/BfKKekL+dvBIheOUddkuNK7QO6A43ycXDvolYr5OtGTnlD3VU41rVZLdfccvIipMYDdYINAHZZJyicgR+4wQ0hbVH6Px7RBeNE9BM0lGbVxorTRNImhcxf8mvNxcDafOywBM0TUCqqEa/I09QbF6NECDQdjKuN6hGCJSlX2MENqXfGgFKS6hlmA9wi7hvLJ/qWEy/DL96AfMlEXWkU/mD0XiCkjud7kRk56iOltwRYz3ShM7KXlhpx4PheBR3qxzS6zbSi0YtyOZe9919D38ioNC2vIDl6NyQC2bWtzWVomvf93gWwg7KXH+HfwY/AGsn+Lf3Dim6AAAAAElFTkSuQmCC)
}

.action-list>.item.like .liked-wrap[data-v-012280ec] {
  flex-direction: column;
  display: flex;
  justify-content: center;
  align-items: center
}

.action-list>.item.like:hover i[data-v-012280ec] {
  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAACXBIWXMAABYlAAAWJQFJUiTwAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAKYSURBVHgB7VddbtNAEJ7ZdVJFtMKPSE2EjxBOgHOChhOQnCDilTaqoYLncIK2J6g5QZ0bpCeoVUDi0RCkQOzdZfyTHztO5brFPMD3EI1ndmc+r+dnA/CvA+GeaA1nPQB2QK50peAq0MToq9Vwi+6/F4HmkX+MqKyM2vW56BQlwaAknlgzYxVc9JUUHUSY0INRE/y0qJ/SBGoBayei8+mkcfb5XcNhrNahI/VIZzYPZ2YRP6UJELrhj5JqvFC4FnpSwXmkB2wXcVKeAMLzKJBCO6VXyovNqBdxU4pAnPloUNZPvryvT1JGLBa4NIEw+WjbcbSZsVHWTol5EEvSgQK4EwHdUroW8Iv47ZV981Y7X7c3D30ztJHohklZxKcGBbH/et7DwB9QqYXJ5WqafJVdg0yeJq1Fbw1/XW96wbBH9Nd7BGbfgJwMYC2BptPai73duUlne5GoXE6Nxs1pNHFQNOB2eFJAZ5E7yxOIGotQl9nm+GjP70ohgXFOT3LM+U7XtepenmfO688Afm5JQqEHQb1HJzhgHOgloZ8iQI3FimMrW0n5AZlGi1Q37YRdh7UOW5DYttrphG1AFQY3lh5XZnwahafgUQIp+Q0eGIyJRXNycwj8eSjF4hJFZldOwKASpk9shvL0Ox9XTkAEVEkxHG+0yqMqP0GU0FLKj+vK6ggkwwsUc6BqAvvWvL1o0dnhVQkBLqSZiE7WVgmBvPKrjMC28tskgHFpIK89hgeElP7LREyV3wLLWUAt+AoZdkmwW8O5Q6q8O51JtksoCLoxhf8VIj+I7CxvTXocH81H4bRKOaHrdrSQ8cKBN4OoNzcnO1a+LQODxnLgx9NKqwnPtXYnsf5HO/D5ne574X4a6O5tE/Q//jp+A4uQ/sJMdO/iAAAAAElFTkSuQmCC)
}

.action-list>.item.like:hover .liked-icon path[data-v-012280ec] {
  fill: var(--juejin-font-brand2-hover)
}

.action-list>.item.like.active[data-v-012280ec] {
  color: var(--juejin-font-brand2-hover)
}

.action-list>.item.like.active i[data-v-012280ec] {
  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAACXBIWXMAABYlAAAWJQFJUiTwAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAG1SURBVHgB7ZdbTsJAFIb/MwWMEZI+moix7oAdCCsQdwAr4F00VI0+4wrUFagrAHcAO5h4SXxsxISEtjNOJZByCRTo5UG/J+YMw3y055xpgb8OYUP2z/sVgB2rn9KlRNdJuc1Pc5sHXb+RQP7MbhBJcyrMbc0tBZVgWJNds2/M2dzDSLvaHQKytkDaYYUF08V8vV9ElAKK8qJJCVokGIIA4WjxNOmISmCY+WQgBFYW8JJPLWss/6ZoIwArlaFuSj3r2C0iLLu//O0qc4gwBfZOBxViqAXY3MNSaWjN2c7rEVV/j5gQyNftIjFRgy+Ber30SS47KILoEeFgCRelj5tMxxukRtHfxuLK1vRF2cnZZeEKME1DSOhMg/qTqHqDcRKqxmIiPozRB18V0AHig2NWIEaIPSFJgd6X9oIEBdpWk6zEBIQQz/5x/FdAsjYSFOCjBpSUQHs6EK+Ar/wSEfCX36wAkYVomSi/GQEpRBcRQsTu58XHAu/XW6Z6sbidWShcrp4BODbZHPLi9TL1MH9uCkMdy449PK1SadfiZrYzjH8XHFsL9KA5wluvDnTOzchv7z/r8wP0gYciEk0ZYQAAAABJRU5ErkJggg==)
}

.action-list>.item.like.active .liked-icon path[data-v-012280ec] {
  stroke: transparent;
  fill: var(--juejin-font-brand2-hover)
}

.action-list>.item.comment i[data-v-012280ec] {
  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAACXBIWXMAABYlAAAWJQFJUiTwAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAKRSURBVHgB7VZNbtpQEJ55BlR15RvUOUHTG5ATJD1BQ9NU6gq8JKiKoyrJ0u2qUmkFOUGaE5TegJwg7gnqLRh7MvMwwiDbYHCUDZ9kHph5M9+bN38AO+zwzEAoiEv3xz4v/KAFiK/0S6J/qPCBoui+Y38cFlC3HgHH7Zk1FTXZUIt/mivEPVY6GFFw4difPNiWwNW3X+dLhj1iA3JqProXq7EQ8TVoz4A1147OWfPkAjYhcO1+twirt7FSEexPiG4+26cDyMEXt1s3AI7Z+LsZ4TEFB1newBzjf2B6Gi8kaqwyvEpHFgmVtjmxcTgm401R44I2G0M2KjpEV5W9KbG0koC+8znrt47d8GFDCAk+gJCQwNyvwqS1LLNwBbHbHuQ7G99bJ4rXgY4LRPGqz4T2koda8EAERl2zIrory7hArlBnDmdSDSbHyf8WrwDVNHKV0YOyQdGNXhAPMwlgnHKjaHQPJUNBOEjamL9fhI7SMt0/Q3uu08wjoJGWLk+FZQKefLyEwIKSETcxwTCbANFfWQLAIygZCFifrjkEQq73WgixCaUziHWi+p1JIC65Hj/mpdt1oCQkq2u7+f4uk4BAGo8minguFQy2hFRXvlonqTuXgK5aRLqHc/m8vXK7LdgCE6hYskolTGtqqWnYsU+dmITJrnCvv/7sOXKSDVCBiScrJgeVBHInIokDuYqEsB5KQqgMl7uk1A4DwrpCkFLLExL0x1HAWfXCr2H4X2TOWh+wEAGB7pBQcRITzgwymvmxEilcVtp+cX1cfs20Drv2VKyDSVUPI4Ij3lRPEfFJclzXEvIQlXhioZ4QYaNjn/Q3IrAMiQmDA0wB+QGEflr/ENK6xXOXFS8QRQdFx/YdnhyP1D0hcwr1KvEAAAAASUVORK5CYII=)
}

.action-list>.item.comment:hover i[data-v-012280ec] {
  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAACXBIWXMAABYlAAAWJQFJUiTwAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAALDSURBVHgB7ZZdTttAEMdnd+0UikB+rASl5gRNb5CcAHqCkhOQ51IaA6Kv7Q0IJ6CcoOEGcALcAlLfaolKlNi705m1Q53UBhKMeOEvRd74Y+a3s7szA/CkJz2yBIyp+ff9Ol3qQqAvpHjF99Dgd6nUiU7M8fmn2tE49u4E4AXozZlkDRHb/PeW10P69WKlN38G0yHcF2DxY9wZdowhfdbjWSOa0BoRkqIBr2lI0RH+tXEhgh9b7iZMAvAiuPSdRO0LwUatumj03tnOdA9u0ML6ZYOAVsn7u+xWSNFolkVDlDl3tfyWzSYkx63bHI/KJxs6Z6MMQhZ9PHCOCEdKuW/Gdc4KyZlSpkkR5E1po+m10bsVYOFD3BlQO45+GwYiggnFEFK6Td43vJRzs/326DtDS5CGXp3wWCm9FN5hF99Fdl9IRVGF6OLCXYq+/JvUUARcDY10ZA6qcs6yS4jQo6E3M3O1mn82vASo0p0rnF2oWIZOkHUo5XIpwODIKRkfQ8VyazYCrHopAGbJpsrwD5Sz6ZUCDFR0XB5KIwCcZgFmnsc+VKz5wBYx4NxSDoBwyBelcAUqltKmwdcsMRUDUHHpphxiDSrWtU0hv5YCpCnXLoO3uHEVQEXKZ9fTLeegFMCSGtOClLjDGQzuKc6u1LwEqW3dGn3+HwBHgWq9reGUPvcXN/604R5yYsfPhr2iolZ4DM92ngUZhIcgP7/c6O/yTGASADcJs6Ff9PzGjmhh/Sqgvq+Tu0VNidj77TpH0UiV5LZtNtENEIZTLYVddvsyPpyCqUjr+Be/c7pdE2MBWGxuLBIZ5DqcTBgiphC0xl6+FRtRj5zUOctSb0EVVoRjAeRBjFHLaGCFvmoUvBLZJIN4KCT3ilx0xFA+MQCt8+1adyKAIqAkpk7H1RQFFRXVj7QtI1iuslTojIbmuG37kx5cfwGYmi/QPMKjGgAAAABJRU5ErkJggg==)
}

.action-list>.item.comment:hover .comment-icon path[data-v-012280ec] {
  fill: var(--juejin-font-brand2-hover)
}

.action-list>.item.more[data-v-012280ec] {
  min-width: 0
}

.action-list>.item.more[data-v-012280ec]:hover {
  color: var(--juejin-font-brand2-hover)
}

.action-list>.item.more.active .more-list[data-v-012280ec] {
  display: block
}

.action-list>.item.more .more-list[data-v-012280ec] {
  position: absolute;
  top: 100%;
  padding: 4px 0;
  margin-top: 4px;
  background: var(--juejin-popup);
  border: 1px solid var(--juejin-layer-3-border);
  box-shadow: 0 4px 10px rgba(0, 0, 0, .1);
  border-radius: 4px;
  display: none;
  z-index: 10
}

.action-list>.item.more .more-list .item[data-v-012280ec] {
  box-sizing: border-box;
  font-size: 14px;
  line-height: 22px;
  color: var(--juejin-font-1);
  padding: 7px 12px;
  min-width: 54px;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  white-space: nowrap
}

.action-list>.item.more .more-list .item.delete[data-v-012280ec] {
  color: var(--juejin-danger-1-normal)
}

.action-list>.item.more .more-list .item[data-v-012280ec]:hover {
  background-color: var(--juejin-layer-3-fill)
}

.title-row[data-v-012280ec] {
  display: flex;
  margin-bottom: 2px
}

.title-row .audit-tag[data-v-012280ec] {
  transform: none;
  margin-right: 8px;
  border-radius: 4px;
  padding: 3px 7px;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 22px
}

.title[data-v-012280ec] {
  font-weight: 600;
  font-size: 16px;
  line-height: 24px;
  color: var(--juejin-font-1);
  width: 100%;
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1
}

.title-collection[data-v-012280ec] {
  color: #1d2129
}

.abstract[data-v-012280ec] {
  margin-bottom: 4px;
  font-weight: 400
}

.abstract a[data-v-012280ec] {
  color: var(--juejin-font-3);
  font-size: 13px;
  line-height: 22px;
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1
}

.thumb[data-v-012280ec] {
  flex: 0 0 auto;
  width: 108px;
  height: 72px;
  margin-left: 24px;
  background-color: var(--juejin-layer-1);
  border-radius: 4px;
  border: 1px solid var(--juejin-gray-1-2)
}

body[data-theme=dark] .thumb[data-v-012280ec] {
  filter: brightness(.94)
}

.entry-footer[data-v-012280ec] {
  justify-content: space-between;
  width: 100%;
  flex-wrap: wrap
}

.entry-footer-tags[data-v-012280ec],
.entry-footer[data-v-012280ec] {
  display: flex;
  flex-direction: row;
  align-items: center
}

.footer-tag[data-v-012280ec] {
  background-color: var(--juejin-gray-2);
  padding: 0 6px;
  border-radius: 2px;
  max-width: 76px;
  box-sizing: border-box;
  margin-left: 6px;
  color: var(--juejin-font-3);
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  min-height: 18px;
  line-height: 18px
}

.footer-tag[data-v-012280ec]:hover {
  color: var(--juejin-font-brand2-hover)
}

.footer-tag.width-limited[data-v-012280ec] {
  max-width: 65px
}

.footer-tag-only[data-v-012280ec] {
  max-width: 104px
}

@media (max-width:600px) {
  .meta-container .user-message[data-v-012280ec] .user-popover {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    word-break: break-all
  }

  .meta-container .user-message[data-v-012280ec] .popover-box {
    display: block
  }

  .entry-footer-tags[data-v-012280ec],
  .meta-container .date[data-v-012280ec]:after,
  .meta-container .tag_list[data-v-012280ec] {
    display: none
  }
}

@media screen and (max-width:961px) {
  .dislike-menu[data-v-012280ec] {
    display: none !important
  }
}

.content-wrapper-special[data-v-012280ec] {
  padding-bottom: 12px;
  border-bottom: 1px solid var(--juejin-gray-1-2);
  width: 100%
}

.content-wrapper-special .content-main-special[data-v-012280ec] {
  display: flex;
  justify-content: space-between
}

.content-wrapper-special .content-main-special .abstract a[data-v-012280ec] {
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2
}

.content-wrapper-special .action-list>.item[data-v-012280ec] {
  margin-right: 12px
}

.content-wrapper-special .footer-divider[data-v-012280ec] {
  margin: 0 -7px 0 6px
}

@keyframes skeleton-keyframes-data-v-435011c0 {
  0% {
    background-position: 0 0
  }

  to {
    background-position: 480px 0
  }
}

.entry-list[data-v-435011c0] {
  width: 100%;
  background-color: var(--juejin-layer-1);
  position: relative
}

.item[data-v-435011c0] {
  transition: all .3s ease-in
}

.entry-list-enter[data-v-435011c0],
.entry-list-leave-to[data-v-435011c0] {
  opacity: 0
}

.entry-list-leave-active[data-v-435011c0] {
  position: absolute;
  left: 0;
  right: 0
}

.empty[data-v-435011c0] {
  padding: 2rem 0;
  width: 100%;
  font-size: 1.2rem;
  text-align: center
}

@keyframes skeleton-keyframes-data-v-2c0b90be {
  0% {
    background-position: 0 0
  }

  to {
    background-position: 480px 0
  }
}

.comment-login-guide[data-v-2c0b90be] {
  width: 100%;
  height: 100%;
  background-color: var(--juejin-background);
  position: absolute;
  top: 0;
  left: 0;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  color: var(--juejin-font-1);
  font-size: 14px;
  font-weight: 400;
  border-radius: 4px
}

.comment-login-guide .login-guide-button[data-v-2c0b90be] {
  margin: 0 12px;
  background: var(--juejin-brand-1-normal);
  border-radius: 4px;
  outline: none;
  border: none;
  color: #fff;
  font-size: 14px;
  text-align: center;
  line-height: 32px;
  width: 83px;
  height: 32px;
  box-sizing: border-box;
  cursor: pointer;
  padding: 0
}

.comment-login-guide .login-guide-button[data-v-2c0b90be]:active,
.comment-login-guide .login-guide-button[data-v-2c0b90be]:hover {
  background-color: var(--juejin-brand-2-hover)
}

.comment-login-guide .login-guide-button[data-v-2c0b90be]:disabled {
  background: var(--juejin-brand-4-disable);
  cursor: not-allowed
}

@keyframes skeleton-keyframes-data-v-5be8a616 {
  0% {
    background-position: 0 0
  }

  to {
    background-position: 480px 0
  }
}

.rank-entry[data-v-5be8a616] {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  border-radius: 4px;
  color: #011fae;
  background: linear-gradient(269.95deg, rgba(170, 218, 255, .46) 1.01%, rgba(170, 218, 255, .3) 102.07%);
  height: 36px
}

.rank-entry .rank-entry-icon[data-v-5be8a616] {
  width: 15px;
  height: 16px;
  -o-object-fit: contain;
  object-fit: contain
}

.rank-entry .rank-entry-title[data-v-5be8a616] {
  font-size: 14px;
  font-weight: 500;
  line-height: 16px;
  text-align: left;
  margin: 0 2px 0 4px
}

.rank-entry.dark[data-v-5be8a616] {
  color: #c7f1ff;
  background: linear-gradient(270deg, rgba(64, 163, 254, .33) 1.01%, rgba(37, 147, 227, .26) 102.07%)
}

@keyframes skeleton-keyframes-data-v-b60b2868 {
  0% {
    background-position: 0 0
  }

  to {
    background-position: 480px 0
  }
}

.jj-follow-button[data-v-b60b2868] {
  padding: 0;
  margin: 0 0 0 auto;
  font-size: 14px;
  border: 1px solid var(--juejin-brand-1-normal);
  background: var(--juejin-brand-1-normal);
  color: var(--juejin-font-white);
  border-radius: 4px;
  display: flex;
  align-items: center;
  justify-content: center;
  word-break: keep-all;
  width: 76px;
  height: 32px
}

.jj-follow-button[data-v-b60b2868]:hover {
  border-color: var(--juejin-brand-2-hover);
  background-color: var(--juejin-brand-2-hover)
}

.jj-follow-button.followed[data-v-b60b2868] {
  border: 1px solid var(--juejin-gray-1-1);
  background: var(--juejin-layer-1);
  color: var(--juejin-font-3)
}

.jj-follow-button.followed[data-v-b60b2868]:hover {
  opacity: .8
}

@keyframes skeleton-keyframes-data-v-65e9deb8 {
  0% {
    background-position: 0 0
  }

  to {
    background-position: 480px 0
  }
}

.recommended-links[data-v-65e9deb8] {
  margin-top: 1.5rem
}

.recommended-links p[data-v-65e9deb8] {
  margin: 0;
  color: var(--juejin-font-3)
}

.recommended-links p[data-v-65e9deb8],
.recommended-links ul[data-v-65e9deb8] {
  background-color: transparent
}

.recommended-links ul[data-v-65e9deb8] {
  margin-top: 12px;
  display: flex;
  flex-wrap: wrap
}

.recommended-links ul li[data-v-65e9deb8] {
  margin-bottom: 4px
}

.recommended-links ul li a[data-v-65e9deb8]:not(:hover) {
  color: var(--juejin-font-3)
}

.recommended-links ul li[data-v-65e9deb8]:not(:last-child) {
  margin-right: 10px
}

@media (max-width:1000px) {
  .recommended-links[data-v-65e9deb8] {
    padding: 0 16px
  }
}

.banner[data-v-f3038604] {
  position: relative;
  font-size: 0;
  cursor: pointer
}

.banner .banner-image[data-v-f3038604] {
  width: 100%;
  height: 100%
}

.banner .ctrl-box .close-btn[data-v-f3038604] {
  position: absolute;
  top: .5rem;
  right: .5rem;
  font-size: 1rem;
  color: #909090;
  opacity: .5;
  display: none
}

.banner .ctrl-box .close-btn[data-v-f3038604]:hover {
  opacity: 1
}

.banner .ctrl-box .label[data-v-f3038604] {
  position: absolute;
  right: 10px;
  bottom: 10px;
  line-height: 36px;
  height: 36px;
  font-size: 20px;
  z-index: 1;
  transform: scale(.5);
  -webkit-transform: scale(.5);
  transform-origin: right bottom;
  -webkit-transform-origin: right bottom;
  color: #fff;
  background-color: rgba(0, 0, 0, .2);
  border: 1px solid #fff;
  border-radius: 6px;
  padding-left: 15px;
  padding-right: 15px;
  font-weight: 300
}

.banner .ctrl-box .label[data-v-f3038604]:hover {
  background-color: rgba(0, 0, 0, .4)
}

.banner .ctrl-box .label:hover .inco[data-v-f3038604] {
  display: inline-block
}

.banner .ctrl-box .label span[data-v-f3038604] {
  vertical-align: top
}

.banner .ctrl-box .label .inco[data-v-f3038604] {
  display: none
}

.banner:hover .ctrl-box .close-btn[data-v-f3038604] {
  display: block
}

@keyframes skeleton-keyframes-data-v-0eca8145 {
  0% {
    background-position: 0 0
  }

  to {
    background-position: 480px 0
  }
}

.emoji.old[data-v-0eca8145] {
  transform: scale(.9)
}

@media (max-width:600px) {
  .web-only[data-v-0eca8145] {
    display: none
  }
}

.sidebar-block[data-v-0eca8145] {
  background-color: var(--juejin-layer-1);
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, .05);
  border-radius: 2px;
  margin-bottom: 1.66rem;
  font-size: 1.16rem;
  line-height: 1.29;
  border-radius: 4px;
  color: var(--juejin-font-1)
}

.sidebar-block li[data-v-0eca8145] {
  list-style: none
}

.sidebar-block.banner-block[data-v-0eca8145] {
  overflow: hidden
}

.sidebar-block.banner-block .banner[data-v-0eca8145] {
  width: 100%;
  height: 96px;
  -o-object-fit: cover;
  object-fit: cover
}

@media (max-width:1000px) {
  .sidebar-block[data-v-0eca8145] {
    margin-top: 8px;
    margin-bottom: 8px
  }
}

@keyframes skeleton-keyframes-data-v-7e7e812a {
  0% {
    background-position: 0 0
  }

  to {
    background-position: 480px 0
  }
}

.sidebar-block[data-v-7e7e812a] {
  position: relative;
  margin-bottom: 1.5rem;
  border-radius: 2px
}

.sidebar-block[data-v-7e7e812a]:after {
  display: table;
  content: "";
  clear: both
}

.sidebar-block[data-v-7e7e812a]:not(.pure) {
  background-color: var(--juejin-layer-1)
}

.sidebar-block:not(.pure) .block-title[data-v-7e7e812a] {
  padding: 1rem 0;
  font-size: 1.33rem;
  color: var(--juejin-font-1);
  border-bottom: 1px solid var(--juejin-gray-1-1)
}

@keyframes skeleton-keyframes-data-v-312de995 {
  0% {
    background-position: 0 0
  }

  to {
    background-position: 480px 0
  }
}

.sidebar-block[data-v-312de995] {
  box-shadow: none;
  border-radius: 4px
}

.sidebar-block[data-v-312de995]:not(.pure) .block-title {
  padding: 16px 0;
  margin: 0 20px;
  font-size: 16px;
  color: var(--juejin-font-1);
  font-weight: 500
}

.entry-list[data-v-312de995] {
  padding-bottom: 20px
}

.entry-list .item[data-v-312de995] {
  display: block;
  padding: 12px 20px 0
}

.entry-list .item:hover .entry-title[data-v-312de995] {
  color: var(--juejin-font-brand1-normal)
}

.entry-list .item[data-v-312de995]:first-child {
  padding-top: 16px
}

.entry-title[data-v-312de995] {
  line-height: 22px;
  font-size: 14px;
  font-weight: 400;
  color: var(--juejin-font-1);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis
}

.entry-meta-box[data-v-312de995] {
  margin-top: 4px;
  display: flex
}

.entry-meta-box .entry-meta[data-v-312de995] {
  font-size: 14px;
  display: flex;
  font-size: 1.167rem;
  line-height: 22px;
  color: var(--juejin-font-3);
  font-weight: 400
}

.entry-meta-box .entry-meta.author .author-name[data-v-312de995] {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 120px
}

@keyframes skeleton-keyframes-data-v-05741537 {
  0% {
    background-position: 0 0
  }

  to {
    background-position: 480px 0
  }
}

.wechat-sidebar-block:hover .close-btn[data-v-05741537] {
  display: block
}

.close-btn[data-v-05741537] {
  display: none;
  position: absolute;
  top: 8px;
  right: 8px;
  color: var(--juejin-font-3);
  cursor: pointer;
  z-index: 1
}

.close-btn[data-v-05741537] .byte-icon svg {
  fill: var(--juejin-mask-1)
}

.ad-container[data-v-05741537] {
  display: flex;
  background: var(--juejin-layer-1);
  align-items: center;
  justify-content: center
}

.ad-container .text-container[data-v-05741537] {
  padding: 20px 18px 20px 0
}

.ad-container .text-container .text-description[data-v-05741537] {
  color: var(--juejin-font-1);
  font-weight: 500;
  font-size: 18px
}

.ad-container .text-container .text-reply[data-v-05741537] {
  color: var(--juejin-font-2);
  margin-top: 4px;
  font-size: 14px
}

.ad-container .qr-code[data-v-05741537] {
  width: 56px;
  height: 56px
}

@keyframes skeleton-keyframes-data-v-3d01e58e {
  0% {
    background-position: 0 0
  }

  to {
    background-position: 480px 0
  }
}

.suggest-item[data-v-3d01e58e],
.suggest-item [data-v-3d01e58e] {
  box-sizing: border-box
}

.suggest-item .suggest-item-title[data-v-3d01e58e] {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  color: var(--juejin-font-1);
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 22px;
  margin-bottom: 12px;
  transition: all .2s;
  cursor: pointer
}

.suggest-item .suggest-item-title[data-v-3d01e58e]:hover {
  color: var(--juejin-font-brand1-normal)
}

.suggest-item .suggest-item-title[data-v-3d01e58e] div {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis
}

.suggest-item .suggest-item-title a[data-v-3d01e58e] {
  color: inherit;
  font-size: inherit;
  font-style: inherit;
  font-weight: inherit;
  line-height: inherit
}

.suggest-item .suggest-item-title[data-v-3d01e58e] em {
  color: var(--juejin-danger-1-normal);
  font-size: inherit;
  font-style: inherit;
  font-weight: inherit;
  line-height: inherit
}

@keyframes skeleton-keyframes-data-v-2bcb2207 {
  0% {
    background-position: 0 0
  }

  to {
    background-position: 480px 0
  }
}

.jj-search-suggest[data-v-2bcb2207] {
  border-radius: 4px;
  background: var(--juejin-layer-1);
  padding: 0 20px 8px;
  margin-bottom: 20px;
  min-height: 419px
}

.jj-search-suggest[data-v-2bcb2207],
.jj-search-suggest [data-v-2bcb2207] {
  box-sizing: border-box
}

.jj-search-suggest .suggest-header[data-v-2bcb2207] {
  padding: 14px 0;
  display: flex;
  align-items: center
}

.jj-search-suggest .suggest-header .title[data-v-2bcb2207] {
  color: var(--juejin-font-1);
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 24px
}

.jj-search-suggest .suggest-header .search-input[data-v-2bcb2207] {
  position: relative
}

.jj-search-suggest .suggest-header .search-input input[data-v-2bcb2207] {
  font-size: 13px;
  font-style: normal;
  font-weight: 400;
  line-height: 20px;
  color: var(--juejin-font-1);
  resize: none;
  outline: none;
  width: 100%;
  display: block;
  border: 1px solid var(--juejin-gray-1-1);
  transition: border .3s;
  background-color: var(--juejin-layer-1);
  caret-color: var(--juejin-brand-1-normal);
  border-radius: 4px;
  box-shadow: none;
  padding: 4px 24px 4px 8px;
  width: 140px;
  height: 28px
}

.jj-search-suggest .suggest-header .search-input input[data-v-2bcb2207]:focus {
  border-color: var(--juejin-brand-1-normal)
}

.jj-search-suggest .suggest-header .search-input input[data-v-2bcb2207]::-moz-placeholder {
  color: var(--juejin-font-3);
  font-size: 13px;
  font-style: normal;
  font-weight: 400;
  line-height: 20px
}

.jj-search-suggest .suggest-header .search-input input[data-v-2bcb2207]::placeholder {
  color: var(--juejin-font-3);
  font-size: 13px;
  font-style: normal;
  font-weight: 400;
  line-height: 20px
}

.jj-search-suggest .suggest-header .search-input .icon[data-v-2bcb2207] {
  width: 16px;
  height: 16px;
  font-size: 14px;
  color: var(--juejin-font-3);
  position: absolute;
  right: 8px;
  top: 6px
}

.jj-search-suggest .suggest-content[data-v-2bcb2207] {
  border-top: 1px solid var(--juejin-gray-1-1);
  padding-top: 14px
}

.jj-search-suggest .loading-skeleton[data-v-2bcb2207] .xitu-skeleton-content {
  padding: 0
}

@keyframes skeleton-keyframes-data-v-6d89a1e6 {
  0% {
    background-position: 0 0
  }

  to {
    background-position: 480px 0
  }
}

.animation-follow-btn[data-v-6d89a1e6] {
  box-sizing: border-box;
  position: relative;
  border: 1px solid var(--juejin-brand-1-normal);
  background: var(--juejin-brand-1-normal);
  color: var(--juejin-font-white);
  overflow: hidden;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 22px;
  white-space: nowrap;
  cursor: pointer;
  border-radius: 4px;
  flex-shrink: 0;
  transition: width .4s, background .2s, border .2s;
  transition-timing-function: cubic-bezier(.2, 1, .3, 1)
}

.animation-follow-btn [data-v-6d89a1e6] {
  box-sizing: border-box
}

.animation-follow-btn[data-v-6d89a1e6]:hover {
  border-color: var(--juejin-brand-2-hover);
  background-color: var(--juejin-brand-2-hover)
}

.animation-follow-btn .follow-ctx[data-v-6d89a1e6] {
  position: absolute;
  height: 100%;
  left: 0;
  opacity: 0;
  transform: translate3d(0, -25%, 0);
  transition: transform .4s, opacity .4s;
  transition-timing-function: cubic-bezier(.2, 1, .3, 1);
  display: flex;
  align-items: center;
  justify-content: center
}

.animation-follow-btn .follow-ctx.show[data-v-6d89a1e6] {
  opacity: 1;
  transform: translateZ(0)
}

.animation-follow-btn.followed[data-v-6d89a1e6] {
  border: 1px solid var(--juejin-gray-1-1);
  background: var(--juejin-layer-1);
  color: var(--juejin-font-3)
}

.animation-follow-btn.followed[data-v-6d89a1e6]:hover {
  opacity: .8
}

.animation-follow-btn.no-animation .follow-ctx[data-v-6d89a1e6],
.animation-follow-btn.no-animation[data-v-6d89a1e6] {
  transition: none
}

.emoji.old[data-v-1902877e] {
  transform: scale(.9)
}

@media (max-width:600px) {
  .web-only[data-v-1902877e] {
    display: none
  }
}

.operate-btn[data-v-1902877e] {
  display: flex;
  align-items: center
}

.operate-btn .im-btn[data-v-1902877e] {
  margin-left: 16px;
  flex: 1;
  width: 122px
}

@keyframes skeleton-keyframes-data-v-1902877e {
  0% {
    background-position: 0 0
  }

  to {
    background-position: 480px 0
  }
}

.author-block[data-v-1902877e] {
  border-radius: 4px;
  background: var(--juejin-layer-1);
  padding: 20px
}

.item[data-v-1902877e] {
  display: flex;
  align-items: center
}

.user-item[data-v-1902877e] {
  padding-bottom: 8px
}

.user-item .avatar[data-v-1902877e] {
  flex: 0 0 auto;
  width: 4rem;
  height: 4rem;
  border-radius: 50%
}

.user-item .info-box[data-v-1902877e] {
  flex: 1 1 auto;
  min-width: 0;
  margin-left: 12px
}

.user-item .info-box .username[data-v-1902877e] {
  font-size: 16px;
  font-weight: 500;
  line-height: 2rem;
  color: var(--juejin-font-1);
  white-space: pre-wrap;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis
}

.user-item .info-box .username[data-v-1902877e],
.user-item .info-box .username[data-v-1902877e] .rank {
  display: flex;
  align-items: center
}

.user-item .info-box .position[data-v-1902877e] {
  font-size: 14px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  color: var(--juejin-font-3);
  font-weight: 400;
  line-height: 22px
}

.stat-item .annual-icon[data-v-1902877e] {
  width: 2.08rem
}

.stat-item .icon[data-v-1902877e] {
  flex: 0 0 auto
}

.stat-item .icon[data-v-1902877e],
.stat-item .zan[data-v-1902877e] {
  margin-right: 1rem
}

.stat-item .content[data-v-1902877e] {
  font-size: 1.167rem;
  color: var(--juejin-font-1);
  font-weight: 400
}

.banner[data-v-1902877e] {
  display: block;
  height: 48px;
  background-image: url(https://p1-jj.byteimg.com/tos-cn-i-t2oaga2asx/gold-assets/asset/2018/post-banner.png~tplv-t2oaga2asx-zoom-1.image);
  background-size: cover;
  background-position: 50%;
  background-repeat: no-repeat
}

.extra-container[data-v-1902877e] {
  display: flex;
  margin-top: 4px;
  justify-content: flex-start;
  transform: scale(.9) translateX(-1rem)
}

.extra-container .rank[data-v-1902877e] {
  display: flex;
  padding: 0 4px;
  background-color: var(--juejin-brand-5-light);
  justify-content: center;
  align-items: center;
  color: rgba(30, 128, 255, .8);
  border-radius: 4px;
  font-size: 12px;
  white-space: nowrap;
  margin-right: 8px
}

.extra-container .rank .rank-number[data-v-1902877e] {
  margin-left: 4px;
  margin-right: 2px
}

.extra-container .achievements .name[data-v-1902877e] {
  white-space: nowrap;
  color: rgba(30, 128, 255, .8);
  padding: 0 2px;
  font-size: 12px;
  border-radius: 4px;
  background: var(--juejin-brand-5-light);
  margin-right: 8px
}

.extra-container .achievements[data-v-1902877e]:last-child {
  margin-right: 0
}

.count-container[data-v-1902877e] {
  display: flex;
  align-items: center;
  justify-content: space-around
}

.count-container .stat-item.item[data-v-1902877e] {
  flex-direction: column;
  margin-bottom: 8px;
  color: var(--juejin-font-3);
  font-size: 13px;
  font-weight: 400;
  line-height: 22px
}

.count-container .stat-item.item .count[data-v-1902877e] {
  color: var(--juejin-font-1);
  font-size: 16px;
  font-weight: 500;
  line-height: 24px
}

.count-container .stat-item.item[data-v-1902877e]:hover {
  cursor: pointer;
  color: var(--juejin-brand-1-normal)
}

.count-container .stat-item.item:hover .count[data-v-1902877e] {
  color: var(--juejin-brand-1-normal)
}

.hidden[data-v-1902877e] {
  visibility: hidden
}

@keyframes skeleton-keyframes-data-v-6239701c {
  0% {
    background-position: 0 0
  }

  to {
    background-position: 480px 0
  }
}

.article-catalog[data-v-6239701c] {
  background: var(--juejin-layer-1);
  border-radius: 4px;
  padding: 0;
  display: flex;
  flex-direction: column
}

.catalog-title[data-v-6239701c] {
  font-weight: 500;
  margin: 0 1.667rem;
  font-size: 16px;
  line-height: 2rem;
  color: var(--juejin-font-1);
  border-bottom: 1px solid var(--juejin-gray-1-1);
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 56px
}

.catalog-title.collapse[data-v-6239701c] {
  border-bottom: none
}

.catalog-title .direction[data-v-6239701c] {
  color: var(--juejin-font-3);
  display: flex;
  font-size: 13px;
  font-weight: 400;
  align-items: center;
  cursor: pointer
}

.catalog-title .direction .word[data-v-6239701c] {
  padding: 8px 4px 8px 8px
}

.catalog-title .direction .icon-rotate[data-v-6239701c] {
  transform: rotate(180deg)
}

@keyframes catalogBodyHeight-data-v-6239701c {
  0% {
    height: 0
  }

  to {
    height: 100%
  }
}

.catalog-body[data-v-6239701c] {
  position: relative;
  margin: 0;
  overflow: auto;
  max-height: 0;
  animation-name: catalogBodyHeight-data-v-6239701c;
  transition: max-height .5s
}

.catalog-body.unfold[data-v-6239701c] {
  margin: 12px 4px 0 0;
  max-height: 312px
}

.catalog-body[data-v-6239701c]::-webkit-scrollbar {
  width: 4px;
  height: 80px
}

.catalog-body[data-v-6239701c]::-webkit-scrollbar-track {
  box-shadow: none;
  border-radius: 2px
}

.catalog-body[data-v-6239701c]::-webkit-scrollbar-thumb {
  background-color: var(--juejin-gray-1-1);
  outline: none;
  border-radius: 50px
}

.catalog-list[data-v-6239701c] {
  position: relative;
  padding: 0 0 12px
}

.catalog-list[data-v-6239701c] .catalog-aTag {
  color: inherit;
  display: inline-block;
  padding: 0 8px 8px;
  width: 90%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis
}

.catalog-list[data-v-6239701c] .catalog-aTag.d1-aTag-title {
  padding-top: 4px;
  line-height: 22px
}

.catalog-list[data-v-6239701c] .a-container:hover {
  cursor: pointer
}

.catalog-list[data-v-6239701c] .a-container:hover .catalog-aTag {
  color: var(--juejin-font-brand1-normal)
}

.catalog-list[data-v-6239701c] .sub-list {
  margin: 0;
  padding: 0
}

.catalog-list[data-v-6239701c] .item {
  margin: 0;
  padding: 0;
  font-size: 14px;
  font-weight: 400;
  color: var(--juejin-font-1);
  list-style: none
}

.catalog-list[data-v-6239701c] .item .a-container {
  display: block;
  position: relative;
  padding: 0 0 0 12px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis
}

.catalog-list[data-v-6239701c] .item.d1 {
  font-weight: 400;
  color: var(--juejin-font-1)
}

.catalog-list[data-v-6239701c] .item.d1 .a-container {
  margin: 0;
  padding: 0 0 0 11px
}

.catalog-list[data-v-6239701c] .item.d1 .a-container:before {
  left: 5px;
  margin-top: -3px;
  width: 6px;
  height: 6px
}

.catalog-list[data-v-6239701c] .item.d1 .a-container .d1-aTag-title {
  font-size: 14px
}

.catalog-list[data-v-6239701c] .item.d1:first-child .a-container {
  margin-top: 0
}

.catalog-list[data-v-6239701c] .item.d2 {
  color: var(--juejin-font-2)
}

.catalog-list[data-v-6239701c] .item.d2 .a-container {
  padding-left: 26px
}

.catalog-list[data-v-6239701c] .item.d2 .a-container:before {
  left: 24px
}

.catalog-list[data-v-6239701c] .item.d3 {
  color: var(--juejin-font-3)
}

.catalog-list[data-v-6239701c] .item.d3 .a-container {
  padding-left: 41px
}

.catalog-list[data-v-6239701c] .item.d3 .a-container:before {
  left: 39px
}

.catalog-list[data-v-6239701c] .item.active>.a-container {
  color: var(--juejin-font-brand1-normal)
}

.catalog-list[data-v-6239701c] .item.active>.a-container:before {
  content: "";
  position: absolute;
  top: -4px;
  left: 0;
  margin-top: 7px;
  width: 3px;
  height: 14px;
  background: var(--juejin-brand-1-normal);
  border-radius: 2px
}

.catalog-list[data-v-6239701c] .item.d1.active>.a-container:before {
  top: 2px
}

.catalog-block[data-v-16ed86c3] {
  margin-bottom: 20px;
  border-radius: 4px
}

@keyframes skeleton-keyframes-data-v-01fd4ebd {
  0% {
    background-position: 0 0
  }

  to {
    background-position: 480px 0
  }
}

.sidebar[data-v-01fd4ebd] {
  height: -moz-fit-content;
  height: fit-content
}

.sidebar .app-download-sidebar-block[data-v-01fd4ebd] {
  box-shadow: none;
  border-radius: 4px
}

.sidebar .app-download-sidebar-block[data-v-01fd4ebd] .app-link {
  padding: 20px
}

.sidebar .app-download-sidebar-block[data-v-01fd4ebd] .headline {
  font-size: 1.333rem;
  line-height: 2rem;
  color: #252933
}

.sidebar .app-download-sidebar-block[data-v-01fd4ebd] .desc {
  font-size: 1.167rem;
  line-height: 22px;
  margin-top: 4px;
  color: #8a919f
}

.sidebar .wechat-sidebar-block[data-v-01fd4ebd] {
  border-radius: 4px;
  overflow: hidden
}

.sidebar .sticky-block-box[data-v-01fd4ebd] {
  position: sticky;
  top: 6.767rem;
  width: inherit;
  transition: top .2s;
  display: flex;
  flex-direction: column;
  
}

@media screen and (max-height:390px) {
  .sidebar .sticky-block-box[data-v-01fd4ebd] {
    overflow: scroll
  }
}

.sidebar.top .sticky-block-box[data-v-01fd4ebd] {
  top: 1.767rem
}

.sidebar .sidebar-bd-entry li[data-v-01fd4ebd] {
  position: relative
}

.sidebar .sidebar-bd-entry li:hover .close-btn[data-v-01fd4ebd] {
  display: block
}

.sidebar .sidebar-bd-entry li .close-btn[data-v-01fd4ebd] {
  display: none;
  position: absolute;
  top: 8px;
  right: 8px;
  color: var(--juejin-font-3);
  cursor: pointer;
  z-index: 1;
  opacity: .5
}

.sidebar .sidebar-bd-entry li .close-btn[data-v-01fd4ebd] .byte-icon svg {
  fill: var(--juejin-shade-1)
}

.sidebar .sidebar-bd-entry li .hidden[data-v-01fd4ebd] {
  display: none
}

.sidebar .source-vip[data-v-01fd4ebd] {
  position: relative
}

.sidebar .source-vip[data-v-01fd4ebd]:hover {
  color: var(--juejin-font-white)
}

.sidebar .sidebar-bd-entry>li[data-v-01fd4ebd]:after,
.sidebar .source-vip[data-v-01fd4ebd]:after {
  content: "广告";
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  background: var(--juejin-shade-1);
  border: .5px solid hsla(0, 0%, 100%, .6);
  width: 32px;
  height: 16px;
  right: 8px;
  top: 51px;
  border-radius: 2px;
  color: var(--juejin-font-white);
  font-size: 10px
}

.sidebar .hidden[data-v-01fd4ebd] {
  visibility: hidden
}

.sidebar .none[data-v-01fd4ebd] {
  display: none
}

@media (max-width:1000px) {

  .sidebar .author-block-container[data-v-01fd4ebd],
  .sidebar .wechat-ad[data-v-01fd4ebd] {
    display: none
  }

  .sidebar .sticky-block-box[data-v-01fd4ebd] {
    position: relative
  }

  .sidebar .sidebar-block[data-v-01fd4ebd] {
    margin-top: 8px;
    margin-bottom: 8px
  }
}

.sidebar .height-adapt[data-v-01fd4ebd] .block-body .entry-list {
  height: calc(100vh - 500px);
  overflow: auto;
  max-height: 325px;
  box-sizing: border-box
}

.sidebar .height-adapt[data-v-01fd4ebd] .block-body .entry-list::-webkit-scrollbar {
  width: 4px;
  height: 80px
}

.sidebar .height-adapt[data-v-01fd4ebd] .block-body .entry-list::-webkit-scrollbar-track {
  box-shadow: none;
  border-radius: 2px
}

.sidebar .height-adapt[data-v-01fd4ebd] .block-body .entry-list::-webkit-scrollbar-thumb {
  background-color: var(--juejin-gray-1-1);
  outline: none;
  border-radius: 50px
}

@keyframes skeleton-keyframes-data-v-d326b38e {
  0% {
    background-position: 0 0
  }

  to {
    background-position: 480px 0
  }
}

.emoji.old[data-v-d326b38e] {
  transform: scale(.9)
}

@media (max-width:600px) {
  .web-only[data-v-d326b38e] {
    display: none
  }
}

.container[data-v-d326b38e] {
  justify-content: space-between
}

.container[data-v-d326b38e],
.left[data-v-d326b38e] {
  display: flex;
  align-items: center
}

.left[data-v-d326b38e] {
  width: calc(100% - 112px)
}

.icon[data-v-d326b38e] {
  width: 52px;
  height: 52px;
  margin-right: 12px;
  border-radius: 2px
}

@media (max-width:600px) {
  .icon[data-v-d326b38e] {
    width: 38px;
    height: 38px
  }
}

.title-line[data-v-d326b38e] {
  margin: 0;
  display: flex;
  align-items: center;
  overflow: hidden;
  text-overflow: ellipsis;
  height: 2rem
}

.content[data-v-d326b38e] {
  width: calc(100% - 52px)
}

@media (max-width:600px) {
  .content[data-v-d326b38e] {
    width: calc(100% - 38px)
  }
}

.title[data-v-d326b38e] {
  font-weight: 600;
  font-size: 16px;
  line-height: 22px;
  color: var(--juejin-font-2);
  flex-shrink: 1;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  word-break: break-all
}

@media (max-width:600px) {
  .title[data-v-d326b38e] {
    font-weight: 400;
    line-height: 16px;
    color: #2e3135
  }
}

.team-icon[data-v-d326b38e] {
  flex: none;
  width: 18px;
  height: 18px;
  margin-left: 4px
}

.min-title[data-v-d326b38e] {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  font-size: 18px;
  line-height: 25px;
  color: #2e3135
}

.vote[data-v-d326b38e] {
  display: block;
  width: 80px;
  height: 20px;
  margin-left: 1rem;
  border-radius: 1rem
}

.vote[data-v-d326b38e]:hover {
  opacity: .8
}

@media (max-width:600px) {
  .follow-btn[data-v-d326b38e] {
    top: 20px;
    position: relative
  }
}

@keyframes skeleton-keyframes {
  0% {
    background-position: 0 0
  }

  to {
    background-position: 480px 0
  }
}

.emoji.old {
  transform: scale(.9)
}

@media (max-width:600px) {
  .web-only {
    display: none
  }
}

.context-menu {
  position: absolute;
  display: inline-flex;
  z-index: 100000;
  padding: 4px 6px;
  justify-content: center;
  align-items: center;
  grid-column-gap: 4px;
  -moz-column-gap: 4px;
  column-gap: 4px;
  border-radius: 4px;
  grid-gap: 12px;
  gap: 12px;
  background: var(--juejin-mask-2);
  box-shadow: 0 4px 12px -2px rgba(81, 87, 103, .16);
  font-size: 14px
}

.context-menu .ai-btn {
  display: flex;
  align-items: center;
  grid-gap: 4px;
  gap: 4px;
  cursor: pointer;
  color: var(--juejin-ai-text);
  text-align: right;
  font-style: normal;
  font-weight: 500;
  line-height: 20px;
  letter-spacing: .042px
}

.context-menu .ai-close-btn {
  cursor: pointer;
  padding: 4px;
  border-radius: 4px;
  transition: all .2s
}

.context-menu .ai-close-btn path {
  fill: var(--juejin-font-2)
}

.context-menu .ai-close-btn:hover {
  background-color: var(--juejin-gray-3)
}

body[data-theme=dark] .ai-close-btn.byte-icon.byte-icon--close svg.icon path {
  fill: hsla(0, 0%, 100%, .7) !important
}

body[data-theme=dark].ai-close-btn {
  cursor: pointer;
  padding: 4px;
  border-radius: 4px;
  transition: all .2s
}

body[data-theme=dark].ai-close-btn i.ai-close-btn.byte-icon.byte-icon-close svg path,
body[data-theme=dark].ai-close-btn path {
  fill: hsla(0, 0%, 100%, .7) !important
}

body[data-theme=dark].ai-close-btn:hover {
  background-color: var(--juejin-gray-3)
}

@media screen and (max-width:1320px) and (min-width:1140px) {
  .view-container {
    width: 1320px
  }
}

@media screen and (max-width:1140px) and (min-width:600px) {
  .container.main-container {
    margin: 0 0 0 auto;
    width: calc(100% - 7rem)
  }
}

.comment-drawer .byte-drawer__content::-webkit-scrollbar {
  width: 4px;
  height: 4px;
  background-color: var(--juejin-layer-1)
}

.comment-drawer .byte-drawer__content::-webkit-scrollbar-track {
  box-shadow: none;
  border-radius: 2px
}

.comment-drawer .byte-drawer__content::-webkit-scrollbar-thumb {
  background-color: var(--juejin-gray-1-1);
  outline: none;
  border-radius: 50px
}

@keyframes skeleton-keyframes-data-v-61fb5e44 {
  0% {
    background-position: 0 0
  }

  to {
    background-position: 480px 0
  }
}

.view-container.immerse .author-info-block .follow-button[data-v-61fb5e44] {
  display: none
}

.view-container.immerse .author-info-block .author-info-box[data-v-61fb5e44] {
  height: 2rem
}

.view-container.immerse .action-bar[data-v-61fb5e44],
.view-container.immerse .app-open-drawer[data-v-61fb5e44],
.view-container.immerse .column-container[data-v-61fb5e44],
.view-container.immerse .comment-box-common[data-v-61fb5e44],
.view-container.immerse .comment-list-box[data-v-61fb5e44],
.view-container.immerse .extension-banner[data-v-61fb5e44],
.view-container.immerse .recommended-area[data-v-61fb5e44],
.view-container.immerse .team-follow .meta-box[data-v-61fb5e44],
.view-container.immerse .wechat-banner[data-v-61fb5e44] {
  display: none
}

.column-view[data-v-61fb5e44] {
  padding: 0 0 8rem
}

.column-view .app-open-button[data-v-61fb5e44] {
  position: absolute;
  bottom: 64px;
  left: 50%;
  transform: translate(-50%)
}

.rank-entry-bottom[data-v-61fb5e44] {
  text-align: center;
  margin-bottom: 36px
}

.rank-entry-bottom .rank-entry-link[data-v-61fb5e44] {
  cursor: pointer
}

.rank-entry-bottom .rank-entry-link img[data-v-61fb5e44] {
  width: 265px;
  height: 80px
}

@media (max-width:600px) {
  .rank-entry-bottom .rank-entry-link img[data-v-61fb5e44] {
    width: 212px;
    height: 64px
  }
}

.main-area[data-v-61fb5e44] {
  position: relative;
  width: 820px;
  max-width: 100%;
  box-sizing: border-box
}

.main-area[data-v-61fb5e44]:after {
  display: table;
  content: "";
  clear: both
}

.main-area>[data-v-61fb5e44] {
  border-radius: 4px;
  background-color: var(--juejin-layer-1);
  padding-left: 2.67rem;
  padding-right: 2.67rem;
  box-sizing: border-box
}

.main-area.article-update-banner[data-v-61fb5e44] .byte-alert__title {
  display: flex;
  justify-content: space-between;
  font-weight: 400
}

.main-area.article-update-banner[data-v-61fb5e44] .byte-alert__title button {
  padding: 0;
  background: none;
  color: var(--juejin-font-brand1-normal)
}

.main-area.article-update-banner[data-v-61fb5e44] .byte-alert__title button:hover {
  color: var(--juejin-font-brand2-hover)
}

.main-area.article-update-banner[data-v-61fb5e44] .byte-alert__title button:active {
  color: var(--juejin-font-brand3-click)
}

.main-area.article-update-banner[data-v-61fb5e44] .byte-alert__close {
  top: 17px
}

.main-area .article[data-v-61fb5e44] {
  border-radius: 4px 4px 0 0
}

.main-area .browser-height[data-v-61fb5e44] {
  min-height: "670px"
}

.main-area .article-vote[data-v-61fb5e44] {
  display: flex;
  padding: 15px 0;
  justify-content: center
}

.main-area .article-vote .article-vote-icon[data-v-61fb5e44] {
  display: inline-block;
  background-image: url(//lf-web-assets.juejin.cn/obj/juejin-web/xitu_juejin_web/img/article-vote.a7d4e8e.gif);
  background-size: contain;
  background-repeat: no-repeat;
  width: 245px;
  height: 44px
}

.main-area .first-column[data-v-61fb5e44] {
  display: flex
}

.main-area .first-column .word[data-v-61fb5e44] {
  display: flex;
  color: var(--juejin-font-3);
  align-items: center
}

.main-area .first-column .gap[data-v-61fb5e44] {
  color: var(--juejin-font-3);
  width: 20px
}

.main-area .first-column .title[data-v-61fb5e44] {
  color: var(--juejin-font-3);
  max-width: 200px;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: 1.167rem !important;
  font-weight: 400 !important
}

.main-area .first-column .title[data-v-61fb5e44]:hover {
  cursor: pointer;
  color: var(--juejin-font-brand1-normal)
}

@media (max-width:1000px) {
  .main-area .first-column[data-v-61fb5e44] {
    display: none
  }
}

@media (max-width:600px) {
  .main-area .article-vote[data-v-61fb5e44] {
    padding: 0
  }
}

.main-area .article-end[data-v-61fb5e44] {
  padding-top: 10px;
  border-radius: 0 0 4px 4px;
  padding-bottom: 40px
}

.main-area.recommended-area .recommended-list-title-wrapper .title[data-v-61fb5e44] {
  border-bottom: 1px solid var(--juejin-gray-1-1);
  box-sizing: border-box;
  width: 100%
}

.main-area.recommended-area .recommended-list-title-wrapper .title .title-content[data-v-61fb5e44] {
  display: inline-block;
  font-size: 18px;
  font-weight: 600;
  color: var(--juejin-font-1);
  line-height: 30px;
  padding: 20px 0 16px
}

@media (max-width:600px) {
  .main-area.recommended-area .recommended-list-title-wrapper .title .title-content[data-v-61fb5e44] {
    font-size: 16px
  }
}

.main-area.recommended-area .entry-list[data-v-61fb5e44] li:last-child .entry .content-wrapper:before {
  background: transparent
}

.main-area.recommended-area .entry-list[data-v-61fb5e44] {
  padding: 0 0 1rem
}

.main-area.recommended-area .entry-list[data-v-61fb5e44] .entry {
  padding: 1rem 2.67rem 0
}

.main-area.recommended-area .entry-list[data-v-61fb5e44] .entry .meta-container .popover-box.user-popover {
  font-size: 13px;
  line-height: 22px;
  color: var(--juejin-font-3)
}

.main-area.recommended-area .entry-list[data-v-61fb5e44] .entry .meta-container .date,
.main-area.recommended-area .entry-list[data-v-61fb5e44] .entry .meta-container .tag {
  font-size: 13px;
  color: var(--juejin-font-3)
}

.main-area.recommended-area .entry-list[data-v-61fb5e44] .entry .meta-container .date:after,
.main-area.recommended-area .entry-list[data-v-61fb5e44] .entry .meta-container .date:before,
.main-area.recommended-area .entry-list[data-v-61fb5e44] .entry .meta-container .tag:after {
  background: var(--juejin-gray-1-1)
}

.main-area.recommended-area .entry-list[data-v-61fb5e44] .entry .meta-container .date:after,
.main-area.recommended-area .entry-list[data-v-61fb5e44] .entry .meta-container .date:before {
  height: 12px
}

.main-area.recommended-area .entry-list[data-v-61fb5e44] .entry .content-wrapper {
  margin-top: 2px;
  border: none
}

.main-area.recommended-area .entry-list[data-v-61fb5e44] .entry .content-wrapper:before {
  content: "";
  position: absolute;
  left: 2.67rem;
  right: 2.67rem;
  bottom: 0;
  height: 1px;
  background: var(--juejin-gray-1-1)
}

@media (-webkit-min-device-pixel-ratio:2),
screen and (min-device-pixel-ratio:2) {
  .main-area.recommended-area .entry-list[data-v-61fb5e44] .entry .content-wrapper:before {
    transform: scaleY(.5)
  }
}

@media (-webkit-min-device-pixel-ratio:3),
screen and (min-device-pixel-ratio:3) {
  .main-area.recommended-area .entry-list[data-v-61fb5e44] .entry .content-wrapper:before {
    transform: scaleY(.33)
  }
}

.main-area.recommended-area .entry-list[data-v-61fb5e44] .entry .content-wrapper .title-row {
  margin-bottom: 2px
}

.main-area.recommended-area .entry-list[data-v-61fb5e44] .entry .content-wrapper .title-row a.title {
  font-size: 1.333rem;
  line-height: 2.333rem;
  color: var(--juejin-font-1)
}

@media (max-width:600px) {
  .main-area.recommended-area .entry-list[data-v-61fb5e44] .entry .content-wrapper .title-row a.title {
    font-size: 14px;
    font-weight: 400
  }
}

.main-area.recommended-area .entry-list[data-v-61fb5e44] .entry .content-wrapper .abstract,
.main-area.recommended-area .entry-list[data-v-61fb5e44] .entry .content-wrapper img.thumb {
  display: none
}

.main-area.recommended-area .entry-list[data-v-61fb5e44] .entry .action-list>.item {
  color: var(--juejin-font-3)
}

.main-area.recommended-area .entry-list[data-v-61fb5e44] .entry .action-list>.item.view i {
  background-image: url(//lf-web-assets.juejin.cn/obj/juejin-web/xitu_juejin_web/e097e1d40a62ba25a0b059cf8c3185db.svg)
}

.main-area.recommended-area .entry-list[data-v-61fb5e44] .entry .action-list>.item.comment i {
  background-image: url(//lf-web-assets.juejin.cn/obj/juejin-web/xitu_juejin_web/a9532d230b98d8920a987aafa22e9059.svg)
}

.main-area.recommended-area .entry-list[data-v-61fb5e44] .entry .action-list>.item.comment:hover i {
  background-image: url(//lf-web-assets.juejin.cn/obj/juejin-web/xitu_juejin_web/846f7d2df7ac880bc6f678a2e1895462.svg)
}

.main-area.recommended-area .entry-list[data-v-61fb5e44] .entry .action-list>.item.like i {
  background-image: url(//lf-web-assets.juejin.cn/obj/juejin-web/xitu_juejin_web/7fe16de62924e291ba2f0a4ce34ea67a.svg)
}

.main-area.recommended-area .entry-list[data-v-61fb5e44] .entry .action-list>.item.like:hover i {
  background-image: url(//lf-web-assets.juejin.cn/obj/juejin-web/xitu_juejin_web/0d25157e7218c5372c7146c7d24a0efe.svg)
}

.main-area.recommended-area .entry-list[data-v-61fb5e44] .entry .action-list>.item.like.active {
  color: #1e80ff
}

.main-area.recommended-area .entry-list[data-v-61fb5e44] .entry .action-list>.item.like.active i {
  background-image: url(//lf-web-assets.juejin.cn/obj/juejin-web/xitu_juejin_web/315aced81d853a0cac8326a9a7e38ae3.svg)
}

.main-area .recommended-entry-list[data-v-61fb5e44] .entry-last-one {
  margin-bottom: 0
}

.article-area[data-v-61fb5e44] {
  margin-bottom: 1.67rem
}

.article[data-v-61fb5e44] {
  position: relative;
  padding-top: 2.667rem;
  z-index: 1;
  overflow: hidden
}

.comment-drawer[data-v-61fb5e44] {
  box-sizing: border-box
}

.comment-drawer .comment-drawer-header[data-v-61fb5e44] {
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 64px;
  position: fixed;
  padding: 0 22px 0 24px;
  top: 0;
  border-bottom: 1px solid var(--juejin-gray-1-1);
  background: var(--juejin-layer-1);
  width: 500px;
  transform: translateX(-20px);
  z-index: 100
}

.comment-drawer .comment-drawer-header .drawer-close[data-v-61fb5e44] {
  padding: 4px;
  box-sizing: content-box;
  cursor: pointer
}

.comment-drawer .jj-comment-list-container[data-v-61fb5e44] {
  margin-top: 64px
}

.comment-drawer[data-v-61fb5e44] * {
  box-sizing: border-box
}

.comment-drawer[data-v-61fb5e44] .byte-drawer__body {
  padding: 20px;
  overflow: visible
}

.comment-drawer[data-v-61fb5e44] .byte-drawer__mask {
  background: rgba(0, 0, 0, .08)
}

.article-placeholder[data-v-61fb5e44] {
  position: absolute;
  width: calc(100% - 64px)
}

.extension-banner[data-v-61fb5e44] {
  margin-top: 40px
}

.theme-list[data-v-61fb5e44] {
  display: flex;
  font-size: 1.167rem;
  line-height: 2.286
}

.theme-list[data-v-61fb5e44]:first-child:not(:last-child) {
  margin-right: 2.67rem;
  flex-shrink: 0
}

.theme-list .theme-list-title[data-v-61fb5e44] {
  flex-shrink: 0;
  margin-right: 8px;
  font-size: 14px;
  color: var(--juejin-font-2)
}

.theme-list .theme-list-container[data-v-61fb5e44] {
  display: flex;
  flex-wrap: wrap
}

.theme-list .item[data-v-61fb5e44] {
  display: flex;
  align-items: center;
  margin: 0 .667rem 1rem 0;
  padding: 0 1rem;
  border-radius: 4px;
  transition: background-color .15s linear
}

.theme-list .item.theme-item[data-v-61fb5e44] {
  background-color: var(--juejin-gray-3);
  color: var(--juejin-font-2)
}

.theme-list .item.theme-item[data-v-61fb5e44]:hover {
  background-color: var(--juejin-brand-5-light);
  color: var(--juejin-brand-1-normal)
}

.theme-list .theme-title[data-v-61fb5e44] {
  white-space: nowrap;
  line-height: 2.667rem;
  overflow: hidden;
  max-width: 200px;
  text-overflow: ellipsis;
  display: inline-block
}

.team-follow[data-v-61fb5e44] {
  margin-bottom: 1.667rem
}

@media (max-width:1000px) {
  .team-follow[data-v-61fb5e44] .left .icon {
    display: none
  }

  .team-follow[data-v-61fb5e44] .left .meta-box .time,
  .team-follow[data-v-61fb5e44] .left .meta-box .views-count {
    margin-right: 12px
  }

  .team-follow[data-v-61fb5e44] .left .title-line .title {
    color: var(--juejin-font-1)
  }
}

@media (min-width:1000px) {
  .team-follow[data-v-61fb5e44] .follow-btn {
    display: none
  }
}

.team-follow .edit-btn[data-v-61fb5e44] {
  position: absolute;
  right: 0
}

.follow[data-v-61fb5e44] {
  width: 76px;
  height: 32px;
  flex-shrink: 0;
  margin-left: 4px
}

@media (min-width:1000px) {
  .follow[data-v-61fb5e44] {
    display: none
  }
}

.vote-in-progress[data-v-61fb5e44] {
  width: 113px;
  height: 30px;
  display: inline-block;
  background-image: url(//lf-web-assets.juejin.cn/obj/juejin-web/xitu_juejin_web/img/vote-enter.61e4fec.gif);
  background-size: contain;
  background-repeat: no-repeat;
  vertical-align: sub;
  margin-left: 4px
}

@media (max-width:600px) {
  .vote-in-progress[data-v-61fb5e44] {
    width: 137px;
    height: 36px
  }
}

.author-info-block[data-v-61fb5e44] {
  display: flex;
  align-items: center;
  margin-bottom: 1.667rem
}

.author-info-block.block-hidden[data-v-61fb5e44] {
  visibility: hidden
}

.author-info-block .avatar-link[data-v-61fb5e44] {
  font-size: 0
}

.author-info-block .avatar[data-v-61fb5e44] {
  flex: 0 0 auto;
  margin-right: 1rem;
  width: 3.333rem;
  height: 3.333rem;
  border-radius: 50%
}

.author-info-block .author-info-box[data-v-61fb5e44] {
  display: flex;
  min-width: 0;
  flex-grow: 1;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  flex-wrap: wrap
}

.author-info-block .author-info-box .activity-in-progress[data-v-61fb5e44] {
  width: 100px;
  height: 19px;
  display: inline-block;
  background-image: url(//lf-web-assets.juejin.cn/obj/juejin-web/xitu_juejin_web/21f409eca2c1ef1e267131028760ad10.svg);
  background-size: contain;
  background-repeat: no-repeat;
  vertical-align: sub
}

.author-info-block .author-name[data-v-61fb5e44] {
  height: 2rem;
  display: flex;
  align-items: center;
  margin-right: 16px
}

.author-info-block .author-name .username[data-v-61fb5e44] {
  font-size: 14px;
  font-weight: 400;
  color: var(--juejin-font-2);
  line-height: 22px
}

.author-info-block .author-name .username[data-v-61fb5e44]:hover {
  color: var(--juejin-font-brand1-normal)
}

.author-info-block .author-name .username[data-v-61fb5e44] .vip-level {
  display: none
}

.meta-box[data-v-61fb5e44] {
  flex-shrink: 0;
  font-size: 14px;
  line-height: 22px;
  display: flex;
  align-items: center
}

.meta-box .read-time[data-v-61fb5e44],
.meta-box[data-v-61fb5e44],
.meta-box svg[data-v-61fb5e44] {
  color: var(--juejin-font-3)
}

.meta-box .read-time[data-v-61fb5e44] {
  display: flex;
  align-items: center
}

.meta-box .read-time svg[data-v-61fb5e44] {
  margin-right: 4px
}

.meta-box .read-time svg circle[data-v-61fb5e44],
.meta-box .read-time svg path[data-v-61fb5e44] {
  stroke: var(--juejin-font-3)
}

.meta-box .read-icon[data-v-61fb5e44] {
  margin-right: 5px
}

.meta-box .time[data-v-61fb5e44] {
  margin-right: 16px;
  white-space: nowrap
}

.meta-box .time[data-v-61fb5e44],
.meta-box .time svg[data-v-61fb5e44],
.meta-box .views-count[data-v-61fb5e44] {
  color: var(--juejin-font-3)
}

.meta-box .views-count[data-v-61fb5e44] {
  margin-right: 16px;
  white-space: nowrap
}

@media (max-width:600px) {
  .meta-box[data-v-61fb5e44] {
    font-size: 1rem;
    line-height: 1.417rem;
    margin-right: 100px
  }
}

.meta-box.team[data-v-61fb5e44] {
  font-size: 1.167rem;
  line-height: 20px;
  color: #72777b
}

.meta-box.team .time[data-v-61fb5e44] {
  margin-left: 0
}

@media (max-width:600px) {
  .meta-box.team[data-v-61fb5e44] {
    font-size: 1rem;
    line-height: 1.417rem;
    white-space: nowrap
  }

  .meta-box.team .read-icon[data-v-61fb5e44] {
    flex-shrink: 0
  }
}

.meta-box .dot[data-v-61fb5e44] {
  margin: 0 .5em
}

@media (max-width:600px) {
  .meta-box .dot[data-v-61fb5e44] {
    margin: 0 .2em
  }
}

.author-info-edit-btn[data-v-61fb5e44] {
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 22px;
  color: #1e80ff;
  cursor: pointer
}

.author-info-edit-btn[data-v-61fb5e44]:hover {
  text-decoration: underline
}

body[data-theme=dark] .article-viewer[data-v-61fb5e44] img {
  filter: brightness(.94);
  background-color: #f2f3f5
}

body[data-theme=dark] .article-sidebar[data-v-61fb5e44] .banner,
body[data-theme=dark] .article-sidebar[data-v-61fb5e44] .sidebar-entry {
  filter: brightness(.94)
}

.article-title[data-v-61fb5e44] {
  margin: 0 0 1.3rem;
  font-size: 2.667rem;
  font-weight: 600;
  line-height: 1.31;
  color: var(--juejin-font-1)
}

@media (max-width:600px) {
  .article-title[data-v-61fb5e44] {
    font-size: 2rem
  }
}

.article-title .audit-tag-wrap[data-v-61fb5e44],
.article-title .spost-link[data-v-61fb5e44] {
  transform: translateY(-.5em);
  margin-left: 16px;
  font-size: 14px;
  padding: 3px 10px
}

.article-title .spost-link[data-v-61fb5e44] {
  display: inline-block;
  text-align: center;
  font-weight: 400;
  background-color: #fff7e8;
  color: #ff7d00;
  opacity: .8;
  border-radius: 5px
}

.tag-list-box[data-v-61fb5e44] {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  margin-bottom: -12px
}

.tag-list-box .tag-list[data-v-61fb5e44] {
  display: flex;
  font-size: 1.167rem;
  line-height: 2.286
}

.tag-list-box .tag-list[data-v-61fb5e44]:not(:last-child) {
  margin-right: 2.67rem;
  flex-shrink: 0
}

.tag-list-box .tag-list .tag-list-title[data-v-61fb5e44] {
  flex-shrink: 0;
  margin-right: 8px;
  font-size: 14px;
  color: var(--juejin-font-2)
}

.tag-list-box .tag-list .tag-list-container[data-v-61fb5e44] {
  display: flex;
  flex-wrap: wrap
}

.tag-list-box .tag-list .item[data-v-61fb5e44] {
  display: flex;
  align-items: center;
  margin: 0 1rem 1rem 0;
  padding: 0 1rem;
  border-radius: 4px;
  transition: background-color .15s linear
}

.tag-list-box .tag-list .item.tag-item[data-v-61fb5e44] {
  background-color: var(--juejin-gray-3);
  color: var(--juejin-font-2)
}

.tag-list-box .tag-list .item.tag-item[data-v-61fb5e44]:hover {
  background-color: var(--juejin-brand-5-light);
  color: var(--juejin-brand-1-normal)
}

.tag-list-box .tag-list .tag-title[data-v-61fb5e44] {
  white-space: nowrap;
  line-height: 2.667rem
}

.footer-author-block[data-v-61fb5e44] {
  padding: 15px 17px;
  border-radius: 2px;
  background-color: #f4f5f5;
  margin-bottom: 2.67rem
}

@media (max-width:600px) {
  .footer-author-block[data-v-61fb5e44] {
    padding: 15px 1rem
  }
}

.comment-box-common[data-v-61fb5e44] {
  border-radius: 4px;
  background: var(--juejin-layer-1);
  margin-top: 20px;
  padding-top: 20px;
  padding-bottom: 20px;
  font-style: normal
}

.comment-box-common[data-v-61fb5e44],
.comment-box-common[data-v-61fb5e44] * {
  box-sizing: border-box
}

.comment-box-common.comment-box-mobile[data-v-61fb5e44] {
  margin-top: 8px;
  padding: 16px !important
}

.comment-box-common.comment-box-mobile[data-v-61fb5e44] .comment-card:before {
  left: -15px !important;
  right: -15px !important
}

.comment-box-common.comment-box-mobile[data-v-61fb5e44] .reply-card:before {
  left: -58px !important;
  right: -15px !important
}

.sidebar[data-v-61fb5e44] {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: 25rem
}

@media (max-width:1000px) {
  .sidebar[data-v-61fb5e44] {
    position: relative;
    width: 100%
  }
}

.main-area .action-bar[data-v-61fb5e44] {
  display: none;
  position: fixed;
  z-index: 102;
  bottom: 0;
  width: 100%;
  left: 0
}

@media (max-width:1140px) {
  .main-area[data-v-61fb5e44] {
    width: calc(100% - 26.67rem)
  }
}

@media (max-width:1000px) {
  article>.extension-banner[data-v-61fb5e44] {
    display: none
  }

  .main-area[data-v-61fb5e44] {
    width: 100%
  }

  .main-area>[data-v-61fb5e44] {
    border: none
  }

  .main-area.recommended-area .entry-list[data-v-61fb5e44] .entry,
  .main-area>[data-v-61fb5e44] {
    padding-left: 2rem;
    padding-right: 2rem
  }

  .article-area[data-v-61fb5e44] {
    margin-bottom: 0
  }

  .open-in-app[data-v-61fb5e44] {
    bottom: 6rem
  }
}

@media (max-width:600px) {
  .main-area .action-bar[data-v-61fb5e44] {
    display: block
  }

  .browser-height[data-v-61fb5e44] {
    min-height: "800px"
  }
}

.border[data-v-61fb5e44] {
  border-bottom: 1px solid rgba(178, 186, 194, .15)
}

.originalUrl[data-v-61fb5e44] {
  margin-top: 24px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis
}

.originalUrl a[data-v-61fb5e44] {
  color: var(--juejin-brand-1-normal)
}

.team-user[data-v-61fb5e44] {
  display: flex;
  align-items: center;
  margin-top: 1.667rem
}

.team-user.block-hidden[data-v-61fb5e44] {
  visibility: hidden
}

.team-user .avatar[data-v-61fb5e44] {
  flex: none;
  width: 1.667rem;
  height: 1.667rem;
  border-radius: 50%;
  margin-right: .3rem
}

.team-user .username[data-v-61fb5e44] {
  flex-shrink: 1;
  font-size: 14px;
  line-height: 16px;
  color: #8a9aa9;
  max-width: calc(100% - 10rem);
  display: flex
}

.team-user .username[data-v-61fb5e44] a {
  flex: none
}

.team-user .username[data-v-61fb5e44] .name {
  flex: auto;
  font-weight: 500
}

.team-user .username[data-v-61fb5e44] .name:hover {
  color: var(--juejin-font-brand1-normal)
}

.team-user .username[data-v-61fb5e44] .vip-level {
  display: none
}

.team-user .vote-in-user[data-v-61fb5e44] {
  width: 96px;
  height: 24px;
  display: inline-block;
  background-image: url(//lf-web-assets.juejin.cn/obj/juejin-web/xitu_juejin_web/img/vote-enter.61e4fec.gif);
  background-size: contain;
  background-repeat: no-repeat;
  vertical-align: sub
}

.team-user .position[data-v-61fb5e44] {
  flex-shrink: 2;
  margin-left: 1rem;
  font-size: 14px;
  line-height: 16px;
  color: #8a9aa9
}

.post-view[data-v-61fb5e44] {
  position: relative
}