body > header {
    position: absolute;
}

@keyframes jumpTopAutoShow {
  0% {
    opacity: 0;
  }
  7% {
    opacity: 0;
  }
  15% {
    opacity: 1;
  }
  100% {
    opacity: 1;
  }
}

#jump-top {
  animation: jumpTopAutoShow;
  animation-timeline: scroll(root);
  background: var(--header);
  font-size: 0.875rem;
  font-weight: 500;
  padding: 0.675rem;
  position: fixed;
  bottom: 48px;
  right: 16px;
  z-index: 10;
  opacity: 0;
}

@media (min-width: 52rem) {
  #jump-top {
    right: calc((100vw - 48rem) / 2 - 4rem);
  }
}

@keyframes scaleProgress {
  0% {
    transform: scaleX(0);
  }
  100% {
    transform: scaleX(1);
  }
}

#scroll-progress {
  animation: scaleProgress auto linear;
  animation-timeline: scroll(root);
  background: #0097e6;
  height: 4px;
  width: 100%;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 10;
  transform-origin: 0 50%;
}

.prose > article > section {
  text-wrap: pretty;
}

.prose > article > section p > img {
  display: block;
  margin: 0 auto;
}

.prose > article > section p > code {
  background: #bdc3c7;
  border-radius: 4px;
  padding: 2px 4px;
}

.dark .prose > article > section p > code {
  background: #2c3e50;
}

.prose :where(code):not(:where([class~=not-prose],[class~=not-prose] *)):before,
.prose :where(code):not(:where([class~=not-prose],[class~=not-prose] *)):after {
  content: unset
}

.zola-anchor {
  display: none;
  font-size: 1.5rem;
  padding-left: 0.325rem;
}

*:hover > .zola-anchor {
  display: unset;
}
