Why aren't multiple @font-face rules for different weights and styles not working?

Exercise: design-system

@font-face {
    font-family: "Poppins";
    src: url("./fonts/Poppins/Poppins-Regular.ttf") format("ttf");
}
@font-face {
    font-family: "Poppins";
    src: url("./fonts/Poppins/Poppins-Bold.ttf") format("ttf");
    font-weight: bold;
}
@font-face {
    font-family: "Poppins";
    src: url("./fonts/Poppins/Poppins-Italic.ttf") format("ttf");
    font-style: italic;
} 

#poppins p {
    font-family: "Poppins", serif;
}

I created rules for other fonts similarly.
Here is my project repo. I do not understand why this does not work.

I meant: Why aren’t multiple @font-face rules for different weights and styles working?