style(theme): expand color palettes and refine dark mode styles

- Expand CSS variables for primary and secondary colors to include full 50-950 scales in `main.css`.
- Update components to reference specific color shades (e.g., `primary-400`, `secondary-200`) instead of generic variables.
- Add dark mode background and text colors to Events, Hall of Fame, and Index sections.
- Adjust image aspect ratio in the Events component.

app/pages/join-us/index.vue

@@ -113,7 +113,7 @@ const handleSubmit = () => {
 </script>
 
 <template>
-  <UPage class="bg-primary">
+  <UPage class="bg-primary-400">
     <div
       class="cursor-not-allowed fixed flex items-center justify-center min-h-screen min-w-screen bg-black opacity-50"
     >