* {
    box-sizing: border-box;
}
html, body {
    color-scheme: light dark;
    font: menu;
}
h1 {
    font-size: larger;
}
h2 {
    font-size: smaller;
}
a:any-link {
    color: highlight;
}
ul, ol {
    padding-inline-start: 2em;
}
footer {
    font-size: smaller;
    opacity: .6;
}
:is([data-state="loading"], [data-state="error"]) footer {
    display: none;
}
[data-state="loaded"] footer {
    display: block;
}
[data-state="error"] main {
    display: flex;
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    text-align: center;
    justify-content: center;
    align-items: center;
}
