@font-face {
    font-family: "MaruMinya";
    src: url("maruminya.woff2") format("woff2");
    font-display: swap;
}

:root {
    --color-primary: #f5f0e8;
    --color-secondary: #8b1a1a;
    --color-accent: #c44040;
    --bg-primary: #2a0505;
    --bg-secondary: #5c0a0a;
    --text-primary: #f5f0e8;
    --text-secondary: #8a8070;
    --text-accent: #c44040;
    --header-primary: #c44040;
    --header-secondary: #8b1a1a;
    --header-tertiary: #e8e0d0;
    --header-other: #f5f0e8;
    --link-color: #c44040;
    --link-hover: #f5f0e8;
    --border-primary: #5c0a0a;
    --border-secondary: #2a0505;
    --border-image: #5c0a0a;
    --header-bg: #e8e0d0;
    --header-text: #1a1a1a;
    --font-headers: MaruMinya, monospace;
    --font-body: MaruMinya, monospace;
    --na-outline: 1px 0 0 #5c0a0a, -1px 0 0 #5c0a0a, 0 1px 0 #5c0a0a, 0 -1px 0 #5c0a0a;
}

body { background: #2a0505; }
.na-banner { image-rendering: pixelated; }

header h1 .headerLink, article h1, article h2 { font-family: MaruMinya, monospace; }

article { text-align: center; line-height: 1.8; }

.na-banner {
    margin: 0 -1vw 2em;
    padding: 2.5em 1em 2em;
    background:
        radial-gradient(ellipse 55% 38% at 50% 70%, rgba(42, 5, 5, .8) 0%, rgba(42, 5, 5, .55) 45%, rgba(42, 5, 5, 0) 100%),
        url("header-dither.png") center / 960px 320px no-repeat,
        #2a0505;
    border-bottom: 1px solid #5c0a0a;
}
.na-banner .sigil { display: block; margin-bottom: 1.2em; font-size: 2rem; color: #f5f0e8; text-shadow: var(--na-outline), 2px 2px 0 #5c0a0a; }
.na-banner h1 { margin: 0; font-size: 1.6rem; font-weight: normal; letter-spacing: .3em; text-transform: uppercase; color: #f5f0e8; text-shadow: var(--na-outline), 2px 2px 0 #5c0a0a; }
.na-banner .subtitle { font-size: .8rem; letter-spacing: .15em; color: #e8e0d0; text-shadow: var(--na-outline), 1px 1px 0 #5c0a0a; }

.star-quote { font-style: italic; color: #c44040; }
.star-quote::before, .star-quote::after { content: " \2022 "; color: #8b1a1a; }
