/*
 * public/assets/frontend/css/fonts.css
 * Regista as fontes variáveis locais Rubik e Saira e define a base
 * tipográfica das áreas públicas, autenticação, jogador e jogo.
 */

@font-face {
    font-family: "Rubik";
    src: url("../../../fonts/rubik-variable.woff2") format("woff2");
    font-style: normal;
    font-weight: 300 900;
    font-display: swap;
}

@font-face {
    font-family: "Rubik";
    src: url("../../../fonts/rubik-italic-variable.woff2") format("woff2");
    font-style: italic;
    font-weight: 300 900;
    font-display: swap;
}

@font-face {
    font-family: "Saira";
    src: url("../../../fonts/saira-variable.woff2") format("woff2");
    font-style: normal;
    font-weight: 100 900;
    font-stretch: 50% 125%;
    font-display: swap;
}

@font-face {
    font-family: "Saira";
    src: url("../../../fonts/saira-italic-variable.woff2") format("woff2");
    font-style: italic;
    font-weight: 100 900;
    font-stretch: 50% 125%;
    font-display: swap;
}

:root {
    --font-body: "Rubik", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    --font-game: "Saira", "Rubik", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

body {
    font-family: var(--font-body);
}

button,
input,
select,
textarea {
    font-family: inherit;
}

.font-game {
    font-family: var(--font-game);
}