.markdown-body {
  @apply px-2 break-all w-[800px] mx-auto;
}

.markdown-body h1 {
  @apply text-3xl font-semibold;
}
.markdown-body h2 {
  @apply text-2xl font-medium;
}
.markdown-body h3 {
  @apply text-xl font-medium;
}

.markdown-body .heading-number {
  @apply font-mono;
}

.markdown-body figure img {
  border-radius: 6px;
  display: block;
  margin: 10px auto;
  object-fit: contain;
  box-shadow: 2px 4px 7px #999;
}

.markdown-body figure {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  margin-top: 14px;
  margin-bottom: 14px;
}

.markdown-body .qrcode-box {
  @apply font-sans;
  border-radius: 0.25rem;
  display: flex;
  justify-content: space-between;
  margin-top: 1rem;
  margin-bottom: 1rem;
  padding: 1rem;
  color: rgba(113,128,150, 1);
  background-color: rgb(246,246,246);
  border: 1px solid #efefef;
}

.markdown-body blockquote .qrcode-box {
  background-color: transparent;
  border: 1px solid #e3e3e3;
}

.markdown-body .qrcode-text {
  @apply flex flex-col justify-around text-sm break-all;
  width: calc(100% - 96px);
  color: #718096;
}

.markdown-body .qrcode-img {
  width: 90px;
  height: 90px;
  margin-left: 4px;
  flex-shrink: 0;
}

.markdown-body .qrcode-box p {
  @apply m-0;
}

.markdown-body pre {
  border-radius: 6px;
  box-shadow: 2px 4px 7px #999;
  margin: 14px 0;
  padding: 0 !important;
}

.markdown-body pre,
.markdown-body pre code.hljs {
  display: block;
  overflow-x: auto;
  color: #abb2bf;
  background: #282c34;
}

.markdown-body pre code.hljs {
  padding: 12px;
  padding-top: 6px;
  font-size: 0.85em;
}

.markdown-body pre::before {
  content: '';
  display: block;
  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGwAAAAcCAYAAACERFoMAAAFdklEQVRoQ+2aTWwTRxiGv5nddez1/jjGAYJDEwhSCRzDjUKDgFagVAgQ7aURvVDEFXFFCHGlXBHiUkQvLSIIkYLagBpA3MgR0koEEogJEMfx/njX8e7OVLuOU0jjkKzXaSOtzzuzj+fd79U7Mx+C8LeiVgAtlvZxZye3plHcboPTgSik3HEUQZYFZujtlPZo2+Cgtdi56vHc40ud3Cpe2U4c0oEQKvNRmsUMHpo05Efbjv+3fJ2XOrm3ycJ2SlEHoPL6AYUsQnRoLBd/BIvk+6hgI7s/38Uw6CShdB/LMlqE4yIsg2Pu+2yHmCXLKtm2I2KE7jgOvdB27/4f9RCk2pzPrrTv4lw+QvdxLNYiESbCMjDDB2ap5JQsm4gYozuWQy9sOjq8rHzpnz/dBRx7kjpkH8OxGo6wEcSW14/axCQlu+RYtogYfAc5zg9jR/4cWGj9qgo28uWOZkSYyxjDTlkUxHgsChjjeecihEDBLIKi6Roh8IBi51jbbw/H6yncyNXWZgD2MgK0MyFxosCzgPH8f4cQCrphQ161NAr0AYB9rK1ntK58rdc7mm3AlwHBzgYpLrLxKKAqfJRQsApFKKkFDQDuswXy/WjP0Lx88/5Dt6oQhl5J4OWEJH60Ct8XJq9qVNUNhRI4VK9qc6uKRdAriZzcKEWWxDellqiqWYpN4VC9qs2rKpbp5cSY3CALS+KbVnRqqaaCKDk4X7X9a7IZsfpTjTLDx6K+isQwi5CdUhxKYG/QorliMQj6m5INTDzG+uIrmDZM5KYdh8LeoEVzxaIM7o+tkhmWb/DFZxvTYGYVBwPdM1e0DwQr2yB+mmqUE37FqhDOiJanmGwJyh49G6Ts01SyIeFXrAqfK1o2N50HZG8Jyh7LNoieRpNSwq9YFT5XtOKkmmcR3TJ6+B97/ECw0b1dfZIQ279UG6z2GZXt0bzd2j/Q7etTmzNo5Gp7nyRw+5dqg9Xe7dmjbt1u6xkOhC99fWsfJ0b3L9UGq/F59qgXf80cevJV5ZlZwbw0yKKbLWtXi0EsbmWOsTfvNMemB2q1Ri8NYnTzk3V8oHwvXxuaReiBWq1xJg3eFNKpQPn0TFYDyz6Q+eYvL93OCvbqi65bsiR0i3E+SL1AKxigqHrf+t8HZr8SPy8Y/WnTrYTIdUsC52d41TGqbkFes/pav31WE1+6d+utBinezYleYg/sZ2kmTKuFvkqVeYK5m+KmpGC2rG1iqkV3vwRu5B97M+FM5PSY3821tymO5c1PmnmmWnT3z0fh5bjhTJqJmN/NtbspHk8aptDSxFSL7n753Mivj004zTk+Nnh80PIEe7Wnqwtz+Ma61amE34kXGvf6XTZPLHJw/d2BBTeF1eZ4cXVTF8egG+k1sbrwZd6aecuhBzf0PPPF13JtcxfiuBt8c7IufMZ4Lk8ty4v5nmAv9uw4IfD8+VSjHKwfziiQnVIM3TBObbj78KKfD2L4x40nRCFyvqkxUhe+iamSoemlU+3fPffFl/6l4wQrRM9HV0l14StOqoatF09lvh666Ak2snvHaVkSzgaVDueK4qZFRdXPtN17eM6PYM+vtJ9OSNzZoNLhXAY3LeZV68zGo8O++NLXOk5zMn82qHQ4l89Li4pxJnNk6FwoGACsOMFCS1xhlhiGjhUWOsJYv8JivRftw43zytk4l5NieDTlJ8FWxiz70ZT74vDwtxbJAOpy+KsVb2cOP5k9nA6vV/7P1ys5Nc/CAtcrFWtEGMILTJ/FFtgF5qTiYPqRC8wKY9gi4FOtmWE1twhopoLIIlsEZkULm3BqUm1Zm3DeJw3b3GrSDZatzW0uZthIWptw7p3Zm4T+GSC8ua6NpLVhhqODXoG/AV56X1lhWm2vAAAAAElFTkSuQmCC");
  height: 30px;
  width: 100%;
  background-size: 40px;
  background-repeat: no-repeat;
  background-color: #282c34;
  margin-bottom: -7px;
  border-radius: 5px;
  background-position: 10px 10px;
}

.markdown-body .svg-markmap-box {
  @apply w-full min-h-80;
}

.markdown-body .footnote-backref {
  @apply hidden;
}

.markdown-body .footnotes-title {
  @apply mb-4 text-lg font-medium;
}

.markdown-body .footnotes {
  @apply text-sm;
}

.markdown-body .footnote-item {
  @apply flex my-1;
}

.markdown-body .footnote-link {
  @apply border-b border-b-gray-500;
  border-bottom-style: dashed;
}

.markdown-body .footnote-num {
  @apply font-mono text-[13px] align-middle w-14 shrink-0 opacity-70;
  line-height: 25px;
}

.markdown-body .footnote-item p {
  @apply p-0 m-0;
  line-height: 25px;
}

.markdown-body img {
  max-width: 100%;
}

.markdown-body .qrcode-img img {
  margin: auto;
}

.markdown-body ol {
  list-style: decimal;
}

.markdown-body ul {
  list-style: circle;
}

.markdown-body.square {
  background-image: 
    linear-gradient(
      90deg, rgba(50,0,0,.07) 3%, rgba(0,0,0,0) 3%
    ),linear-gradient(
      360deg, rgba(50,0,0,.07) 3%, rgba(0,0,0,0) 3%
    );
  background-size: 20px 20px;
  background-position: center center;
}

.markdown-body hr {
  margin: 16px 0;
}

.markdown-body table {
  @apply block w-full overflow-auto border-collapse;
  border-spacing: 0;
}

.markdown-body th {
  font-weight: 600;
}

.markdown-body td,
.markdown-body th {
  padding: 6px 13px;
  border: 1px solid #dfe2e5;
}

.markdown-body tr {
  /* background-color: #fff; */
  border-top: 1px solid #c6cbd1;
}

.markdown-body tr:nth-child(2n) {
  background-color: #f6f8fa;
}