.loader:empty {
    animation: load8 1.1s infinite linear;
    border: 0.5em solid rgba(22, 35, 58, 0.12);
    border-left: 0.5em solid #16233a;
    border-radius: 50%;
    height: 3em;
    left: calc(50% - 2em);
    position: absolute;
    top: calc(50% - 2em);
    width: 3em;
}

@keyframes load8 {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}

/* Stejné hexy jako plocha SPA — token `vars.bg.page` v frontend/src/theme/tokens.ts
   (light #f4f7fb, dark dark-8 #141a24 z inkoustové palety v theme/theme.ts), aby pozadí
   při mountu Reactu neskočilo.
   Tento soubor nemůže TS tokeny importovat, hodnoty drž v synchronu ručně. */
body {
    background-color: #f4f7fb;
    font-family: "Segoe UI", Arial, sans-serif;
}

html[data-mantine-color-scheme="dark"] body {
    background-color: #141a24;
}

html[data-mantine-color-scheme="dark"] .loader:empty {
    border-color: rgba(231, 236, 244, 0.12);
    border-left-color: #e7ecf4;
}