The default resume template from the pagedown package is visually not very appealing. There are quite white spaces along the borders, the sidebar is too thick, and the font is not appropriate. I guess I should be knowledgeable in CSS to make changes to manipulate the changes. This is what I have tried so far:

 # Manipulating the margins
 p * {
 /* Override default margins*/
 --pagedjs-margin-right: 0.2in;
 --pagedjs-margin-left: 0.2in;
 --pagedjs-margin-top: 0.2in;
 --pagedjs-margin-bottom: 0.2in;
}

# Manipulating the sidebar
:root{
--sidebar-width: 10rem; /* side bar width */
--sidebar-background-color: #e2a2a2;
--decorator-border: 2px solid #a2e2e2; /* change color and thickness of timeline */
}

# Manipulate the font
/* Define the font family here */
body{
font-family: "Roboto", sans-serif;

I have inserted this code chunk after defining YAML. When I play around with the second and third options and knit the file, they work as intended. However, no matter what number I use to change the margins, it remains the same. What should I do?