fix: Sync favicon to browser theme preference on initial load (#11518)

## Summary

- Fixes favicon always showing the dark variant regardless of browser
theme preference on non-docs routes
- The `useColorScheme` hook now syncs the initial value on mount, since
SSR defaults to "light" and React preserves that state during hydration

The `useEffect` previously only listened for **changes** to
`prefers-color-scheme`, but never set the correct value after hydration
when the browser was already in dark mode.

Author: anthonyshew

docs/site/components/use-color-scheme.tsx

@@ -21,6 +21,9 @@ export function useColorScheme(): ColorScheme {
 
     const mediaQuery = window.matchMedia("(prefers-color-scheme: dark)");
 
+    // Set initial value on mount (SSR defaults to "light", so we need to sync)
+    setColorScheme(mediaQuery.matches ? "dark" : "light");
+
     const handleChange = (event: MediaQueryListEvent): void => {
       setColorScheme(event.matches ? "dark" : "light");
     };