:root {
    --font-family: "Fira Sans", sans-serif;
    --font-family-mono: "Fira Mono", serif;
}

@font-face {
    font-family: "Fira Sans";
    src:
        local("Fira Sans"),
        url("/assets/font/FiraSans/FiraSans-Heavy.otf") format("opentype")
            tech(color-COLRv1),
        url("/assets/font/FiraSans/FiraSans-Heavy.otf") format("opentype"),
        url("/assets/font/FiraSans/FiraSans-Heavy.woff") format("woff"),
        url("/assets/font/FiraSans/FiraSans-Heavy.woff2") format("woff2"),
        url("/assets/font/FiraSans/FiraSans-Heavy.ttf");
}

@font-face {
    font-family: "Fira Sans";
    src:
        local("Fira Sans Bold"),
        url("/assets/font/FiraSans/FiraSans-Bold.otf") format("opentype")
            tech(color-COLRv1),
        url("/assets/font/FiraSans/FiraSans-Bold.otf") format("opentype"),
        url("/assets/font/FiraSans/FiraSans-Bold.woff") format("woff"),
        url("/assets/font/FiraSans/FiraSans-Bold.woff2") format("woff2"),
        url("/assets/font/FiraSans/FiraSans-Bold.ttf");
    font-weight: bold;
}

@font-face {
    font-family: "Fira Sans";
    font-weight: light;
    src:
        local("Fira Sans Book"),
        url("/assets/font/FiraSans/FiraSans-Book.otf") format("opentype")
            tech(color-COLRv1),
        url("/assets/font/FiraSans/FiraSans-Book.otf") format("opentype"),
        url("/assets/font/FiraSans/FiraSans-Book.woff") format("woff"),
        url("/assets/font/FiraSans/FiraSans-Book.woff2") format("woff2"),
        url("/assets/font/FiraSans/FiraSans-Book.ttf");
}

body {
    font-family: var(--font-family);
    font-size: 16px;
}
h1,
h2,
h3,
h4,
h5,
h6 {
    margin: 1rem 0 0.25rem;
    font-weight: bold;
}

h2 {
    font-size: 1.3em;
}
h4,
h5,
h6 {
    margin: 0 0;
}

[template-type="front"] h1 {
    font-size: 48px;
}
h1 {
    font-weight: bold;
    font-size: 32px;
    margin: 0 0;
}

h1,
h2,
h3 {
    line-height: 125%;
}

header.sm h2 {
    font-weight: normal;
}

article header h2 {
    font-weight: normal;
}

article blockquote {
    margin-left: 0px;
    font-size: 16px;
    font-style: italic;
    margin-right: 0;
}

article blockquote p:before,
article blockquote:not(:has(cite)) p:after,
article blockquote cite:before {
    content: '"';
    color: var(--accent);
    font-weight: bold;
}

article blockquote cite {
    font-size: 10px;
    display: block;
}

p:has(> cite) {
    margin-top: -8px;
}

h3 {
}
article {
    line-height: 1.5;
}
li p {
    margin: 0 0;
}
article h2,
article h3,
article h4,
article h5 {
    margin-top: 0.5rem;
}
a,
a[visited] {
    color: var(--accent);
}
a p,
a figcaption {
    color: var(--text);
}
ul {
    padding-left: 2ch;
}

figure {
    margin: 2rem 0;
}

sup figure {
    margin: 1rem 0;
}

article img {
    max-width: 100%;
}

ins {
    font-family: var(--font-family-mono);
    text-decoration: none;
    font-size: 70%;
    background: color-mix(in srgb, LawnGreen 15%, transparent);
    padding: 4px;
    vertical-align: middle;
    display: inline-block;
    clear: both;
}
ins p {
    display: inline;
}
sup li,
li[count] {
    list-style: none;
}
ins::before {
    content: "+ ";
    color: LawnGreen;
    font-weight: bold;
}
[template-type="front"] h2 {
    font-size: 20px;
    font-style: italic;
    font-weight: light;
}
sup:has(li),
article li[count],
figcaption,
aside:not(aside aside),
.footnote {
    font-family: var(--font-family-mono);
    font-size: 9px;
    line-height: 1.5;
}

figcaption {
    line-height: 1.1;
}

.footnote-ref {
    line-height: 0;
    text-decoration: none;
    pointer-events: none;
}

.csl-entry {
    margin-top: 1rem;
}

sup li p,
article li:has(.footnote-back) p {
    margin-top: 0;
    margin-bottom: 8px;
    font-weight: normal;
}

aside hr {
    display: none;
}

p {
    break-inside: avoid;
    margin-top: 0;
    text-wrap: pretty;
}

td,
th {
    text-align: left;
    word-break: keep-all;
}

article ol {
    padding-left: 2ch;
    margin-top: 0.5em;
    margin-bottom: 0.5em;
}

h1 + ul,
h2 + ul,
h3 + ul,
h4 + ul,
h5 + ul,
h6 + ul,
h7 + ul {
    margin-top: 0;
}

/*** Works on common browsers ***/
::selection {
    background-color: var(--accent);
    color: black;
}

/*** Mozilla based browsers ***/
::-moz-selection {
    background-color: var(--accent);
    color: black;
}

/***For Other Browsers ***/
::-o-selection {
    background-color: var(--accent);
    color: black;
}

::-ms-selection {
    background-color: var(--accent);
    color: black;
}

/*** For Webkit ***/
::-webkit-selection {
    background-color: var(--accent);
    color: black;
}

note {
    display: block;
    background: lightgrey;
    font-weight: normal;
    color: black;
    font-family: monospace;
    padding: 0.5em;
}