@font-face {
    src: url("atkinson_hyperlegible_mono.ttf");
    font-family: AtkinsonHyperlegibleMono;
}

html {
    width: 100vw;
    overflow-x: hidden;
}

body {
    background: url("bg_repeat.png"), #651f82;
    background-repeat: repeat;
    background-size: 2.5rem;
    color: #eaeaea;
    font-family: AtkinsonHyperlegibleMono;
    text-align: center;
    font-size: 16px;
    display: flex;
    justify-content: center;
}

summary {
    font-size: 2rem;
    font-weight: 500;
    user-select: none;
    cursor: pointer;
}

p, li, a { font-size: 1.5rem; }
p, li { text-align: left; color: #d1d1d1; }
a { color: #40baff; }

summary::marker { font-size: 1rem; content: ". "; }
summary::after { font-size: 1rem; content: " ."; }

details:open summary::marker { content: "! "; }
details:open summary::after { content: " !"; }

.big { font-size: 4.5rem; }
.content { width: 820px; scrollbar-gutter: stable; }

.green { color: #0fdf0f; }
.yellow { color: #efdf0f; }
.red { color: #df0f0f; }
.cyan { color: #00dfdf; }
.darkgray { color: #858585; }