article.post {
    width: 85vw;
    max-width: 150ch;
    margin: auto;
    margin-top: 7em;
    padding: 1em 1.5em;
    background-color: var(--dark);
    border-radius: var(--border-radius);
    position: relative;
}

.post-header, .toc, .post-body {
    margin: 1em;
    border-radius: var(--border-radius);
}

.post-header, .comments-section {
    background-color: var(--less-dark);
    padding: 1em 1.5em;
    border-radius: var(--border-radius);
}

.toc a {
    color: white;
}

code {
    background-color: var(--more-dark);
    padding: 1ch;
    border-radius: 0.75ch;
}

.header-anchor {
    color: unset;
    text-decoration: none;
}

h2 {
    padding: 0.75em 0em;
    border-radius: calc(var(--border-radius) / 2);
    display: flex;
    align-items: first baseline;
    width: 100%;
}

h2::after {
    content: '';
    display: inline-block;
    height: 0.75ch;
    background-color: var(--less-dark);
    width: 5ch;
    flex-grow: 1;
    margin-left: 3ch;
}

h3 {
    color: var(--theme-light-alt);    

    &::before {
	content: "< ";
    }

    &::after {
	content: " >";
    }
}

h5::before {
    content: ">>> ";
}

code {
    background-color: var(--more-dark);
}

nav.pagination ul {
    width: 85vw;
    max-width: 150ch;
    margin: auto;
    padding: 3ch 0ch;
    display: flex;
    justify-content: space-between;

    & li {
	display: inline;
    }
    
    & a {
	padding: 1ch;
    }
}

.top-navbar {
    background-color: var(--accent-dark);
}