:root {
    --cloth: #1f1914;
    --cloth-dark: rgba(16, 13, 10, .55);
    --linen: #ece5d6;
    --linen-bright: #f4eee2;
    --text-soft: #d9d0bd;
    --text-muted: #c9bea8;
    --gold: #b8945c;
    --gold-soft: #d9c79f;
    --seam: #8a7556;
    --patch-ink: #2c2b28;
    --pad: clamp(20px, 5vw, 72px);
    --corner: 10px;
}

* {
    box-sizing: border-box;
}

body {
    margin: 0;
    color: var(--linen);
    font-family: 'PT Sans Narrow', sans-serif;
    background-color: var(--cloth);
    background-image: radial-gradient(ellipse 70% 40% at 50% 0%, rgba(255,186,110,.07), transparent 70%), radial-gradient(ellipse 120% 80% at 50% 50%, transparent 55%, rgba(0,0,0,.35) 100%), repeating-linear-gradient(0deg, rgba(255,240,220,.022) 0 1px, transparent 1px 3px), repeating-linear-gradient(90deg, rgba(0,0,0,.16) 0 1px, transparent 1px 3px);
    background-attachment: fixed;
}

a {
    color: var(--linen);
}

a:hover {
    color: #fff;
}

h1, h2, h3 {
    margin: 0;
    font-family: 'GOST', sans-serif;
    font-weight: 400;
    color: var(--linen-bright);
}

.container {
    max-width: 1280px;
    margin: 0 auto;
    padding-inline: var(--pad);
}

.blazor-error-boundary {
    background: #b32121;
    padding: 1rem;
    color: white;
}

.blazor-error-boundary::after {
    content: "An error has occurred.";
}

.text--lines {
    white-space: pre-line;
}

.lang--switch {
    color: var(--text-muted);
}

h1:focus {
    outline: none;
}