CSS for textual content following a hard reset

prose.css

.prose :first-child {
  margin-top: 0 !important;
}

.prose {
  line-height: 1;
  text-rendering: optimizeLegibility;
}

.prose,
.light .prose,
.light.prose {
  --prose-border-color: #777;
  --prose-code-bg: #ffe;
  --prose-code-color: #703;
  --prose-highlight-bg: yellow;
  --prose-link-color: #33c;
}

.dark .prose,
.dark.prose {
  --prose-border-color: #777;
  --prose-code-bg: #333;
  --prose-code-color: #eee;
  --prose-highlight-bg: yellow;
  --prose-link-color: #77f;
}

/* Baseline grid for debugging. */
.prose.prose-baseline {
  background-image: linear-gradient(
    to bottom,
    #777 0,
    rgba(255, 255, 255, 0) 1px
  );
  background-repeat: repeat-y;
  background-size: 100% 1.5em;
}

/* Line height for block elements. */
.prose caption,
.prose dd,
.prose dt,
.prose figcaption,
.prose li,
.prose p,
.prose pre,
.prose td,
.prose th {
  line-height: 1.5;
}

/* Margin after appropriate block elements. */
.prose caption,
.prose dd,
.prose dl,
.prose figcaption,
.prose figure,
.prose p,
.prose pre,
.prose ol,
.prose table,
.prose ul {
  margin: 0 0 1.5em 0;
}

.prose blockquote,
.prose ol,
.prose ul {
  margin-left: 2.5em;
}

.prose code {
  padding: 0 0.25em;
  color: var(--prose-code-color);
  background: var(--prose-code-bg);
}
.prose kbd,
.prose samp {
  padding: 0 0.25em;
  border: 1px solid var(--prose-border-color);
  border-radius: 0.25em;
}

/* Inline elements */
.prose a {
  text-decoration: underline;
  color: var(--prose-link-color);
}

.prose abbr[title] {
  border-bottom: 1px dotted black;
  border-color: var(--prose-border-color);
}

.prose b,
.prose strong {
  font-weight: bold;
}


.prose cite,
.prose em,
.prose i,
.prose var {
  font-style: italic;
}

/* Insertion, deletion etc. */
.prose del,
.prose s {
  text-decoration: line-through;
}
.prose ins {
  text-decoration: underline;
}
.prose u {
  text-decoration: underline wavy;
}
.prose mark {
  background-color: var(--prose-highlight-bg);
}

.prose small {
  font-size: 0.75em;
}

.prose sub {
  font-size: 80%;
  vertical-align: sub;
}
.prose sup {
  font-size: 0.75em;
  vertical-align: super;
}

/* Lists */
.prose ol ol,
.prose ul ul,
.prose ol ul,
.prose ul ol {
  margin-top: 0;
  margin-bottom: 0;
}
.prose ol {
  list-style: decimal;
}
.prose ol ol {
  list-style: lower-alpha;
}
.prose ol ol ol {
  list-style: lower-roman;
}
.prose ol ol ol ol {
  list-style: decimal;
}
.prose ul {
  list-style: disc;
}
.prose ul ul {
  list-style: circle;
}
.prose ul ul ul {
  list-style: '- ';
}
.prose dt {
  font-weight: bold;
}
.prose dd {
  margin-top: 0;
}

/* Headings */
.prose h1,
.prose h2,
.prose h3,
.prose h4,
.prose h5,
.prose h6 {
  font-weight: bold;
  line-height: 1.5;
}
/* h1 headings: total height 6em */
.prose h1 {
  font-size: 2.4em;
  margin: 0.6875em 0 0.3125em 0;
}
/* h2 headings: total height 6em */
.prose h2 {
  font-size: 2em;
  margin: 1.125em 0 0.375em 0;
}
.prose h1 + h2,
.prose h2 + h2,
.prose h3 + h2 {
  margin-top: 0.75em;
}
/* h3 headings: total height 6em */
.prose h3 {
  font-size: 1.6em;
  margin: 1.78125em 0 0.46875em 0;
}
.prose h2 + h3,
.prose h3 + h3,
.prose h4 + h3 {
  margin-top: 1.3125em;
}
/* h4 headings: total height 4.5em */
.prose h4 {
  font-size: 1.2em;
  margin: 1.625em 0 0.625em 0;
}
.prose h3 + h4,
.prose h4 + h4,
.prose h5 + h4 {
  margin-top: 1em;
}
/* h5 headings: total height 4.5em */
.prose h5 {
  font-size: 1em;
  margin: 2.25em 0 0.75em 0;
}
.prose h4 + h5,
.prose h5 + h5 {
  margin-top: 1.5em;
}
.prose h6 + h5 {
  margin-top: 0.75em;
}
/* h6 headings: total height 3em */
.prose h6 {
  font-size: 1em;
  margin: 1.5em 0 0 0;
}
.prose h5 + h6,
.prose h6 + h6 {
  margin-top: 0;
}

/* Blockquotes */
.prose blockquote {
  border-left: 0.25em solid black;
  border-left-color: var(--prose-border-color);
  padding-left: 0.75em;
}
.prose blockquote blockquote {
  margin-left: 0;
}

/* Preformatted */
.prose pre {
  overflow: scroll;
}
.prose pre code {
  display: block;
  background: var(--prose-code-bg);
  padding: 0.25em 0.75em 0.5em;
  border-radius: 0.5em;
  margin-bottom: 0.75em;
}


/* Tables */
.prose table {
  border-collapse: collapse;
  table-layout: auto;
  border: 2px solid black;
}
.prose th,
.prose td {
  padding: 0.125em 0.5em 0.25em;
  border: 1px solid black;
}
.prose table,
.prose th,
.prose td {
  border-color: var(--prose-border-color);
}
.prose th {
  font-weight: bold;
}

.prose caption {
  caption-side: top;
  font-weight: bold;
  margin-top: 0;
  text-align: left;
}

/* Media. */
.prose embed,
.prose iframe,
.prose img,
.prose object {
  display: inline;
  max-width: 100%;
}
.prose figure {
  max-width: 100%;
}
.prose figcaption {
  font-size: 0.75em;
  line-height: 2;
  text-align: left;
}