@import url('InterFont/Inter.css');
@import url('MiSans/MiSans.css');
@import "tailwindcss";

@theme {
    --color-surface-container-high: #f7e4e1;
    --color-on-surface-variant: #534341;
    --color-dark-on-surface-variant: #d8c2be;
    --color-dark-surface-container-high: #322826;
    --color-dark-container: #271d1c;
    --color-container: #fceae7;
    --color-on-surface: #231918;
    --color-dark-on-surface: #f1dfdc;
    --color-surface: #fff8f6;
    --color-dark-surface: #1a1110;
    --color-primary: #904b40;
    --color-dark-primary: #ffb2b7;
}

a {
    @apply text-primary dark:text-dark-primary;
}


:root {
    font-family: "MiSans", "Inter", sans-serif;
    font-weight: 400;
    @apply bg-surface dark:bg-dark-surface text-on-surface dark:text-dark-on-surface
}

@supports (font-variation-settings: normal) {
    :root {
        font-family: "InterVariable", "MiSans VF", sans-serif;
        font-optical-sizing: auto;
        font-weight: 330;
    }
}