Add Christmas theme and snow effects for December

Introduces a Christmas theme that activates in December, including themed colors, subtle background patterns, and snowflake effects on loading screens. Adds a reusable SnowLoader component and utility for December detection. Updates layout and loading components to conditionally apply decorations and styles only during December.

components/snow-loader.tsx

@@ -0,0 +1,54 @@
+"use client"
+
+import { useEffect, useState } from "react"
+import { isDecember } from "@/lib/utils/christmas"
+
+interface SnowLoaderProps {
+  className?: string;
+  count?: number;
+}
+
+export function SnowLoader({ className = "", count = 20 }: SnowLoaderProps) {
+  const [snowflakes, setSnowflakes] = useState<Array<{ id: number; left: number; delay: number; duration: number; size: number }>>([])
+  const [isDec, setIsDec] = useState(false)
+
+  useEffect(() => {
+    setIsDec(isDecember())
+    
+    if (isDecember()) {
+      // Generate snowflakes
+      const flakes = Array.from({ length: count }, (_, i) => ({
+        id: i,
+        left: Math.random() * 100,
+        delay: Math.random() * 3,
+        duration: 5 + Math.random() * 3,
+        size: 0.5 + Math.random() * 0.5,
+      }))
+      setSnowflakes(flakes)
+    }
+  }, [count])
+
+  if (!isDec) {
+    return null
+  }
+
+  return (
+    <div className={`absolute inset-0 pointer-events-none overflow-hidden ${className}`}>
+      {snowflakes.map((flake) => (
+        <div
+          key={flake.id}
+          className="absolute top-0 text-white/70 text-xs animate-snowflake"
+          style={{
+            left: `${flake.left}%`,
+            animationDelay: `${flake.delay}s`,
+            animationDuration: `${flake.duration}s`,
+            fontSize: `${flake.size}rem`,
+          }}
+        >
+          ❄
+        </div>
+      ))}
+    </div>
+  )
+}
+