@font-face {
    font-family: "Cascadia Mono";
    font-style: normal;
    font-weight: 400;
    src: url("/fonts/CascadiaMono/CascadiaMono-Regular.ttf"), local("ttf");
    font-display: swap;
}

@font-face {
    font-family: "Cascadia Mono";
    font-style: normal;
    font-weight: 700;
    src: url("/fonts/CascadiaMono/CascadiaMono-Bold.ttf"), local("ttf");
    font-display: swap;
}

@font-face {
    font-family: "Recursive Casual";
    font-style: normal;
    font-weight: 400;
    src: url("/fonts/Recursive/Recursive_Casual-Regular.ttf"), local("ttf");
    font-display: swap;
    font-variation-settings: "MONO" var(--cm-mono), "CASL" var(--cm-casl), "wght" var(--cm-wght), "slnt" var(--cm-slnt), "CRSV" var(--cm-crsv);
}

@font-face {
    font-family: "Recursive Casual";
    font-style: normal;
    font-weight: 700;
    src: url("/fonts/Recursive/Recursive_Casual-Black.ttf"), local("ttf");
    font-display: swap;
    font-variation-settings: "MONO" var(--cm-mono), "CASL" var(--cm-casl), "wght" var(--cm-wght), "slnt" var(--cm-slnt), "CRSV" var(--cm-crsv);
}

@font-face {
    font-family: "Recursive";
    src: url("/fonts/Recursive/Recursive-Regular.ttf"), format("ttf");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Recursive";
    src: url("/fonts/Recursive/Recursive-Bold.ttf"), format("ttf");
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

:root {
    --font-size-base: 16px;
    --mono-text-font: "Cascadia Mono";
    --text-font: "Recursive";
    --header-font: "Recursive Casual", "Recursive", sans-serif;
    --code-font: "Cascadia Mono";
}

:root.dark {
    --text-0: #F9F5D7;
    --text-1: #D5C4A1;
    --text-2: #928374;
    --bg-0: #141413;
    --bg-1: #1D2021;
    --bg-2: #282828;
    --border-color: var(--bg-2);
    --primary-color: #56bc6f;
    --hover-color: #1D2021;
}

:root.light {
    --text-0: #1A1A1A;
    --text-1: #3A3A3A;
    --text-2: #A89984;
    --bg-0: #fff;
    --bg-1: #fafafa;
    --bg-2: #ededed;
    --border-color: var(--bg-2);
    --primary-color: #AF3A03;
    --hover-color: #F9F5D7;
}

h1, h2, h3, h4, h5, h6 {
    -webkit-user-select: none; /* Safari */
    user-select: none;
}