* {
    margin: 0;
}

html, body {
    width: 100%;
    height: 100%;
}

body {
    font-family: -apple-system, BlinkMacSystemFont, sans-serif;
    background-color: #FFFFFF;
    background-image: url("static/img/bg.png");
    background-size: 300px;
    background-position: bottom right;
    background-repeat: no-repeat;
}

.header, .container {
    max-width: 600px;
}

.header {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

img {
    image-rendering: pixelated;
}

section {
    display: none;
}

section:target {
    display: block;
}

section#posts {
    display: block;
}

.container:has(section:target) section#posts:not(:target) {
    display: none;
}

.header, .e:not(:last-child) {
    border-bottom: 1px solid #000;
}

a {
    text-decoration-style: dotted;
}

a:visited {
    color: blue;
}

a[target="_blank"]::after {
    content: " ↗";
    font-size: 0.6em;
    vertical-align: super;
}

.post > * {
    margin-top: 1em;
}

.e p {
    color: gray;
}

code {
    display: block;
    white-space: pre-wrap;
}