/* Import GitHub markdown CSS */
@import url("https://cdn.jsdelivr.net/npm/github-markdown-css/github-markdown.css");

@media (prefers-color-scheme: dark) {
  body,
  [data-theme="dark"] {
    /* dark */
    color-scheme: dark;
    --bgColor-default: #0d1117;
    --bgColor-muted: #151b23;
    --bgColor-neutral-muted: #656c7633;
    --bgColor-attention-muted: #bb800926;
  }
}

@media (prefers-color-scheme: light) {
  body,
  [data-theme="light"] {
    /* dark */
    color-scheme: light;
    --bgColor-default: #ffffff;
    --bgColor-muted: #f6f8fa;
    --bgColor-neutral-muted: #818b981f;
    --bgColor-attention-muted: #fff8c5;
  }
}

body {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen",
    "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue",
    sans-serif;
  margin: 0;
  padding: 0;
  background-color: var(--bgColor-muted)
}

svg {
  position: absolute;
  top: 60px;
  right: 40px;
  z-index: 10;
}

.container {
  max-width: 980px;
  margin: 0 auto;
  padding: 40px 20px;
  position: relative;
}

.markdown-body {
  padding: 24px;
  border-radius: 6px;
  box-shadow: 0 1px 5px rgba(0, 0, 0, 0.1);
  overflow-wrap: break-word;
  word-wrap: break-word;
}

.markdown-body a {
  text-decoration: underline;
  text-underline-offset: 3.2px;
}

.markdown-body h1 {
  font-size: 2em;
}

.markdown-body h2 {
  font-size: 1.5em;
}

.markdown-body code {
  font-size: 1em;
  background-color: var(--bgColor-muted);
  padding: 2px 5px;
  border-radius: 3px;
}

.markdown-body img {
  display: inline;
  top: 60px;
  right: 40px;
  z-index: 10;
}