@import url("https://cdn.jsdelivr.net/npm/galmuri/dist/galmuri.css");

html {
    overflow-y: scroll;
}

:root {
    --bgcolor: white;
    --fontcolor: #444;
    --linkcolor: #00e;
    --visitedcolor: #551a8b;
    --precolor: #fff;
    --prebgcolor: #000;
}

@media (prefers-color-scheme: dark) {
    :root {
        --bgcolor: black;
        --fontcolor: white;
        --linkcolor: #5bf;
        --visitedcolor: #ae5ee0;
        --precolor: #fff;
        --prebgcolor: #383838;
    }
}

body {
    max-width: 960px;
    margin: 40px auto;
    padding: 0 10px;
    color: var(--fontcolor);
    background: var(--bgcolor);
}

a:link {
    color: var(--linkcolor);
}

a:visited {
    color: var(--visitedcolor);
}

a:active {
    color: var(--visitedcolor);
}

h1,
h2,
h3 {
    line-height: 1.2;
}

p > code {
    color: var(--precolor);
    background: var(--prebgcolor);
    padding: 2px;
}

code.codeblock {
    font-family: "Iosevka SS14", "Iosevka", "JetBrains Mono", monospace;
    font-size: 16px;
}

pre {
    /*background: var(--prebgcolor);*/
    overflow-x: auto;
    margin-bottom: 0;
}

pre.codeblock {
    /* looks like shit */
    /*white-space: pre-wrap;*/
}

article {
    padding: 24px 0;
}

.center {
    display: block;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
}

figcaption {
    color: #888;
    font: 12px/1.5 monospace;
    text-align: center;
}

figure {
    margin: auto;
}
img {
    display: block;
    max-width: 100%;
    height: auto;
    margin: auto;
}

h1 {
    font-size: 200%;
}

h2 {
    font-size: 180%;
}

h3 {
    font-size: 150%;
}

h4 {
    font-size: 130%;
}

td {
    padding-left: 5px;
    padding-right: 5px;
}

blockquote {
    padding-left: 1.25rem;
    padding-right: 1.25rem;
}

blockquote.info {
    border-left: 0.35rem solid #abcdef;
}

blockquote.warning {
    border-left: 0.35rem solid bisque;
}

blockquote.trivia {
    border-left: 0.35rem solid seagreen;
}

blockquote.danger {
    border-left: 0.35rem solid orangered;
}

summary {
    color: var(--linkcolor);
    text-decoration: underline;
    cursor: grab;
}
