Numeroud bug fixes, UI improvements, small animations

src/services/settingsService.ts

@@ -10,9 +10,9 @@ For flashcards, use this shape:
 { "type": "flashcards", "deckName": "...", "description": "...", "cards": [{"front": "...", "back": "..."}] }
 
 Rules:
-- CRITICAL: Output MUST be valid JSON. All strings must be wrapped in double quotes.
+- CRITICAL: Output MUST be valid JSON. EVERY string value must start and end with double quotes. Do NOT output unquoted strings. Example: "back": "your text here".
 - Use Markdown formatting (bullet lists, **bold**, tables) inside "back"
-  text wherever it improves clarity. You MUST escape any newlines in the string as \n. Do not use raw newlines.
+  text wherever it improves clarity. You MUST escape any newlines in the string as \\n. Do not use raw newlines.
 - Base everything strictly on the material below. Do not add outside facts.
 
 Material:
@@ -31,7 +31,7 @@ For quizzes, use this shape:
 ]}
 
 Rules:
-- CRITICAL: Output MUST be valid JSON. All strings must be wrapped in double quotes.
+- CRITICAL: Output MUST be perfectly valid JSON. EVERY string value (including rationale and prompt) MUST start and end with double quotes. Do NOT output unquoted strings. Example: "rationale": "your text here"
 - "multiple_choice" questions must have exactly one option with correct: true.
 - "sata" questions must have two or more options with correct: true.
 - Every question needs a rationale explaining why the correct option(s) are
@@ -42,7 +42,7 @@ Rules:
   a new variant each time, and keep the total number of distinct categories
   small relative to the number of questions.
 - Use Markdown formatting (bullet lists, **bold**, tables) inside
-  "rationale" text wherever it improves clarity. You MUST escape any newlines in the string as \n. Do not use raw newlines.
+  "rationale" text wherever it improves clarity. You MUST escape any newlines in the string as \\n. Do not use raw newlines.
 - Base everything strictly on the material below. Do not add outside facts.
 
 Material: