:root {
    color-scheme: dark;
}

body {
    max-width: 72ch;
    margin: 2rem auto;
    padding: 0 1rem;
    font-family: system-ui, sans-serif;
    color: #c9d1d9;
    background: #181818;
}

a { color: #89a6ff; }
a:visited { color: #f690ff; }

img {
    max-width: 100%;
    height: auto;
}

figure img {
    width: 50%;
}

.home-header {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: 1.25rem;
    margin-bottom: 2rem;
}

.profile {
    width: 10rem;
    height: auto;
}

.home-header h1 {
    margin: 0;
}

.social-links {
    margin-bottom: 0;
}

.posts, .projects ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

body > header {
    margin-bottom: 2rem;
}

body > header h1 {
    margin-bottom: 0;
}

.site-name {
    font-weight: bold;
}

.published {
    margin: 0.25rem 0.2em 0.2em;
    font-size: 90%;
}

body > footer {
    margin-top: 3rem;
    padding-top: 1rem;
    border-top: 1px solid;
}

pre {
    margin: 1.2em 0;
    padding: 8pt;
    overflow-x: auto;
    font-family: monospace;
    background: #1e1e1e;
    border: 1px solid gray;
    border-radius: 3px;
}

/* pandoc's syntax highlighting classes */
code span.kw, code span.cf, code span.bu { color: #ff7b72; font-weight: bold; }
code span.st, code span.ss, code span.vs, code span.ch { color: #a5d6ff; }
code span.co, code span.do, code span.cv { color: #8b949e; }
code span.fu, code span.va { color: #d2a8ff; }
code span.dt, code span.cn, code span.dv, code span.fl, code span.bn { color: #79c0ff; }