Note: I used “.prose-wrapper” before the generic selectors as I am assuming the content you want to apply the prose stylings to are in a wrapper. But you can remove or amend as required.
.prose-wrapper h1{
color: #111827;
font-size: 2.25em;
font-weight: 800;
line-height: 1.1111111;
margin-top: 0;
margin-bottom: 0.8888889em;
}
.prose-wrapper h2{
color: #111827;
font-size: 1.5em;
font-weight: 700;
line-height: 1.3333333;
margin-bottom: 1em;
margin-top: 2em;
}
.prose-wrapper h3{
color: #111827;
font-size: 1.25em;
font-weight: 600;
line-height: 1.6;
margin-top: 0;
margin-bottom: 0.6em;
}
.prose-wrapper h4{
color: #111827;
font-weight: 600;
line-height: 1.5;
margin-top: 0;
margin-bottom: 0.5em;
}
.prose-wrapper h5{
color: #374151;
font-size: 18px;
line-height: 1.75;
margin-top: 0;
}
.prose-wrapper h6{
color: #374151;
font-size: 16px;
line-height: 1.75;
margin-top: 0;
}
.prose-wrapper p{
color: #374151;
line-height: 1.75;
margin-top: 1.25em;
margin-bottom: 1.25em;
}
.prose-wrapper a{
color: #111827;
font-weight: 500;
line-height: 1.75;
text-decoration: underline;
text-decoration-line: underline;
text-decoration-style: solid;
text-decoration-color: currentcolor;
text-decoration-thickness: auto;
}
.prose-wrapper a:hover{
text-decoration: none;
}
.prose-wrapper pre{
background-color: #1f2937;
border-radius: 0.375rem;
color: #e5e7eb;
font-size: 0.875em;
font-weight: 400;
line-height: 1.7142857;
margin-bottom: 1.7142857em;
margin-top: 1.7142857em;
overflow-x: auto;
padding: 0.8571429em 1.1428571em;
}
.prose-wrapper img{
margin-bottom: 2em;
margin-top: 2em;
}
/* I created my own button stylings - I don't think there are prose button stylings */
.prose-wrapper button{
background-color: rgb(37 99 235);
color: #fff;
font-size: 0.875em;
font-weight: 500;
border-radius: 0.25rem;
box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
padding: 0.625rem 1.5rem;
margin-bottom: 1.7142857em;
margin-top: 1.7142857em;
}
.prose-wrapper button:hover{
background-color: rgb(29 78 216);
}