/* The site shell comes from index.css; keep additions scoped to articles. */
body.post {
    height: auto;
    min-height: 100%;
    font-family: "Computer Modern Serif", serif;
}

.post #main {
    height: auto;
    min-height: 100vh;
}

.post #content {
    min-width: 0;
    width: 100%;
}

.post article { line-height: 1.55; }

.post article > p,
.post article section p {
    text-align: justify;
}

.article-header h1 {
    font-size: clamp(1.6rem, 5vw, 2.3rem);
    line-height: 1.25;
    overflow-wrap: anywhere;
}

.post article h2, .post article h3, .post article h4 {
    line-height: 1.3;
    margin-top: 1.8em;
}

.post section { scroll-margin-top: 1rem; }
.post article a { overflow-wrap: anywhere; }
.post #TOC { margin: 2rem 0; }
.post #TOC h2 { font-size: 1.1rem; }
.post #TOC ul { padding-left: 1.4rem; }

.post code {
    font-family: ui-monospace, "Cascadia Code", Consolas, monospace;
    font-size: 0.85em;
}

.post pre {
    max-width: 100%;
    box-sizing: border-box;
    overflow-x: auto;
    /* Let the custom scrollbar below take precedence over overlay styling. */
    scrollbar-color: auto;
    scrollbar-width: auto;
    padding: 1rem;
    background: #1d1d1d;
    border: 1px solid #333;
    line-height: 1.5;
}

.post pre code { white-space: pre; overflow-wrap: normal; }
.post div.sourceCode { margin: 1em 0; overflow: hidden; }

.post pre::-webkit-scrollbar { height: 0.75rem; }
.post pre::-webkit-scrollbar-track { background: #1d1d1d; }
.post pre::-webkit-scrollbar-thumb {
    background: #888;
    border: 2px solid #1d1d1d;
    border-radius: 0.375rem;
}

/* Firefox uses the standard scrollbar styling properties. */
@supports not selector(::-webkit-scrollbar) {
    .post pre { scrollbar-color: #888 #1d1d1d; }
}

.post img, .post svg { max-width: 100%; height: auto; }
.post table {
    width: 100%;
    max-width: 100%;
    table-layout: fixed;
    margin: 1em 0;
    border-collapse: collapse;
    line-height: 1.4;
}

.post th, .post td {
    overflow-wrap: anywhere;
    padding: 0.25rem 0.45rem;
    border: 1px solid #555;
    vertical-align: top;
}

.post th {
    text-align: center;
    background: #2c2c2c;
}

.post td { background: #191919; }
.post caption { text-align: left; margin-bottom: 0.6rem; color: #888; }
.post blockquote { margin-left: 0; padding-left: 1rem; border-left: 2px solid #888; }