@font-face {
    font-family: "GolosUIWebRegular";
    src: url("/dist/fonts/Golos-UI_Regular.woff2") format("woff2"),
        url("/dist/fonts/Golos-UI_Regular.woff") format("woff");
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: "Pixel";
    src: url("/dist/fonts/Pixel.ttf");
    font-display: swap;
}

@font-face {
    font-family: "Pixe2l";
    src: url("/dist/fonts/PixelDigivolveCyrillicVF.ttf");
    font-display: swap;
}

html,
body {
    font-family: "GolosUIWebRegular", sans-serif !important;
    background: var(--root-bg, var(--color-base-100))
}

.pixel {
    font-family: "Pixe2l", cursive;
}

:root:has(input.theme-controller[value=dark]:checked),
[data-theme=dark] {
--size-field: .20rem;

    --color-primary: #AE445A;
    --color-secondary: #E8BCB9;
    --color-accent: #FFBCD1;
    --color-success: #8ACA49;
    --color-warning: #EDB75A;
    --color-error: #E23232;
    --color-neutral: #415058;
}

.tab {
    --tab-p: 0.5rem;
    --tab-bg: var(--color-primary);
    --tab-border-color: var(--color-primary);
}

.tab:checked,
.tab:is(label:has(:checked)),
.tab:is(.tab-active, [aria-selected=true]) {
    color: var(--color-accent)
}