body {
  /* bamboo is too thin */
  max-width: 80ch;
}
/* Add styling for captions, mainly to go under code blocks */
figcaption {
  font-size: 0.9rem;
  text-align: center;
  margin-bottom: 1rem;
}
q { quotes: "“" "”" "‘" "’"; }
code {
  border-radius: 5px;
  /* scale font size wrt current font size so it renders nicely inline */
  /* font-size: .875rem; */
  font-size: .875em;
  /* Adjust for code blocks in headings, which have different font size */
  /* padding: .125rem .25rem */
  padding: calc(.6em - .4rem) .285em .14em .285em;
}

:root{
  /* --b-txt: #2e3440; */
  --b-txt-faded: rgba(92,104,128,0.5);
}
@media(prefers-color-scheme: dark){
  :root{
    /* --b-txt: #eceff4; */
    --b-txt-faded: rgba(217,223,233,0.5);
  }
}

span.uncode {
  font-family: var(--b-font-main);
  background: var(--b-bg-3);
  text-decoration-color: var(--b-txt-faded);
  text-decoration-style: dashed;
  text-decoration-line: underline;
  white-space: break-spaces;
  /* It seems to look better if we don't revert font size.
   * So this means that uncode'd comments are actually smaller
   * than the main text font size, but it works better. */
  /* font-size: 1.14em; */
  /* line-height: 1em; */
}
span.uncode code {
  /* The code inside uncode are now too small though
   * (they get the .875em multiplier applied twice).
   * So we ensure code in uncode are not ensmallified. */
  font-size: 1em;
}
pre {
  border-radius: 5px;
  /* ensure font size is inherited by inner code block */
  font-size: inherit;
  word-wrap: normal;
}