/* --- Atkinson Hyperlegible Next (proportional) --- */
@font-face {
    font-family: "Atkinson Hyperlegible Next";
    src: url("/fonts/AtkinsonHyperlegibleNext-Regular.woff2") format("woff2");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: "Atkinson Hyperlegible Next";
    src: url("/fonts/AtkinsonHyperlegibleNext-Bold.woff2") format("woff2");
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: "Atkinson Hyperlegible Next";
    src: url("/fonts/AtkinsonHyperlegibleNext-RegularItalic.woff2") format("woff2");
    font-weight: 400;
    font-style: italic;
    font-display: swap;
}
@font-face {
    font-family: "Atkinson Hyperlegible Next";
    src: url("/fonts/AtkinsonHyperlegibleNext-BoldItalic.woff2") format("woff2");
    font-weight: 700;
    font-style: italic;
    font-display: swap;
}

/* --- Atkinson Hyperlegible Mono (fixed-width) --- */
@font-face {
    font-family: "Atkinson Hyperlegible Mono";
    src: url("/fonts/AtkinsonHyperlegibleMono-Regular.woff2") format("woff2");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: "Atkinson Hyperlegible Mono";
    src: url("/fonts/AtkinsonHyperlegibleMono-Bold.woff2") format("woff2");
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: "Atkinson Hyperlegible Mono";
    src: url("/fonts/AtkinsonHyperlegibleMono-RegularItalic.woff2") format("woff2");
    font-weight: 400;
    font-style: italic;
    font-display: swap;
}
@font-face {
    font-family: "Atkinson Hyperlegible Mono";
    src: url("/fonts/AtkinsonHyperlegibleMono-BoldItalic.woff2") format("woff2");
    font-weight: 700;
    font-style: italic;
    font-display: swap;
}

:root {
    --bg: #000000;
    --structure: #221100; /* borders, dividers, faint rules      */
    --body: #FF8000; /* default text                        */
    --emphasis: #FFCC00; /* <strong>, <em>, inline <code>       */
    --link: #FFFF00; /* unvisited links                     */
    --visited: #FFBB00; /* visited links                       */
    --success: #AACC00; /* <ins>, positive semantics           */
    --error: #FF2200; /* <del>, <mark> alert-like uses       */
    --selection-bg: #663300;
}

body {
    margin: 0 auto;
    padding: 10vh 10vw 10vh 10vw;
    max-width: 70rem;
    background: var(--bg);
    color: var(--body);
    font-family: "Atkinson Hyperlegible Next", system-ui, sans-serif;
}

code, pre, kbd, samp {
    font-family: "Atkinson Hyperlegible Mono", monospace;
}


a          { color: var(--link);    text-decoration: underline; text-underline-offset: 0.15em; }
a:visited  { color: var(--visited); }
a:hover    { text-decoration-thickness: 2px; }
a:focus    { outline: 1px dashed var(--link); outline-offset: 2px; }
a:active   { color: var(--emphasis); }


hr {
    height: 0.25rem;
    background-color: var(--body);
    border-style: none;
}

blockquote {
    border-width: 0.25rem;
    border-style: none none none solid;
    margin: 2rem;
    padding-left: 0.5rem;
}