feat(study): shuffle cards when starting study session

Cards are now randomized using Fisher-Yates algorithm to improve
learning by preventing users from memorizing card order.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>

2 files changed, 7 insertions, 1 deletions

diff --git a/src/client/pages/StudyPage.test.tsx b/src/client/pages/StudyPage.test.tsx
index edf683a..c257b24 100644
--- a/src/client/pages/StudyPage.test.tsx
+++ b/src/client/pages/StudyPage.test.tsx
@@ -14,6 +14,11 @@ const mockStudyGet = vi.fn();
 const mockStudyPost = vi.fn();
 const mockHandleResponse = vi.fn();
 
+// Mock shuffle to return array in original order for predictable tests
+vi.mock("../utils/shuffle", () => ({
+	shuffle: <T,>(array: T[]): T[] => [...array],
+}));
+
 vi.mock("../api/client", () => ({
 	apiClient: {
 		login: vi.fn(),
diff --git a/src/client/pages/StudyPage.tsx b/src/client/pages/StudyPage.tsx
index 43fd195..b6c9a3b 100644
--- a/src/client/pages/StudyPage.tsx
+++ b/src/client/pages/StudyPage.tsx
@@ -8,6 +8,7 @@ import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 import { useCallback, useEffect, useMemo, useRef, useState } from "react";
 import { Link, useParams } from "wouter";
 import { ApiClientError, apiClient } from "../api";
+import { shuffle } from "../utils/shuffle";
 import { renderCard } from "../utils/templateRenderer";
 
 interface Card {
@@ -82,7 +83,7 @@ export function StudyPage() {
 			param: { deckId },
 		});
 		const data = await apiClient.handleResponse<{ cards: Card[] }>(res);
-		setCards(data.cards);
+		setCards(shuffle(data.cards));
 	}, [deckId]);
 
 	const fetchData = useCallback(async () => {