article.md
  max-width: 100%
  padding: 1rem
  color: var(--text-p1)
  line-height: 1.7

article.md.excerpt
  p
    font-size: $fs-14
    margin: 1em 0

article.md.content
  position: relative
  margin-bottom: 2rem
  h1.article-title
    margin-top: 0.5rem
    line-height: 1.2
    color: var(--text-p0)
  h2,h3,h4,h5,h6
    color: var(--text-p0)
    padding-top: 1rem
    margin-bottom: 1em
    &:hover
      a.headerlink:before
        opacity: 1

// titles
article.md
  a.headerlink:before
    opacity: 0
    content: '#'
    position: absolute
    margin-left: -0.75em
  h2
    margin-top: 3rem
    border-bottom: 1px solid var(--block-border)
    font-weight: 400
    &:first-child
      margin-top: 0
  h3
    margin-top: 1.5rem
    font-weight: 400
  h4,h5,h6
    font-weight: 500
  h1+h2
    margin-top: 0
  h2+h3
    margin-top: 0
  h3+h4
    margin-top: 0
  h4+h5
    margin-top: 0
  h5+h6
    margin-top: 0

// a
article.md
  p>a
    &:not([class])
      font-weight: 500
      &:hover
        text-decoration: underline

article.md p
  font-size: $fs-p

// code
article.md code
  color: $color-inlinecode
  font-family: $ff-code
  word-break: break-all
  font-size: $fs-p
  background: var(--block)
  padding: 2px
  border-radius: 2px
  border: 1px solid var(--block-border)

// div
article.md>div
  margin: 1rem 0
// blockquote
article.md blockquote
  margin: 1rem 0
  padding: 1rem
  background: var(--block)
  border-left: 3px solid $color-theme
  border-radius: 0 $border-block $border-block 0
  color: var(--text-p2)
  p
    margin: 0.5em 0
    font-size: $fs-14


article.md img
  border-radius: 4px
  margin: auto
  display: block