Add reset time disclaimer showing midnight UTC in local timezone

src/pages/DailyChallenge.tsx

@@ -8,7 +8,7 @@ import PageLayout from '@/components/layout/PageLayout';
 import { getTodaysChallenge, type DailyChallenge as DailyChallengeType } from '@/api/daily-challenges';
 import { checkDailyCompletion } from '@/api/leaderboards';
 import { useAuthStore } from '@/stores/auth-store';
-import { Loader2, Calendar, Trophy } from 'lucide-react';
+import { Loader2, Calendar, Trophy, Clock } from 'lucide-react';
 
 export default function DailyChallenge() {
   const [challenge, setChallenge] = useState<DailyChallengeType | null>(null);
@@ -67,6 +67,19 @@ export default function DailyChallenge() {
     });
   };
 
+  const getLocalResetTime = () => {
+    // Next midnight UTC, displayed in the user's local timezone
+    const now = new Date();
+    const nextMidnightUtc = new Date(
+      Date.UTC(now.getUTCFullYear(), now.getUTCMonth(), now.getUTCDate() + 1),
+    );
+    return nextMidnightUtc.toLocaleTimeString([], {
+      hour: 'numeric',
+      minute: '2-digit',
+      timeZoneName: 'short',
+    });
+  };
+
   return (
     <PageLayout>
       <div className="flex flex-col items-center gap-8 py-12">
@@ -139,6 +152,11 @@ export default function DailyChallenge() {
                 )}
               </Button>
             </div>
+
+            <div className="flex items-center justify-center gap-1.5 text-xs text-muted-foreground">
+              <Clock className="h-3 w-3" />
+              <span>New challenge at midnight UTC ({getLocalResetTime()} local)</span>
+            </div>
           </div>
         )}
       </div>