/* html * { outline: 0.1px solid gray } */

html {
    color: rgb(0 0 204);
    background-color: rgb(248 248 248);
    font-family: "Baskerville", Georgia, serif;
    font-size: 20px;
    line-height: 130%;
    text-shadow: 0 0 0.6px currentColor, 0 0 0.5px currentColor;

    overflow-wrap: break-word;
    font-kerning: normal;
    -webkit-text-size-adjust: 100%;
}

@media (prefers-color-scheme: dark) {
    html {
        color: rgb(187 187 255);
        background-color: #000000;
    }
}

body {
    margin: 0;
}








header { text-align: center; }
header a {
    display: inline-block;
    padding: 40px 0;
}

body > header,
body > footer,
body > h1,
body > h2,
body > p,
body > ul,
body > ol,
body > figure figcaption {
    box-sizing: border-box;
    max-width: 640px;
    margin-left: auto;
    margin-right: auto;
    padding: 0 16px;
}

footer { text-align: center; }
footer a {
    display: inline-block;
    padding: 113px 0;
}






h1 {
    margin: 0;
    font-size: 26px;
    line-height: 150%;
    font-weight: 500;
    text-align: center;

    break-inside: avoid;
    break-after: avoid;
    text-rendering: optimizeLegibility;
}

h2 {
    margin: 0;
    font-size: inherit;
    line-height: inherit;
    font-weight: 600;

    break-inside: avoid;
    break-after: avoid;
    text-rendering: optimizeLegibility;
}

p {
    margin: 0;
    font-weight: 400;

    orphans: 3;
    widows: 3;
}

ul, ol {
    margin: 0;
    padding-left: 40px;
}
body > ul, body > ol { padding-left: 36px; }

figure {
    margin: 0;
    break-inside: avoid;
}
figure img {
    display: block;
    margin: 0 auto;
    border-radius: 2px;
}
figure figcaption {
    font-size: 16px;
    line-height: 117%;
    font-weight: 400;
    text-align: center;
    font-style: italic;
}

video {
    display: block;
    margin: 0 auto;
    border-radius: 2px;
    width: min(100vw, calc((16 / 9) * 62vh));
    aspect-ratio: 16 / 9;
}

hr {
    margin: 0;
    border: 0;
}










header + * { margin-top: 0 !important; }
header + h1 { margin-top: -11px; }

h1, h2 { margin-top: 58px; }

p { margin-top: 15px;  }
h1 + p, h2 + p { margin-top: 9px; }

ul, ol { margin-top: 15px; }
li + li { margin-top: 8px; }
li > p:last-child { margin-bottom: 21px; }

figure { margin-top: 33px; }
figure figcaption { margin-top: 13px; }
figure + * { margin-top: 30px !important; }

video { margin-top: 33px; }
video + * { margin-top: 30px !important; }

hr { margin-top: 62px; }









a {
    color: inherit;
    text-decoration-thickness: 1px;
    text-underline-offset: 2px;
}

@supports (font: -apple-system-body) {
    a { text-decoration-thickness: 0.5px; }
}
