render finish scene

separate areas
add fonts

app/gameData.json

@@ -1,20 +1,27 @@
-[
-  {
-    "question": "Выбери вариант МОСТ",
-    "image": "image_land.jpg",
-    "answer": [ "Мост", "Рудник", "Река", "Солнце" ],
-    "rightAnswer": "мост"
-  },
-  {
-    "question": "Что горит?",
-    "image": "image_port.jpg",
-    "answer": [ "Вода", "Огонь", "Ветер", "Земля" ],
-    "rightAnswer": "ОгоНЬ"
-  },
-  {
-    "question": "t замерзания воды?",
-    "image": "image_land.jpg",
-    "answer": [ "0", "-1", "1", "-10" ],
-    "rightAnswer": "0"
+{
+  "questions": [
+    {
+      "question": "Выбери вариант МОСТ",
+      "image": "image_land.jpg",
+      "answer": [ "Мост", "Рудник", "Река", "Солнце" ],
+      "rightAnswer": "мост"
+    },
+    {
+      "question": "Что горит?",
+      "image": "image_port.jpg",
+      "answer": [ "Вода", "Огонь", "Ветер", "Земля" ],
+      "rightAnswer": "ОгоНЬ"
+    },
+    {
+      "question": "t замерзания воды?",
+      "image": "image_land.jpg",
+      "answer": [ "0", "-1", "1", "-10" ],
+      "rightAnswer": "0"
+    }
+  ],
+  "answerResult": {
+    "100": "100%. Ты милаха!",
+    "60": "Больше половины, красава.",
+    "0": "0%. Ты вообще нихуя не сечёшь"
   }
-]
+}

app/styles.css

@@ -1,7 +1,26 @@
+@font-face {
+	font-family: 'Yanone Kaffeesatz';
+	src: url('YanoneKaffeesatz-Bold.woff2') format('woff2'),
+		url('YanoneKaffeesatz-Bold.woff') format('woff');
+	font-weight: bold;
+	font-style: normal;
+	font-display: swap;
+}
+
+@font-face {
+	font-family: 'Yanone Kaffeesatz';
+	src: url('YanoneKaffeesatz-Regular.woff2') format('woff2'),
+		url('YanoneKaffeesatz-Regular.woff') format('woff');
+	font-weight: normal;
+	font-style: normal;
+	font-display: swap;
+}
+
 html { height: 100%; }
 
 body {
 	background-color: #6E5967;
+	font-family: 'Yanone Kaffeesatz';
 	padding: 0;
 	margin: 0;
 	height: 100%;