:root {
    --primary: rgb(255, 190, 0);
    --secondary: rgb(255, 100, 0);
    --primary-100: color-mix(in lch, var(--primary), white 90%);
    --primary-200: color-mix(in lch, var(--primary), white 80%);
    --primary-300: color-mix(in lch, var(--primary), white 70%);
    --primary-400: color-mix(in lch, var(--primary), white 60%);
    --primary-500: color-mix(in lch, var(--primary), white);
    --primary-600: color-mix(in lch, var(--primary), white 40%);
    --primary-700: color-mix(in lch, var(--primary), white 30%);
    --primary-800: color-mix(in lch, var(--primary), white 20%);
    --primary-900: color-mix(in lch, var(--primary), white 10%);
    --primary-dark-100: color-mix(in lch, var(--primary), black 90%);
    --primary-dark-200: color-mix(in lch, var(--primary), black 80%);
    --primary-dark-300: color-mix(in lch, var(--primary), black 70%);
    --primary-dark-400: color-mix(in lch, var(--primary), black 60%);
    --primary-dark-500: color-mix(in lch, var(--primary), black);
    --primary-dark-600: color-mix(in lch, var(--primary), black 40%);
    --primary-dark-700: color-mix(in lch, var(--primary), black 30%);
    --primary-dark-800: color-mix(in lch, var(--primary), black 20%);
    --primary-dark-900: color-mix(in lch, var(--primary), black 10%);
    --secondary-light-100: color-mix(in lch, var(--secondary), white 90%);
    --secondary-light-200: color-mix(in lch, var(--secondary), white 80%);
    --secondary-light-300: color-mix(in lch, var(--secondary), white 70%);
    --secondary-light-400: color-mix(in lch, var(--secondary), white 60%);
    --secondary-light-500: color-mix(in lch, var(--secondary), white);
    --secondary-light-600: color-mix(in lch, var(--secondary), white 40%);
    --secondary-light-700: color-mix(in lch, var(--secondary), white 30%);
    --secondary-light-800: color-mix(in lch, var(--secondary), white 20%);
    --secondary-light-900: color-mix(in lch, var(--secondary), white 10%);
    --secondary-100: color-mix(in lch, var(--secondary), black 90%);
    --secondary-200: color-mix(in lch, var(--secondary), black 80%);
    --secondary-300: color-mix(in lch, var(--secondary), black 70%);
    --secondary-400: color-mix(in lch, var(--secondary), black 60%);
    --secondary-500: color-mix(in lch, var(--secondary), black);
    --secondary-600: color-mix(in lch, var(--secondary), black 40%);
    --secondary-700: color-mix(in lch, var(--secondary), black 30%);
    --secondary-800: color-mix(in lch, var(--secondary), black 20%);
    --secondary-900: color-mix(in lch, var(--secondary), black 10%);
    --trans: 300ms;
    --round: 16px;
    --paw: url("/assets/img/theme/cherry/pawprint.svg");
}
@font-face {
    font-family: Rubik;
    src: url("/assets/fonts/Rubik.ttf") format("truetype");
}

@font-face {
    font-family: Urbanist;
    src: url("/assets/fonts/Urbanist-Bold.ttf") format("truetype");
}