feat: add cloud save timestamp and force sync button

Shows a relative time label (e.g. "☁️ 2m ago") in the resource bar
seeded from the server on load and updated after every auto-save or
manual save. A 💾 button lets players trigger an immediate cloud save
outside the 30-second auto-save cycle, with a ⏳ spinner and disabled
state while the request is in-flight.

apps/web/src/context/GameContext.tsx

@@ -10,6 +10,7 @@ import {
 import { challengeBoss as challengeBossApi, loadGame, saveGame } from "../api/client.js";
 import { applyTick, calculateClickPower } from "../engine/tick.js";
 
+
 export interface BattleResult {
   bossName: string;
   result: BossChallengeResponse;
@@ -35,6 +36,12 @@ interface GameContextValue {
   equipItem: (equipmentId: string) => void;
   /** Reload state from the server */
   reload: () => Promise<void>;
+  /** Unix timestamp of the last successful cloud save (null until first save response) */
+  lastSavedAt: number | null;
+  /** True whilst a forced save is in-flight */
+  isSyncing: boolean;
+  /** Immediately save to the server and reset the auto-save timer */
+  forceSync: () => Promise<void>;
   /** Offline gold earned on login */
   offlineGold: number;
   /** Dismiss the offline gold notification */
@@ -60,8 +67,11 @@ export const GameProvider = ({ children }: { children: React.ReactNode }): React
   const [offlineGold, setOfflineGold] = useState(0);
   const [battleResult, setBattleResult] = useState<BattleResult | null>(null);
   const [newAchievements, setNewAchievements] = useState<Achievement[]>([]);
+  const [lastSavedAt, setLastSavedAt] = useState<number | null>(null);
+  const [isSyncing, setIsSyncing] = useState(false);
   const stateRef = useRef<GameState | null>(null);
   const lastSaveRef = useRef<number>(Date.now());
+  const isSyncingRef = useRef(false);
   const rafRef = useRef<number | null>(null);
   const newlyUnlockedRef = useRef<Achievement[]>([]);
 
@@ -73,6 +83,7 @@ export const GameProvider = ({ children }: { children: React.ReactNode }): React
     try {
       const data = await loadGame();
       setState(data.state);
+      setLastSavedAt(data.state.player.lastSavedAt);
       if (data.offlineGold > 0) {
         setOfflineGold(data.offlineGold);
       }
@@ -119,7 +130,9 @@ export const GameProvider = ({ children }: { children: React.ReactNode }): React
       if (Date.now() - lastSaveRef.current >= AUTO_SAVE_INTERVAL_MS) {
         lastSaveRef.current = Date.now();
         if (stateRef.current) {
-          void saveGame({ state: stateRef.current });
+          void saveGame({ state: stateRef.current }).then((response) => {
+            setLastSavedAt(response.savedAt);
+          });
         }
       }
 
@@ -135,6 +148,20 @@ export const GameProvider = ({ children }: { children: React.ReactNode }): React
   // eslint-disable-next-line react-hooks/exhaustive-deps -- only run when state becomes available
   }, [state !== null]);
 
+  const forceSync = useCallback(async () => {
+    if (!stateRef.current || isSyncingRef.current) return;
+    isSyncingRef.current = true;
+    setIsSyncing(true);
+    try {
+      const response = await saveGame({ state: stateRef.current });
+      setLastSavedAt(response.savedAt);
+      lastSaveRef.current = Date.now();
+    } finally {
+      isSyncingRef.current = false;
+      setIsSyncing(false);
+    }
+  }, []);
+
   const handleClick = useCallback(() => {
     setState((prev) => {
       if (!prev) return prev;
@@ -395,6 +422,9 @@ export const GameProvider = ({ children }: { children: React.ReactNode }): React
         challengeBoss,
         equipItem,
         reload,
+        lastSavedAt,
+        isSyncing,
+        forceSync,
         offlineGold,
         dismissOfflineGold,
         battleResult,