/* Light theme */
:root {
    --bg: #f2f2f2;
    --surface: #e6e6e6;
    --surface-code: #fbfbfb;
    --text: #353535;
    --muted: #666;
    --accent: #bb44a7;
    --border: #736b5e;
}
/* Dark theme, when we go off of browser preferences */
@media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]) {
        --bg: #181a1b;
        --surface: #1f2123;
        --surface-code: #1f2123;
        --text: #dddbd5;
        --muted: #a39d93;
        --accent: #d04dba;
        --border: #736b5e;
    }
}
/* Dark theme, when explicitly set by the user */
:root[data-theme="dark"] {
    --bg: #181a1b;
    --surface: #1f2123;
    --surface-code: #1f2123;
    --text: #dddbd5;
    --muted: #a39d93;
    --accent: #d04dba;
    --border: #736b5e;
}
* {
    box-sizing: border-box;
    margin-top: 0;
    margin-bottom: 0;
    margin-left: 0;
    margin-right: 0;
    padding-top: 0;
    padding-bottom: 0;
    padding-left: 0;
    padding-right: 0;
}
body {
    font-family:
        "PT Sans",
        -apple-system,
        sans-serif;
    background: var(--bg);
    color: var(--text);
    line-height: 1.5;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}
a {
    color: var(--accent);
    text-decoration: none;
}
a:hover {
    text-decoration: underline;
}
nav {
    background: var(--surface);
    border-bottom: 1px solid var(--border);
    padding-left: 1rem;
    padding-right: 1rem;
}
nav .nav-inner {
    max-width: 1024px;
    margin-top: 0;
    margin-bottom: 0;
    margin-left: auto;
    margin-right: auto;
    padding-top: 1rem;
    padding-bottom: 1rem;
    padding-left: 0;
    padding-right: 0;
    display: flex;
    align-items: center;
}
nav .site-title {
    font-size: 1.3rem;
    font-weight: bold;
    margin-right: auto;
}
nav .nav-links {
    display: flex;
    align-items: center;
}
nav .nav-links > a {
    margin-left: 1.5rem;
}
nav .nav-feeds {
    margin-left: 1.5rem;
    color: var(--muted);
}
nav .nav-feeds .title {
    margin-right: 0.5rem;
}
nav .nav-feeds a {
    margin-left: 0;
}
nav .nav-sep {
    margin-top: 0;
    margin-bottom: 0;
    margin-left: 0.25rem;
    margin-right: 0.25rem;
}
nav .nav-theme {
    display: flex;
    align-items: center;
    margin-left: 1rem;
}
nav .theme-toggle {
    margin-left: 0;
    background: none;
    border: none;
    cursor: pointer;
    font-size: 1.25rem;
    padding-top: 0;
    padding-bottom: 0;
    padding-left: 0;
    padding-right: 0;
    line-height: 1;
    min-width: 32px;
    min-height: 32px;
}
nav .theme-reset {
    background: none;
    border: none;
    cursor: pointer;
    font-size: 1.25rem;
    padding-top: 0;
    padding-bottom: 0;
    padding-left: 0;
    padding-right: 0;
    line-height: 1;
    min-width: 32px;
    min-height: 32px;
}
main {
    flex: 1;
    max-width: calc(1024px + 2rem);
    width: 100%;
    margin-top: 0;
    margin-bottom: 0;
    margin-left: auto;
    margin-right: auto;
    padding-top: 1rem;
    padding-bottom: 1rem;
    padding-left: 1rem;
    padding-right: 1rem;
}
article {
    padding-bottom: 1rem;
}
article h1 {
    font-size: 2rem;
    margin-top: 1.5rem;
    margin-bottom: 0.5rem;
    margin-left: 0;
    margin-right: 0;
}
article h1:first-child {
    margin-top: 1rem;
}
article h2 {
    font-size: 1.75rem;
    margin-top: 1.5rem;
    margin-bottom: 0.5rem;
    margin-left: 0;
    margin-right: 0;
}
.adjacent-posts {
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
}
.adjacent-posts h3 {
    font-size: 1.5rem;
    margin-top: 1rem;
    margin-bottom: 0.5rem;
    margin-left: 0;
    margin-right: 0;
}
.adjacent-posts p {
    margin-top: 1rem;
    margin-bottom: 1rem;
    margin-left: 0;
    margin-right: 0;
}
.adjacent-posts p span {
    display: inline-block;
    width: 64px;
}
article h3 {
    font-size: 1.5rem;
    margin-top: 1rem;
    margin-bottom: 0.5rem;
    margin-left: 0;
    margin-right: 0;
}
article h4 {
    font-size: 1.25rem;
    margin-top: 1rem;
    margin-bottom: 0.5rem;
    margin-left: 0;
    margin-right: 0;
}
article h5 {
    font-size: 1rem;
    margin-top: 1rem;
    margin-bottom: 0.5rem;
    margin-left: 0;
    margin-right: 0;
}
article h6 {
    font-size: 1rem;
    margin-top: 1rem;
    margin-bottom: 0.5rem;
    margin-left: 0;
    margin-right: 0;
}
article p {
    margin-top: 1rem;
    margin-bottom: 1rem;
    margin-left: 0;
    margin-right: 0;
}
article img {
    max-width: 100%;
    height: auto;
    border-radius: 4px;
    margin-top: 1rem;
    margin-bottom: 1rem;
    margin-left: auto;
    margin-right: auto;
    display: block;
}
article video {
    max-width: 100%;
    border-radius: 4px;
    display: block;
    margin-top: 1rem;
    margin-bottom: 1rem;
    margin-left: auto;
    margin-right: auto;
}
article table {
    border-collapse: collapse;
    width: 100%;
    margin-top: 1rem;
    margin-bottom: 1rem;
    margin-left: 0;
    margin-right: 0;
    border: 1px solid #353535;
    background: var(--surface-code);
}
article th,
article td {
    border: 1px solid var(--border);
    padding-top: 0.125rem;
    padding-bottom: 0.125rem;
    padding-left: 0.25rem;
    padding-right: 0.25rem;
}
article pre {
    background: var(--surface-code);
    border: 1px solid var(--border);
    padding-top: 1rem;
    padding-bottom: 1rem;
    padding-left: 1rem;
    padding-right: 1rem;
    border-radius: 4px;
    overflow-x: auto;
    margin-top: 1rem;
    margin-bottom: 1rem;
    margin-left: 0;
    margin-right: 0;
    white-space: pre-wrap;
    word-wrap: break-word;
    font-family: "PT Mono", monospace;
    font-size: 0.875rem;
}
article code {
    font-family: "PT Mono", monospace;
    font-size: 0.875rem;
    word-break: break-word;
}
article pre code {
    font-size: inherit;
}
article blockquote {
    border-left: 3px solid var(--border);
    padding-left: 1rem;
    margin-top: 1rem;
    margin-bottom: 1rem;
    margin-left: 0;
    margin-right: 0;
}
article ul,
article ol {
    margin-top: 0.5rem;
    margin-bottom: 0.5rem;
    margin-left: 2rem;
    margin-right: 0;
}
article li {
    margin-top: 0.3rem;
    margin-bottom: 0.3rem;
    margin-left: 0;
    margin-right: 0;
}
article .post-date {
    color: var(--muted);
}
.post-list .post-list-item {
    padding-top: 1rem;
    padding-bottom: 1rem;
    padding-left: 0;
    padding-right: 0;
    border-bottom: 1px solid var(--border);
}
.post-list .post-list-item:first-child {
    padding-top: 0.5rem;
}
.post-list .post-list-item:last-child {
    border-bottom: none;
    padding-bottom: 0.5rem;
}
.post-list .post-list-item h2 {
    margin-top: 0;
    margin-bottom: 0;
    margin-left: 0;
    margin-right: 0;
    font-size: 1.2rem;
}
.post-list .post-list-item .date {
    color: var(--muted);
}
.pagination {
    display: flex;
    justify-content: center;
    gap: 0.5rem;
    margin-top: 2rem;
    margin-bottom: 2rem;
    margin-left: 0;
    margin-right: 0;
}
.pagination a,
.pagination span {
    padding-top: 0.4rem;
    padding-bottom: 0.4rem;
    padding-left: 0.8rem;
    padding-right: 0.8rem;
    background: var(--surface);
    border-radius: 4px;
}
.pagination span.current {
    background: var(--accent);
    color: #fff;
}
.intro {
    margin-top: 1rem;
    margin-bottom: 2rem;
}
.intro h1 {
    font-size: 2rem;
}
.intro p {
    margin-top: 1rem;
    margin-bottom: 1rem;
    margin-left: 0;
    margin-right: 0;
}
.intro a {
    color: var(--accent);
}
hr {
    border: none;
    border-top: 1px solid var(--border);
    margin-top: 0;
    margin-bottom: 0;
    margin-left: 0;
    margin-right: 0;
}
footer {
    border-top: 1px solid var(--border);
    padding-bottom: 2rem;
    padding-left: 1rem;
    padding-right: 1rem;
    background: var(--surface);
}
footer p {
    margin-top: 1rem;
}
footer .footer-inner {
    padding-top: 1rem;
    padding-left: 0;
    padding-right: 0;
    max-width: 1024px;
    margin-top: 0;
    margin-bottom: 0;
    margin-left: auto;
    margin-right: auto;
}
footer .copyright {
    margin-top: 1rem;
    text-align: center;
}

@media (max-width: 679px) {
    nav .nav-inner {
        flex-wrap: wrap;
    }
    nav .site-title {
        order: 1;
    }
    nav .nav-theme {
        order: 2;
    }
    nav .nav-links {
        order: 3;
        flex-basis: 100%;
        justify-content: flex-start;
        margin-top: 0.5rem;
    }
    nav .nav-links > a:first-child {
        margin-left: 0;
    }
}

/* ── search ─────────────────────────────────────────────────────────────── */

.search-form {
    display: flex;
    margin-top: 2rem;
    margin-bottom: 2rem;
    margin-left: 0;
    margin-right: 0;
    gap: 0.5rem;
}
.search-form input[type="text"] {
    flex: 1;
    min-width: 0;
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    padding-left: 0.5rem;
    padding-right: 0.5rem;
    border: 1px solid var(--border);
    border-radius: 4px;
    background: var(--surface);
    color: var(--text);
    font-family: inherit;
    font-size: 1rem;
    box-sizing: border-box;
}
.search-form button,
.search-form input[type="submit"] {
    min-width: 96px;
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    padding-left: 1rem;
    padding-right: 1rem;
    background: var(--accent);
    border: none;
    border-radius: 4px;
    color: #fff;
    cursor: pointer;
    font-family: inherit;
    font-size: 1rem;
    white-space: nowrap;
}
.search-page {
    margin-bottom: 0.5rem;
}
.search-page h1 {
    margin-top: 1rem;
    margin-bottom: 0.5rem;
    margin-left: 0;
    margin-right: 0;
}
.search-page .search-summary {
    color: var(--muted);
    margin-top: 0;
    margin-bottom: 1rem;
    margin-left: 0;
    margin-right: 0;
}
.search-page .search-result-item {
    padding-top: 1rem;
    padding-bottom: 1rem;
    padding-left: 0;
    padding-right: 0;
    border-bottom: 1px solid var(--border);
}
.search-page .search-result-item:last-child {
    border-bottom: none;
}
.search-page .search-result-item h2 {
    margin-top: 0;
    margin-bottom: 0;
    margin-left: 0;
    margin-right: 0;
    font-size: 1.2rem;
}
.search-page .search-result-item .date {
    color: var(--muted);
}
.search-page .search-result-item .excerpt {
    margin-top: 0.5rem;
    line-height: 1.5;
}
.search-page b {
    color: var(--accent);
}
.search-page .no-results {
    text-align: center;
    padding-top: 3rem;
    padding-bottom: 3rem;
    padding-left: 3rem;
    padding-right: 3rem;
    color: var(--muted);
}

/* ── 404 ────────────────────────────────────────────────────────────────── */

.not-found h1 {
    margin-top: 1rem;
    margin-bottom: 0.5rem;
}
.not-found p {
    margin-top: 1rem;
    margin-bottom: 1rem;
}