/* src/styles/mdx.css */
.mdx {
  & * {
    line-height: normal;
  }
  & h1,
  & h2,
  & h3 {
    font-weight: 700;
    margin-bottom: 6px;
  }
  & h4,
  & h5,
  & h6 {
    font-weight: 600;
    margin-bottom: 4px;
  }
  & h1 {
    font-size: 24pt;
    text-decoration: underline;
  }
  & h2 {
    font-size: 20pt;
  }
  & h3 {
    font-size: 16pt;
  }
  & h4 {
    font-size: 14pt;
  }
  & h5 {
    font-size: 12pt;
  }
  & h6 {
    font-size: 10pt;
  }
  & p {
    margin-bottom: 4px;
  }
  & ul,
  & ol {
    list-style-type: revert;
    list-style-position: inside;
    & li {
      margin-top: 4px;
      margin-bottom: 4px;
    }
  }
  & em {
    font-style: italic;
  }
  & strong {
    font-weight: bolder;
  }
  & blockquote {
    margin-top: 4px;
    margin-bottom: 4px;
    padding-left: 8px;
    color: #000a;
    border-left: 4px solid #000a;
  }
  & code {
    padding: 3px 5px;
    border-radius: 4px;
    background-color: #0001;
    font-family: monospace;
  }
  & pre:has(> code) {
    padding: 4px 8px;
    border-radius: 6px;
    background-color: #0001;
    white-space: pre-wrap;
    font-family: monospace;
    & > code {
      padding: 0;
      border-radius: 0;
      background-color: transparent;
      font-family: inherit;
    }
  }
}