:root {
    --paper: #eee9df;
    --paper-light: #f7f3eb;
    --paper-deep: #d8d0c1;
    --ink: #273329;
    --forest: #334235;
    --olive: #566249;
    --moss: #788362;
    --lime: #c6cf9b;
    --line: rgba(39, 51, 41, 0.34);
    --display: "Bahnschrift Condensed", "Arial Narrow", Impact, sans-serif;
    --body: "Bahnschrift", "Segoe UI", Arial, sans-serif;
    --pixel: "Cascadia Mono", "Lucida Console", Consolas, monospace;
}

html {
    scroll-behavior: smooth;
    background: var(--paper);
}

html.disclaimer-open,
html.disclaimer-open body {
    overflow: hidden;
}

[hidden] {
    display: none !important;
}

* {
    box-sizing: border-box;
}

body {
    min-width: 320px;
    margin: 0;
    color: var(--ink);
    background:
        radial-gradient(circle at 12% 8%, rgba(255, 255, 255, 0.72), transparent 26rem),
        radial-gradient(circle at 84% 40%, rgba(86, 98, 73, 0.08), transparent 34rem),
        var(--paper);
    font-family: var(--body);
    -webkit-font-smoothing: antialiased;
}

body::before {
    position: fixed;
    z-index: 20;
    inset: 0;
    opacity: 0.16;
    pointer-events: none;
    content: "";
    background-image:
        repeating-radial-gradient(circle at 22% 31%, transparent 0 2px, rgba(51, 66, 53, 0.14) 2.5px 3px),
        repeating-linear-gradient(91deg, transparent 0 7px, rgba(255, 255, 255, 0.28) 8px 9px);
    background-size: 17px 19px, 31px 29px;
    mix-blend-mode: multiply;
}

a {
    color: inherit;
}

button,
a,
summary {
    -webkit-tap-highlight-color: transparent;
}

:focus-visible {
    outline: 3px solid var(--ink);
    outline-offset: 4px;
}

::selection {
    color: var(--paper-light);
    background: var(--forest);
}

.blazor-error-boundary {
    padding: 1rem;
    color: #fff;
    background: #8d2f2f;
}

.blazor-error-boundary::after {
    content: "Ein unerwarteter Fehler ist aufgetreten.";
}

@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }

    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}