diff --git a/STYLEGUIDE.md b/STYLEGUIDE.md
index 99af6fe84..ee4033c8f 100644
--- a/STYLEGUIDE.md
+++ b/STYLEGUIDE.md
@@ -384,6 +384,7 @@ export const router = createBrowserRouter([
 
 - Regular ts files can be named in camelCase (ex. `customTypes.ts`)
 - React files (.tsx) must be named in PascalCase (ex. `DashboardPage.tsx`)
+- Page files should end in `*.page.tsx` file and should be named as `XyzPage`
 - If a file doesn't need to be .tsx, then it should be a .ts file
 
 ### Function Naming
@@ -467,6 +468,8 @@ If the styling is very complicated, you may reach for CSS files, but only if you
 
 Tailwind is inside this project due to the ease of prototyping during development, but you shouldn't have to use it in production. Thereby, it is HIGHLY discouraged but not banned.
 
+Avoid hard-coded / magic styles - reach for Mantine’s theme, which can be imported and used as an object as `{ theme }` from `@/src/lib/theme`.
+
 [Mantine docs](https://mantine.dev/core/package/)
 
 ## Typesafety