diff --git a/lessons/21-html-forms-basic.json b/lessons/21-html-forms-basic.json
index 9b18d33..6933576 100644
--- a/lessons/21-html-forms-basic.json
+++ b/lessons/21-html-forms-basic.json
@@ -53,7 +53,7 @@
 			"previewHTML": "",
 			"previewBaseCSS": "body { font-family: system-ui; padding: 20px; } form { max-width: 300px; } label { display: block; margin-top: 15px; margin-bottom: 5px; } label:first-child { margin-top: 0; } input { width: 100%; padding: 8px; border: 1px solid #ccc; border-radius: 4px; box-sizing: border-box; }",
 			"sandboxCSS": "",
-			"initialCode": "<form>\n  <!-- Add email and password inputs -->\n</form>",
+			"initialCode": "<form>\n  \n</form>",
 			"solution": "<form>\n  <label for=\"email\">Email:</label>\n  <input type=\"email\" id=\"email\" name=\"email\">\n  \n  <label for=\"password\">Password:</label>\n  <input type=\"password\" id=\"password\" name=\"password\">\n</form>",
 			"previewContainer": "preview-area",
 			"validations": [
@@ -82,7 +82,7 @@
 			"previewHTML": "",
 			"previewBaseCSS": "body { font-family: system-ui; padding: 20px; } form { max-width: 300px; } label { display: block; margin-top: 15px; margin-bottom: 5px; } label:first-child { margin-top: 0; } input { width: 100%; padding: 8px; border: 1px solid #ccc; border-radius: 4px; box-sizing: border-box; } button { width: 100%; margin-top: 20px; padding: 10px; background: #1976d2; color: white; border: none; border-radius: 4px; cursor: pointer; font-size: 16px; } button:hover { background: #1565c0; }",
 			"sandboxCSS": "",
-			"initialCode": "<form>\n  <label for=\"email\">Email:</label>\n  <input type=\"email\" id=\"email\">\n  \n  <label for=\"password\">Password:</label>\n  <input type=\"password\" id=\"password\">\n  \n  <!-- Add submit button -->\n</form>",
+			"initialCode": "<form>\n  <label for=\"email\">Email:</label>\n  <input type=\"email\" id=\"email\">\n  \n  <label for=\"password\">Password:</label>\n  <input type=\"password\" id=\"password\">\n  \n</form>",
 			"solution": "<form>\n  <label for=\"email\">Email:</label>\n  <input type=\"email\" id=\"email\">\n  \n  <label for=\"password\">Password:</label>\n  <input type=\"password\" id=\"password\">\n  \n  <button type=\"submit\">Sign In</button>\n</form>",
 			"previewContainer": "preview-area",
 			"validations": [
diff --git a/lessons/25-html-datalist.json b/lessons/25-html-datalist.json
index a420075..067d23c 100644
--- a/lessons/25-html-datalist.json
+++ b/lessons/25-html-datalist.json
@@ -14,7 +14,7 @@
 			"previewHTML": "",
 			"previewBaseCSS": "body { font-family: system-ui; padding: 20px; } label { display: block; margin-bottom: 8px; font-weight: 500; } input { width: 100%; padding: 10px; border: 1px solid #ccc; border-radius: 6px; font-size: 16px; } input:focus { outline: 2px solid #1976d2; border-color: transparent; }",
 			"sandboxCSS": "",
-			"initialCode": "<!-- Create an input with datalist suggestions -->",
+			"initialCode": "",
 			"solution": "<label for=\"browser\">Browser:</label>\n<input type=\"text\" id=\"browser\" list=\"browsers\">\n<datalist id=\"browsers\">\n  <option value=\"Chrome\">\n  <option value=\"Firefox\">\n  <option value=\"Safari\">\n</datalist>",
 			"previewContainer": "preview-area",
 			"validations": [
@@ -48,7 +48,7 @@
 			"previewHTML": "",
 			"previewBaseCSS": "body { font-family: system-ui; padding: 30px; background: linear-gradient(135deg, #e0f7fa 0%, #b2ebf2 100%); min-height: 100vh; margin: 0; box-sizing: border-box; } label { display: block; margin-bottom: 10px; font-weight: 600; color: #00695c; } input { width: 100%; padding: 12px 15px; border: 2px solid #26a69a; border-radius: 8px; font-size: 16px; background: white; } input:focus { outline: none; border-color: #00695c; box-shadow: 0 0 0 3px rgba(38,166,154,0.2); }",
 			"sandboxCSS": "",
-			"initialCode": "<!-- Create a country selector with datalist -->",
+			"initialCode": "",
 			"solution": "<label for=\"country\">Country:</label>\n<input type=\"text\" id=\"country\" list=\"countries\" placeholder=\"Start typing...\">\n<datalist id=\"countries\">\n  <option value=\"Germany\">\n  <option value=\"France\">\n  <option value=\"Spain\">\n  <option value=\"Italy\">\n</datalist>",
 			"previewContainer": "preview-area",
 			"validations": [
diff --git a/lessons/26-html-data-attributes.json b/lessons/26-html-data-attributes.json
index 4fb9121..1ad2a7c 100644
--- a/lessons/26-html-data-attributes.json
+++ b/lessons/26-html-data-attributes.json
@@ -14,7 +14,7 @@
 			"previewHTML": "",
 			"previewBaseCSS": "body { font-family: system-ui; padding: 20px; display: grid; gap: 15px; } article { padding: 20px; border-radius: 10px; background: #f5f5f5; border-left: 4px solid #ccc; } article[data-category='electronics'] { border-left-color: #2196f3; background: #e3f2fd; } article[data-category='clothing'] { border-left-color: #e91e63; background: #fce4ec; } h2 { margin: 0 0 10px 0; } article::after { content: '€' attr(data-price); display: block; font-weight: bold; color: #4caf50; margin-top: 10px; }",
 			"sandboxCSS": "",
-			"initialCode": "<!-- Create product cards with data attributes -->",
+			"initialCode": "",
 			"solution": "<article data-category=\"electronics\" data-price=\"299\">\n  <h2>Laptop</h2>\n  <p>A powerful laptop for work and play.</p>\n</article>\n\n<article data-category=\"clothing\" data-price=\"49\">\n  <h2>T-Shirt</h2>\n  <p>A comfortable cotton t-shirt.</p>\n</article>",
 			"previewContainer": "preview-area",
 			"validations": [
@@ -43,7 +43,7 @@
 			"previewHTML": "",
 			"previewBaseCSS": "body { font-family: system-ui; padding: 20px; } ul { list-style: none; padding: 0; } li { padding: 15px; margin: 8px 0; border-radius: 8px; background: #f5f5f5; } li[data-status='completed'] { background: #c8e6c9; text-decoration: line-through; color: #388e3c; } li[data-status='active'] { background: #fff3e0; border-left: 4px solid #ff9800; font-weight: 600; } li[data-status='pending'] { background: #e3f2fd; color: #1976d2; }",
 			"sandboxCSS": "",
-			"initialCode": "<ul>\n  <!-- Add list items with data-status attributes -->\n</ul>",
+			"initialCode": "<ul>\n  \n</ul>",
 			"solution": "<ul>\n  <li data-status=\"completed\">Buy groceries</li>\n  <li data-status=\"active\">Finish homework</li>\n  <li data-status=\"pending\">Call mom</li>\n</ul>",
 			"previewContainer": "preview-area",
 			"validations": [
diff --git a/lessons/27-html-dialog.json b/lessons/27-html-dialog.json
index e7331c8..15b0a32 100644
--- a/lessons/27-html-dialog.json
+++ b/lessons/27-html-dialog.json
@@ -14,7 +14,7 @@
 			"previewHTML": "",
 			"previewBaseCSS": "body { font-family: system-ui; padding: 20px; min-height: 200px; background: #f5f5f5; } dialog { border: none; border-radius: 12px; box-shadow: 0 10px 40px rgba(0,0,0,0.2); padding: 25px; max-width: 400px; } dialog::backdrop { background: rgba(0,0,0,0.5); } dialog h2 { margin: 0 0 15px 0; color: #1976d2; } dialog p { color: #666; margin: 0 0 20px 0; } dialog button { background: #1976d2; color: white; border: none; padding: 10px 25px; border-radius: 6px; cursor: pointer; font-size: 16px; } dialog button:hover { background: #1565c0; }",
 			"sandboxCSS": "",
-			"initialCode": "<!-- Create a dialog with the open attribute -->",
+			"initialCode": "",
 			"solution": "<dialog open>\n  <h2>Welcome!</h2>\n  <p>This is a native HTML dialog element.</p>\n  <form method=\"dialog\">\n    <button>Close</button>\n  </form>\n</dialog>",
 			"previewContainer": "preview-area",
 			"validations": [
@@ -53,7 +53,7 @@
 			"previewHTML": "",
 			"previewBaseCSS": "body { font-family: system-ui; padding: 20px; min-height: 200px; background: linear-gradient(135deg, #fce4ec 0%, #f8bbd9 100%); } dialog { border: none; border-radius: 12px; box-shadow: 0 10px 40px rgba(0,0,0,0.2); padding: 25px; max-width: 350px; text-align: center; } dialog h2 { margin: 0 0 10px 0; color: #c62828; } dialog p { color: #666; margin: 0 0 20px 0; } dialog form { display: flex; gap: 10px; justify-content: center; } dialog button { padding: 10px 20px; border-radius: 6px; cursor: pointer; font-size: 14px; border: none; } dialog button:first-child { background: #e0e0e0; color: #333; } dialog button:last-child { background: #c62828; color: white; } dialog button:hover { opacity: 0.9; }",
 			"sandboxCSS": "",
-			"initialCode": "<!-- Create a confirmation dialog -->",
+			"initialCode": "",
 			"solution": "<dialog open>\n  <h2>Confirm Delete</h2>\n  <p>Are you sure you want to delete this item?</p>\n  <form method=\"dialog\">\n    <button value=\"cancel\">Cancel</button>\n    <button value=\"delete\">Delete</button>\n  </form>\n</dialog>",
 			"previewContainer": "preview-area",
 			"validations": [
diff --git a/lessons/28-html-forms-fieldset.json b/lessons/28-html-forms-fieldset.json
index 7abc27c..5be0f2c 100644
--- a/lessons/28-html-forms-fieldset.json
+++ b/lessons/28-html-forms-fieldset.json
@@ -14,7 +14,7 @@
 			"previewHTML": "",
 			"previewBaseCSS": "body { font-family: system-ui; padding: 20px; background: #f0f4f8; } form { max-width: 400px; } fieldset { border: 2px solid #3498db; border-radius: 10px; padding: 20px; background: white; } legend { color: #3498db; font-weight: 600; padding: 0 10px; font-size: 1.1rem; } label { display: block; margin: 15px 0 5px; color: #333; font-weight: 500; } input { width: 100%; padding: 10px; border: 1px solid #ddd; border-radius: 6px; font-size: 16px; box-sizing: border-box; } input:focus { outline: 2px solid #3498db; border-color: transparent; }",
 			"sandboxCSS": "",
-			"initialCode": "<!-- Create a form with a fieldset group -->",
+			"initialCode": "",
 			"solution": "<form>\n  <fieldset>\n    <legend>Personal Info</legend>\n    <label for=\"name\">Name:</label>\n    <input type=\"text\" id=\"name\" name=\"name\">\n    <label for=\"email\">Email:</label>\n    <input type=\"email\" id=\"email\" name=\"email\">\n  </fieldset>\n</form>",
 			"previewContainer": "preview-area",
 			"validations": [
@@ -53,7 +53,7 @@
 			"previewHTML": "",
 			"previewBaseCSS": "body { font-family: system-ui; padding: 20px; background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); min-height: 100vh; margin: 0; box-sizing: border-box; } form { max-width: 450px; margin: 0 auto; } fieldset { border: none; border-radius: 15px; padding: 30px; background: white; box-shadow: 0 10px 40px rgba(0,0,0,0.2); } legend { color: #667eea; font-weight: 700; padding: 0; font-size: 1.5rem; margin-bottom: 10px; } label { display: block; margin: 20px 0 8px; color: #333; font-weight: 500; } input, textarea { width: 100%; padding: 12px; border: 2px solid #e0e0e0; border-radius: 8px; font-size: 16px; box-sizing: border-box; font-family: inherit; } input:focus, textarea:focus { outline: none; border-color: #667eea; } textarea { resize: vertical; min-height: 100px; } button { margin-top: 20px; width: 100%; padding: 14px; background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); color: white; border: none; border-radius: 8px; font-size: 16px; font-weight: 600; cursor: pointer; } button:hover { opacity: 0.9; }",
 			"sandboxCSS": "",
-			"initialCode": "<!-- Create a contact form with textarea -->",
+			"initialCode": "",
 			"solution": "<form>\n  <fieldset>\n    <legend>Contact Us</legend>\n    <label for=\"email\">Email:</label>\n    <input type=\"email\" id=\"email\" name=\"email\">\n    <label for=\"message\">Message:</label>\n    <textarea id=\"message\" name=\"message\" rows=\"4\"></textarea>\n    <button type=\"submit\">Send Message</button>\n  </fieldset>\n</form>",
 			"previewContainer": "preview-area",
 			"validations": [
@@ -92,7 +92,7 @@
 			"previewHTML": "",
 			"previewBaseCSS": "body { font-family: system-ui; padding: 20px; background: #fafafa; } form { max-width: 500px; } fieldset { border: 1px solid #ddd; border-radius: 10px; padding: 20px; margin-bottom: 20px; background: white; } legend { color: #2c3e50; font-weight: 600; padding: 0 10px; } label { display: block; margin: 15px 0 5px; color: #555; } input, textarea { width: 100%; padding: 10px; border: 1px solid #ddd; border-radius: 6px; font-size: 16px; box-sizing: border-box; font-family: inherit; } input:focus, textarea:focus { outline: 2px solid #3498db; border-color: transparent; } textarea { resize: vertical; min-height: 80px; } button { width: 100%; padding: 14px; background: #2c3e50; color: white; border: none; border-radius: 8px; font-size: 16px; cursor: pointer; } button:hover { background: #34495e; }",
 			"sandboxCSS": "",
-			"initialCode": "<!-- Create a form with multiple fieldsets -->",
+			"initialCode": "",
 			"solution": "<form>\n  <fieldset>\n    <legend>Account Info</legend>\n    <label for=\"username\">Username:</label>\n    <input type=\"text\" id=\"username\" name=\"username\">\n    <label for=\"password\">Password:</label>\n    <input type=\"password\" id=\"password\" name=\"password\">\n  </fieldset>\n  <fieldset>\n    <legend>Preferences</legend>\n    <label for=\"bio\">Bio:</label>\n    <textarea id=\"bio\" name=\"bio\"></textarea>\n  </fieldset>\n  <button type=\"submit\">Register</button>\n</form>",
 			"previewContainer": "preview-area",
 			"validations": [
diff --git a/lessons/de/21-html-forms-basic.json b/lessons/de/21-html-forms-basic.json
index 122690c..226d40b 100644
--- a/lessons/de/21-html-forms-basic.json
+++ b/lessons/de/21-html-forms-basic.json
@@ -53,7 +53,7 @@
 			"previewHTML": "",
 			"previewBaseCSS": "body { font-family: system-ui; padding: 20px; } form { max-width: 300px; } label { display: block; margin-top: 15px; margin-bottom: 5px; } label:first-child { margin-top: 0; } input { width: 100%; padding: 8px; border: 1px solid #ccc; border-radius: 4px; box-sizing: border-box; }",
 			"sandboxCSS": "",
-			"initialCode": "<form>\n  <!-- Füge E-Mail- und Passwort-Eingaben hinzu -->\n</form>",
+			"initialCode": "<form>\n  \n</form>",
 			"solution": "<form>\n  <label for=\"email\">E-Mail:</label>\n  <input type=\"email\" id=\"email\" name=\"email\">\n  \n  <label for=\"password\">Passwort:</label>\n  <input type=\"password\" id=\"password\" name=\"password\">\n</form>",
 			"previewContainer": "preview-area",
 			"validations": [
@@ -82,7 +82,7 @@
 			"previewHTML": "",
 			"previewBaseCSS": "body { font-family: system-ui; padding: 20px; } form { max-width: 300px; } label { display: block; margin-top: 15px; margin-bottom: 5px; } label:first-child { margin-top: 0; } input { width: 100%; padding: 8px; border: 1px solid #ccc; border-radius: 4px; box-sizing: border-box; } button { width: 100%; margin-top: 20px; padding: 10px; background: #1976d2; color: white; border: none; border-radius: 4px; cursor: pointer; font-size: 16px; } button:hover { background: #1565c0; }",
 			"sandboxCSS": "",
-			"initialCode": "<form>\n  <label for=\"email\">E-Mail:</label>\n  <input type=\"email\" id=\"email\">\n  \n  <label for=\"password\">Passwort:</label>\n  <input type=\"password\" id=\"password\">\n  \n  <!-- Füge Absende-Button hinzu -->\n</form>",
+			"initialCode": "<form>\n  <label for=\"email\">E-Mail:</label>\n  <input type=\"email\" id=\"email\">\n  \n  <label for=\"password\">Passwort:</label>\n  <input type=\"password\" id=\"password\">\n  \n</form>",
 			"solution": "<form>\n  <label for=\"email\">E-Mail:</label>\n  <input type=\"email\" id=\"email\">\n  \n  <label for=\"password\">Passwort:</label>\n  <input type=\"password\" id=\"password\">\n  \n  <button type=\"submit\">Anmelden</button>\n</form>",
 			"previewContainer": "preview-area",
 			"validations": [
diff --git a/lessons/de/25-html-datalist.json b/lessons/de/25-html-datalist.json
index 88f7222..8fc2da1 100644
--- a/lessons/de/25-html-datalist.json
+++ b/lessons/de/25-html-datalist.json
@@ -14,7 +14,7 @@
 			"previewHTML": "",
 			"previewBaseCSS": "body { font-family: system-ui; padding: 20px; } label { display: block; margin-bottom: 8px; font-weight: 500; } input { width: 100%; padding: 10px; border: 1px solid #ccc; border-radius: 6px; font-size: 16px; } input:focus { outline: 2px solid #1976d2; border-color: transparent; }",
 			"sandboxCSS": "",
-			"initialCode": "<!-- Erstelle eine Eingabe mit Datalist-Vorschlägen -->",
+			"initialCode": "",
 			"solution": "<label for=\"browser\">Browser:</label>\n<input type=\"text\" id=\"browser\" list=\"browsers\">\n<datalist id=\"browsers\">\n  <option value=\"Chrome\">\n  <option value=\"Firefox\">\n  <option value=\"Safari\">\n</datalist>",
 			"previewContainer": "preview-area",
 			"validations": [
@@ -48,7 +48,7 @@
 			"previewHTML": "",
 			"previewBaseCSS": "body { font-family: system-ui; padding: 30px; background: linear-gradient(135deg, #e0f7fa 0%, #b2ebf2 100%); min-height: 100vh; margin: 0; box-sizing: border-box; } label { display: block; margin-bottom: 10px; font-weight: 600; color: #00695c; } input { width: 100%; padding: 12px 15px; border: 2px solid #26a69a; border-radius: 8px; font-size: 16px; background: white; } input:focus { outline: none; border-color: #00695c; box-shadow: 0 0 0 3px rgba(38,166,154,0.2); }",
 			"sandboxCSS": "",
-			"initialCode": "<!-- Erstelle eine Länderauswahl mit Datalist -->",
+			"initialCode": "",
 			"solution": "<label for=\"country\">Land:</label>\n<input type=\"text\" id=\"country\" list=\"countries\" placeholder=\"Tippen zum Suchen...\">\n<datalist id=\"countries\">\n  <option value=\"Deutschland\">\n  <option value=\"Frankreich\">\n  <option value=\"Spanien\">\n  <option value=\"Italien\">\n</datalist>",
 			"previewContainer": "preview-area",
 			"validations": [
diff --git a/lessons/de/26-html-data-attributes.json b/lessons/de/26-html-data-attributes.json
index 4ca3d72..26d1a82 100644
--- a/lessons/de/26-html-data-attributes.json
+++ b/lessons/de/26-html-data-attributes.json
@@ -14,7 +14,7 @@
 			"previewHTML": "",
 			"previewBaseCSS": "body { font-family: system-ui; padding: 20px; display: grid; gap: 15px; } article { padding: 20px; border-radius: 10px; background: #f5f5f5; border-left: 4px solid #ccc; } article[data-category='electronics'] { border-left-color: #2196f3; background: #e3f2fd; } article[data-category='clothing'] { border-left-color: #e91e63; background: #fce4ec; } h2 { margin: 0 0 10px 0; } article::after { content: '€' attr(data-price); display: block; font-weight: bold; color: #4caf50; margin-top: 10px; }",
 			"sandboxCSS": "",
-			"initialCode": "<!-- Erstelle Produkt-Karten mit Data-Attributen -->",
+			"initialCode": "",
 			"solution": "<article data-category=\"electronics\" data-price=\"299\">\n  <h2>Laptop</h2>\n  <p>Ein leistungsstarker Laptop für Arbeit und Freizeit.</p>\n</article>\n\n<article data-category=\"clothing\" data-price=\"49\">\n  <h2>T-Shirt</h2>\n  <p>Ein bequemes Baumwoll-T-Shirt.</p>\n</article>",
 			"previewContainer": "preview-area",
 			"validations": [
@@ -43,7 +43,7 @@
 			"previewHTML": "",
 			"previewBaseCSS": "body { font-family: system-ui; padding: 20px; } ul { list-style: none; padding: 0; } li { padding: 15px; margin: 8px 0; border-radius: 8px; background: #f5f5f5; } li[data-status='completed'] { background: #c8e6c9; text-decoration: line-through; color: #388e3c; } li[data-status='active'] { background: #fff3e0; border-left: 4px solid #ff9800; font-weight: 600; } li[data-status='pending'] { background: #e3f2fd; color: #1976d2; }",
 			"sandboxCSS": "",
-			"initialCode": "<ul>\n  <!-- Füge Listenelemente mit data-status-Attributen hinzu -->\n</ul>",
+			"initialCode": "<ul>\n  \n</ul>",
 			"solution": "<ul>\n  <li data-status=\"completed\">Einkaufen gehen</li>\n  <li data-status=\"active\">Hausaufgaben fertig machen</li>\n  <li data-status=\"pending\">Mama anrufen</li>\n</ul>",
 			"previewContainer": "preview-area",
 			"validations": [
diff --git a/lessons/de/27-html-dialog.json b/lessons/de/27-html-dialog.json
index 4618b61..e459b4f 100644
--- a/lessons/de/27-html-dialog.json
+++ b/lessons/de/27-html-dialog.json
@@ -14,7 +14,7 @@
 			"previewHTML": "",
 			"previewBaseCSS": "body { font-family: system-ui; padding: 20px; min-height: 200px; background: #f5f5f5; } dialog { border: none; border-radius: 12px; box-shadow: 0 10px 40px rgba(0,0,0,0.2); padding: 25px; max-width: 400px; } dialog::backdrop { background: rgba(0,0,0,0.5); } dialog h2 { margin: 0 0 15px 0; color: #1976d2; } dialog p { color: #666; margin: 0 0 20px 0; } dialog button { background: #1976d2; color: white; border: none; padding: 10px 25px; border-radius: 6px; cursor: pointer; font-size: 16px; } dialog button:hover { background: #1565c0; }",
 			"sandboxCSS": "",
-			"initialCode": "<!-- Erstelle einen Dialog mit dem open-Attribut -->",
+			"initialCode": "",
 			"solution": "<dialog open>\n  <h2>Willkommen!</h2>\n  <p>Dies ist ein natives HTML-Dialog-Element.</p>\n  <form method=\"dialog\">\n    <button>Schließen</button>\n  </form>\n</dialog>",
 			"previewContainer": "preview-area",
 			"validations": [
@@ -53,7 +53,7 @@
 			"previewHTML": "",
 			"previewBaseCSS": "body { font-family: system-ui; padding: 20px; min-height: 200px; background: linear-gradient(135deg, #fce4ec 0%, #f8bbd9 100%); } dialog { border: none; border-radius: 12px; box-shadow: 0 10px 40px rgba(0,0,0,0.2); padding: 25px; max-width: 350px; text-align: center; } dialog h2 { margin: 0 0 10px 0; color: #c62828; } dialog p { color: #666; margin: 0 0 20px 0; } dialog form { display: flex; gap: 10px; justify-content: center; } dialog button { padding: 10px 20px; border-radius: 6px; cursor: pointer; font-size: 14px; border: none; } dialog button:first-child { background: #e0e0e0; color: #333; } dialog button:last-child { background: #c62828; color: white; } dialog button:hover { opacity: 0.9; }",
 			"sandboxCSS": "",
-			"initialCode": "<!-- Erstelle einen Bestätigungsdialog -->",
+			"initialCode": "",
 			"solution": "<dialog open>\n  <h2>Löschen bestätigen</h2>\n  <p>Bist du sicher, dass du dieses Element löschen möchtest?</p>\n  <form method=\"dialog\">\n    <button value=\"cancel\">Abbrechen</button>\n    <button value=\"delete\">Löschen</button>\n  </form>\n</dialog>",
 			"previewContainer": "preview-area",
 			"validations": [
diff --git a/lessons/de/28-html-forms-fieldset.json b/lessons/de/28-html-forms-fieldset.json
index 17b0699..83ffcea 100644
--- a/lessons/de/28-html-forms-fieldset.json
+++ b/lessons/de/28-html-forms-fieldset.json
@@ -14,7 +14,7 @@
 			"previewHTML": "",
 			"previewBaseCSS": "body { font-family: system-ui; padding: 20px; background: #f0f4f8; } form { max-width: 400px; } fieldset { border: 2px solid #3498db; border-radius: 10px; padding: 20px; background: white; } legend { color: #3498db; font-weight: 600; padding: 0 10px; font-size: 1.1rem; } label { display: block; margin: 15px 0 5px; color: #333; font-weight: 500; } input { width: 100%; padding: 10px; border: 1px solid #ddd; border-radius: 6px; font-size: 16px; box-sizing: border-box; } input:focus { outline: 2px solid #3498db; border-color: transparent; }",
 			"sandboxCSS": "",
-			"initialCode": "<!-- Erstelle ein Formular mit einer Fieldset-Gruppe -->",
+			"initialCode": "",
 			"solution": "<form>\n  <fieldset>\n    <legend>Persönliche Daten</legend>\n    <label for=\"name\">Name:</label>\n    <input type=\"text\" id=\"name\" name=\"name\">\n    <label for=\"email\">E-Mail:</label>\n    <input type=\"email\" id=\"email\" name=\"email\">\n  </fieldset>\n</form>",
 			"previewContainer": "preview-area",
 			"validations": [
@@ -53,7 +53,7 @@
 			"previewHTML": "",
 			"previewBaseCSS": "body { font-family: system-ui; padding: 20px; background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); min-height: 100vh; margin: 0; box-sizing: border-box; } form { max-width: 450px; margin: 0 auto; } fieldset { border: none; border-radius: 15px; padding: 30px; background: white; box-shadow: 0 10px 40px rgba(0,0,0,0.2); } legend { color: #667eea; font-weight: 700; padding: 0; font-size: 1.5rem; margin-bottom: 10px; } label { display: block; margin: 20px 0 8px; color: #333; font-weight: 500; } input, textarea { width: 100%; padding: 12px; border: 2px solid #e0e0e0; border-radius: 8px; font-size: 16px; box-sizing: border-box; font-family: inherit; } input:focus, textarea:focus { outline: none; border-color: #667eea; } textarea { resize: vertical; min-height: 100px; } button { margin-top: 20px; width: 100%; padding: 14px; background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); color: white; border: none; border-radius: 8px; font-size: 16px; font-weight: 600; cursor: pointer; } button:hover { opacity: 0.9; }",
 			"sandboxCSS": "",
-			"initialCode": "<!-- Erstelle ein Kontaktformular mit Textarea -->",
+			"initialCode": "",
 			"solution": "<form>\n  <fieldset>\n    <legend>Kontaktiere uns</legend>\n    <label for=\"email\">E-Mail:</label>\n    <input type=\"email\" id=\"email\" name=\"email\">\n    <label for=\"message\">Nachricht:</label>\n    <textarea id=\"message\" name=\"message\" rows=\"4\"></textarea>\n    <button type=\"submit\">Nachricht senden</button>\n  </fieldset>\n</form>",
 			"previewContainer": "preview-area",
 			"validations": [
@@ -92,7 +92,7 @@
 			"previewHTML": "",
 			"previewBaseCSS": "body { font-family: system-ui; padding: 20px; background: #fafafa; } form { max-width: 500px; } fieldset { border: 1px solid #ddd; border-radius: 10px; padding: 20px; margin-bottom: 20px; background: white; } legend { color: #2c3e50; font-weight: 600; padding: 0 10px; } label { display: block; margin: 15px 0 5px; color: #555; } input, textarea { width: 100%; padding: 10px; border: 1px solid #ddd; border-radius: 6px; font-size: 16px; box-sizing: border-box; font-family: inherit; } input:focus, textarea:focus { outline: 2px solid #3498db; border-color: transparent; } textarea { resize: vertical; min-height: 80px; } button { width: 100%; padding: 14px; background: #2c3e50; color: white; border: none; border-radius: 8px; font-size: 16px; cursor: pointer; } button:hover { background: #34495e; }",
 			"sandboxCSS": "",
-			"initialCode": "<!-- Erstelle ein Formular mit mehreren Fieldsets -->",
+			"initialCode": "",
 			"solution": "<form>\n  <fieldset>\n    <legend>Kontodaten</legend>\n    <label for=\"username\">Benutzername:</label>\n    <input type=\"text\" id=\"username\" name=\"username\">\n    <label for=\"password\">Passwort:</label>\n    <input type=\"password\" id=\"password\" name=\"password\">\n  </fieldset>\n  <fieldset>\n    <legend>Einstellungen</legend>\n    <label for=\"bio\">Bio:</label>\n    <textarea id=\"bio\" name=\"bio\"></textarea>\n  </fieldset>\n  <button type=\"submit\">Registrieren</button>\n</form>",
 			"previewContainer": "preview-area",
 			"validations": [
diff --git a/lessons/de/29-html-figure.json b/lessons/de/29-html-figure.json
index aa0189b..f024d59 100644
--- a/lessons/de/29-html-figure.json
+++ b/lessons/de/29-html-figure.json
@@ -14,7 +14,7 @@
 			"previewHTML": "",
 			"previewBaseCSS": "body { font-family: system-ui; padding: 20px; background: #f5f5f5; } figure { margin: 0; background: white; border-radius: 12px; overflow: hidden; box-shadow: 0 4px 15px rgba(0,0,0,0.1); max-width: 400px; } figure img { width: 100%; height: 200px; object-fit: cover; display: block; background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); } figcaption { padding: 15px 20px; color: #555; font-size: 0.95rem; border-top: 1px solid #eee; }",
 			"sandboxCSS": "",
-			"initialCode": "<!-- Erstelle eine Figure mit Bild und Beschriftung -->",
+			"initialCode": "",
 			"solution": "<figure>\n  <img src=\"https://picsum.photos/400/200\" alt=\"Eine schöne Landschaft\">\n  <figcaption>Eine wunderschöne Berglandschaft bei Sonnenuntergang.</figcaption>\n</figure>",
 			"previewContainer": "preview-area",
 			"validations": [
@@ -43,7 +43,7 @@
 			"previewHTML": "",
 			"previewBaseCSS": "body { font-family: system-ui; padding: 20px; background: #1e1e1e; } figure { margin: 0; background: #2d2d2d; border-radius: 10px; overflow: hidden; max-width: 500px; } pre { margin: 0; padding: 20px; overflow-x: auto; } code { color: #9cdcfe; font-family: 'Fira Code', 'Consolas', monospace; font-size: 14px; line-height: 1.5; } figcaption { padding: 12px 20px; color: #888; font-size: 0.85rem; background: #252525; border-top: 1px solid #3d3d3d; }",
 			"sandboxCSS": "",
-			"initialCode": "<!-- Erstelle eine Figure mit Code-Schnipsel -->",
+			"initialCode": "",
 			"solution": "<figure>\n  <pre><code>function greet(name) {\n  return `Hallo, ${name}!`;\n}</code></pre>\n  <figcaption>Eine einfache Begrüßungsfunktion in JavaScript</figcaption>\n</figure>",
 			"previewContainer": "preview-area",
 			"validations": [
@@ -77,7 +77,7 @@
 			"previewHTML": "",
 			"previewBaseCSS": "body { font-family: system-ui; padding: 20px; background: linear-gradient(135deg, #ffecd2 0%, #fcb69f 100%); min-height: 100vh; margin: 0; box-sizing: border-box; } figure { margin: 0; background: white; border-radius: 15px; overflow: hidden; box-shadow: 0 10px 30px rgba(0,0,0,0.15); max-width: 500px; padding: 15px; display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; } figure img { width: 100%; height: 120px; object-fit: cover; border-radius: 8px; background: linear-gradient(45deg, #ff6b6b, #feca57); } figcaption { grid-column: 1 / -1; padding: 10px 5px 5px; color: #666; font-size: 0.9rem; text-align: center; }",
 			"sandboxCSS": "",
-			"initialCode": "<!-- Erstelle eine Galerie mit mehreren Bildern -->",
+			"initialCode": "",
 			"solution": "<figure>\n  <img src=\"https://picsum.photos/200/120?1\" alt=\"Foto 1\">\n  <img src=\"https://picsum.photos/200/120?2\" alt=\"Foto 2\">\n  <img src=\"https://picsum.photos/200/120?3\" alt=\"Foto 3\">\n  <img src=\"https://picsum.photos/200/120?4\" alt=\"Foto 4\">\n  <figcaption>Meine Urlaubsfoto-Galerie</figcaption>\n</figure>",
 			"previewContainer": "preview-area",
 			"validations": [