.blog-markdown {
  overflow-wrap: anywhere;
  line-height: 1.8;
  font-size: 16px;
  letter-spacing: 0;
}
.blog-markdown > :first-child { margin-top: 0; }
.blog-markdown h2, .blog-markdown h3, .blog-markdown h4,
.blog-markdown h5, .blog-markdown h6 {
  margin: 1.5em 0 0.6em;
  line-height: 1.4;
  font-weight: 700;
  color: inherit;
  background: none;
  padding: 0;
}
.blog-markdown h2 { font-size: 24px; }
.blog-markdown h3 { font-size: 21px; }
.blog-markdown h4, .blog-markdown h5, .blog-markdown h6 { font-size: 18px; }
.blog-markdown p { margin: 0 0 1.2em; padding: 0; font: inherit; }
.blog-markdown ul, .blog-markdown ol { margin: 0 0 1.2em; padding-left: 1.6em; }
.blog-markdown ul { list-style: disc outside; }
.blog-markdown ol { list-style: decimal outside; }
.blog-markdown li { margin: 0.4em 0; font: inherit; }
.blog-markdown li > ul, .blog-markdown li > ol { margin-bottom: 0; }
.blog-markdown a { color: var(--green-700, var(--link-fg)); text-decoration: underline; text-underline-offset: 3px; }
.blog-markdown blockquote {
  margin: 1.2em 0;
  padding: 12px 20px;
  font: inherit;
  border-left: 3px solid var(--green-300, var(--border-color));
  color: var(--ink-600, var(--body-fg));
  background: var(--paper-2, var(--darkened-bg));
}
.blog-markdown blockquote > :last-child { margin-bottom: 0; }
.blog-markdown pre {
  max-width: 100%;
  font-size: inherit;
  box-sizing: border-box;
  overflow-x: auto;
  padding: 16px;
  border: 1px solid var(--hairline, var(--border-color));
  border-radius: 4px;
  background: var(--paper-2, var(--darkened-bg));
  white-space: pre;
}
.blog-markdown code { font-family: ui-monospace, monospace; font-size: 0.9em; }
.blog-markdown :not(pre) > code { padding: 2px 5px; background: var(--paper-2, var(--darkened-bg)); border-radius: 3px; }
.blog-markdown table { display: block; width: max-content; max-width: 100%; overflow-x: auto; border-collapse: collapse; margin: 1.2em 0; }
.blog-markdown th, .blog-markdown td { padding: 10px 14px; border: 1px solid var(--hairline-2, var(--border-color)); font-size: 14px; text-align: left; }
.blog-markdown th { background: var(--paper-2, var(--darkened-bg)); text-transform: none; font-weight: 700; }
.blog-markdown img { display: block; max-width: 100%; height: auto; margin: 1em 0; border-radius: 4px; }
.blog-markdown hr { margin: 2em 0; border: 0; border-top: 1px solid var(--hairline, var(--border-color)); }
@media (max-width: 767px) {
  .blog-markdown h2 { font-size: 22px; }
  .blog-markdown h3 { font-size: 19px; }
}
