Christmas Themed Homepage (#2608)

## Description:
Adds the following:
- Snowflake animation with snowflakes falling from the top to the bottom
of the screen
- Changed homepage color theme from blue and white to Green and Red.
Also changed the openfront logo to a red, green, and white gradient.
- Added a santa hat on the announcements button

## Please complete the following:
- [x] I have added screenshots for all UI updates
- [ ] I process any text displayed to the user through translateText()
and I've added it to the en.json file
- [ ] I have added relevant tests to the test directory
- [ ] I confirm I have thoroughly tested these changes and take full
responsibility for any bugs introduced

<img width="1616" height="836" alt="Screenshot 2025-12-12 at 3 01 17 PM"
src="https://github.com/user-attachments/assets/82e29db3-3bc0-4392-b5bf-dd57c15784a3"
/>

<img width="1616" height="836" alt="Screenshot 2025-12-12 at 2 58 54 PM"
src="https://github.com/user-attachments/assets/232da646-6923-4966-acba-5240074e7e3f"
/>


## Please put your Discord username so you can be contacted if a bug or
regression is found:

Restart

---------

Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com>

src/client/StatsModal.ts

@@ -80,7 +80,7 @@ export class StatsModal extends LitElement {
             ${translateText("stats_modal.loading")}
           </p>
           <div
-            class="w-6 h-6 border-4 border-blue-500 border-t-transparent rounded-full animate-spin"
+            class="w-6 h-6 border-4 border-red-500 border-t-transparent rounded-full animate-spin"
           ></div>
         </div>
       `;
@@ -91,7 +91,7 @@ export class StatsModal extends LitElement {
         <div class="flex flex-col items-center justify-center p-6 text-white">
           <p class="mb-4 text-center">${this.error}</p>
           <button
-            class="px-4 py-2 bg-blue-600 hover:bg-blue-700 rounded text-sm font-medium"
+            class="px-4 py-2 bg-red-600 hover:bg-red-700 rounded text-sm font-medium"
             @click=${() => this.loadLeaderboard()}
           >
             Retry
@@ -219,7 +219,7 @@ export class StatsButton extends LitElement {
       <div class="fixed top-20 right-4 z-[9998]">
         <button
           @click="${this.open}"
-          class="w-12 h-12 bg-blue-600 hover:bg-blue-700 text-white rounded-full shadow-2xl hover:shadow-3xl transition-all duration-200 flex items-center justify-center text-xl focus:outline-none focus:ring-4 focus:ring-blue-500 focus:ring-offset-4"
+          class="w-12 h-12 bg-red-600 hover:bg-red-700 text-white rounded-full shadow-2xl hover:shadow-2xl transition-all duration-200 flex items-center justify-center text-xl focus:outline-none focus:ring-4 focus:ring-red-500 focus:ring-offset-4"
           title="${translateText("stats_modal.title")}"
         >
           <img src="/icons/stats.svg" alt="Stats" class="w-6 h-6" />