fix: update English box-model task instructions format

Apply same task instruction format update to English source file.

lessons/01-box-model.json

@@ -9,7 +9,7 @@
 			"id": "box-model-1",
 			"title": "Box Model Components",
 			"description": "The CSS box model consists of four concentric layers: content area (innermost), padding, border, and margin (outermost). Understanding how these components interact is essential for precise layout control.",
-			"task": "Add <kbd>padding: 1rem</kbd> to <kbd>.box</kbd> to create space between its content and border.",
+			"task": "Set <kbd>padding</kbd> to <kbd>1rem</kbd> to create space between the content and border.",
 			"previewHTML": "<div class=\"box\">Box Model Components</div>",
 			"previewBaseCSS": "body { font-family: system-ui, sans-serif; padding: 1rem; } .box { background-color: lavender; border: 2px dashed slategray; }",
 			"sandboxCSS": "",
@@ -30,7 +30,7 @@
 			"id": "box-model-2",
 			"title": "Adding Borders",
 			"description": "Borders outline an element, creating visual separation from surrounding content. The border shorthand accepts three values: width, style, and color.",
-			"task": "Add <kbd>border: 2px solid darkslategray</kbd> to <kbd>.box</kbd>.",
+			"task": "Set <kbd>border</kbd> to <kbd>2px solid darkslategray</kbd>.",
 			"previewHTML": "<div class=\"box\">This box needs a border</div>",
 			"previewBaseCSS": "body { font-family: system-ui, sans-serif; padding: 1rem; } .box { background-color: mintcream; padding: 1rem; }",
 			"sandboxCSS": "",
@@ -52,7 +52,7 @@
 			"id": "box-model-3",
 			"title": "Adding Margins",
 			"description": "Margins create space between elements, controlling how they relate to one another within a layout. Unlike padding (which affects internal spacing), margins exist outside the element's border.",
-			"task": "Add <kbd>margin: 1rem</kbd> to <kbd>.outer</kbd> to create space between it and the adjacent element.",
+			"task": "Set <kbd>margin</kbd> to <kbd>1rem</kbd> to create space between this element and its neighbors.",
 			"previewHTML": "<div class=\"container\"><div class=\"outer\">This box needs margins</div><div class=\"neighbor\">Adjacent element</div></div>",
 			"previewBaseCSS": "body { font-family: system-ui, sans-serif; padding: 1rem; } .container { background-color: whitesmoke; padding: 8px; } .outer { background-color: plum; padding: 1rem; border: 2px solid orchid; } .neighbor { background-color: lightblue; padding: 1rem; border: 2px solid steelblue; }",
 			"sandboxCSS": "",
@@ -73,7 +73,7 @@
 			"id": "box-model-4",
 			"title": "Box Sizing: Border-Box",
 			"description": "The <kbd>box-sizing</kbd> property determines how element dimensions are calculated. The default <kbd>content-box</kbd> excludes padding and border from width/height, while <kbd>border-box</kbd> includes them, making layout calculations more intuitive.",
-			"task": "Add <kbd>box-sizing: border-box</kbd> to <kbd>.sized</kbd> so padding and border are included in its width.",
+			"task": "Set <kbd>box-sizing</kbd> to <kbd>border-box</kbd> so padding and border are included in the width.",
 			"previewHTML": "<div class=\"sizing-demo\"><div class=\"box default\">Content-box (default)</div><div class=\"box sized\">Border-box</div></div>",
 			"previewBaseCSS": "body { font-family: system-ui, sans-serif; padding: 1rem; } .sizing-demo { display: flex; gap: 1rem; } .box { width: 200px; padding: 1rem; border: 4px solid teal; background: lightcyan; } .default { box-sizing: content-box; }",
 			"sandboxCSS": "",
@@ -94,7 +94,7 @@
 			"id": "box-model-5",
 			"title": "Margin Collapse",
 			"description": "When two vertical margins meet, they collapse to the larger value instead of adding up. Understanding this behavior is crucial for consistent vertical spacing.",
-			"task": "Add <kbd>margin-bottom: 2rem</kbd> to <kbd>.first</kbd>. Notice the space between paragraphs equals 2rem (not 3rem) due to margin collapse.",
+			"task": "Set <kbd>margin-bottom</kbd> to <kbd>2rem</kbd>. Notice the space between paragraphs equals 2rem (not 3rem) due to margin collapse.",
 			"previewHTML": "<div class=\"collapse-demo\"><p class=\"first\">This paragraph has a bottom margin.</p><p class=\"second\">This paragraph has a top margin of 1rem.</p></div>",
 			"previewBaseCSS": "body { font-family: system-ui, sans-serif; padding: 1rem; } .collapse-demo { border: 1px solid silver; padding: 8px; background: ghostwhite; } .second { margin-top: 1rem; background: linen; }",
 			"sandboxCSS": "",
@@ -115,7 +115,7 @@
 			"id": "box-model-6",
 			"title": "Margin Shorthand Notation",
 			"description": "The margin shorthand can set all four sides at once. Two values set vertical (top/bottom) and horizontal (left/right) margins respectively.",
-			"task": "Add <kbd>margin: 1rem 2rem</kbd> to <kbd>.spaced</kbd> for 1rem top/bottom and 2rem left/right.",
+			"task": "Set <kbd>margin</kbd> to <kbd>1rem 2rem</kbd> for 1rem top/bottom and 2rem left/right.",
 			"previewHTML": "<div class=\"container\"><div class=\"spaced\">This box needs margins: 1rem top/bottom, 2rem left/right</div></div>",
 			"previewBaseCSS": "body { font-family: system-ui, sans-serif; padding: 1rem; } .container { background-color: whitesmoke; padding: 8px; } .spaced { background-color: honeydew; border: 2px solid mediumseagreen; padding: 1rem; }",
 			"sandboxCSS": "",
@@ -137,20 +137,20 @@
 			"id": "box-model-7",
 			"title": "Padding Shorthand Notation",
 			"description": "Like margin, padding shorthand allows setting all sides at once. A single value applies to all four sides equally.",
-			"task": "Add <kbd>padding: 1.5rem</kbd> to <kbd>.padded</kbd> to add equal padding on all sides.",
+			"task": "Set <kbd>padding</kbd> to <kbd>2rem</kbd> to add equal padding on all sides.",
 			"previewHTML": "<div class=\"padded\">This box needs equal padding on all sides</div>",
 			"previewBaseCSS": "body { font-family: system-ui, sans-serif; padding: 1rem; } .padded { background-color: papayawhip; border: 2px solid orange; }",
 			"sandboxCSS": "",
 			"codePrefix": ".padded {\n  ",
 			"initialCode": "",
 			"codeSuffix": "\n}",
-			"solution": "padding: 1.5rem;",
+			"solution": "padding: 2rem;",
 			"previewContainer": "preview-area",
 			"validations": [
 				{
 					"type": "property_value",
-					"value": { "property": "padding", "expected": "1.5rem" },
+					"value": { "property": "padding", "expected": "2rem" },
-					"message": "Set <kbd>padding: 1.5rem</kbd>"
+					"message": "Set <kbd>padding: 2rem</kbd>"
 				}
 			]
 		},
@@ -158,7 +158,7 @@
 			"id": "box-model-8",
 			"title": "Border on Specific Sides",
 			"description": "For granular control, you can target specific sides with <kbd>border-top</kbd>, <kbd>border-right</kbd>, <kbd>border-bottom</kbd>, or <kbd>border-left</kbd>.",
-			"task": "Add <kbd>border-bottom: 4px solid dodgerblue</kbd> to <kbd>.line</kbd>.",
+			"task": "Set <kbd>border-bottom</kbd> to <kbd>4px solid dodgerblue</kbd>.",
 			"previewHTML": "<div class=\"line\">This element needs only a bottom border</div>",
 			"previewBaseCSS": "body { font-family: system-ui, sans-serif; padding: 1rem; } .line { padding: 1rem; background-color: aliceblue; }",
 			"sandboxCSS": "",