добавили функцию обработки нажатия на кнопку Отменить,

src/App.vue

@@ -30,14 +30,6 @@ function setNumber(item) {
     item.variable.push(String(clickCount.value));
     listOfTrips.value.push(item);
     clickCount.value++;
-  } else if (valueOfMarker === clickCount.value - 1) {
-    //если мы нажимаем на последнюю выбранную клетку, то у неё удаляется число
-    item.variable.splice(0, 1);
-    const index = listOfTrips.value.indexOf(item);
-    if (index !== -1) {
-      listOfTrips.value.splice(index, 1);
-    }
-    clickCount.value--;
   } else {
     //если нажимаем на ранее отмеченную клетку (не последнюю), то выводится ошибка
     listOfTrips.value.push(item);
@@ -66,6 +58,17 @@ function saveResult() {
   isModalVisible.value = true;
 }
 
+function cancel(){
+  numbers.value[listOfTrips.value.at(-1).index].variable.pop();
+    listOfTrips.value.pop();
+
+    if (clickCount.value === 1) {
+      return;
+    } else {
+      clickCount.value--;
+    }
+}
+
 function cleanResult() {
   clickCount.value = 1;
   numbers.value = [];
@@ -83,14 +86,7 @@ function cleanResult() {
 const handleKeydown = (event) => {
   if (event.ctrlKey && event.code === "KeyZ" && listOfTrips.value.length) {
     event.preventDefault();
-    numbers.value[listOfTrips.value.at(-1).index].variable.pop();
+    cancel();
-    listOfTrips.value.pop();
-
-    if (clickCount.value === 1) {
-      return;
-    } else {
-      clickCount.value--;
-    }
   }
 };
 useEventListener("keydown", handleKeydown);
@@ -121,7 +117,7 @@ function copyAndToast(text) {
     <div class="actions">
       <button @click="saveResult">Сохранить</button>
       <button @click="cleanResult">Очистить</button>
-      <button @click="cleanResult">Отменить</button>
+      <button @click="cancel">Отменить</button>
     </div>
     <MyDropMenu/>
   </div>
@@ -165,7 +161,6 @@ function copyAndToast(text) {
 <style>
 html {
   background-image: radial-gradient(#383838e2, #222222);
-  color: white;
 }
 
 :root {

src/components/MyDialog.vue

@@ -6,7 +6,7 @@
           <slot name="header">
             <strong>Заголовок по умолчанию</strong>
           </slot>
-          <button class="btn-close" @click="closeModal" aria-label="Закрыть модальное окно">
+          <button class="modal-btn-close" @click="closeModal" aria-label="Закрыть модальное окно">
             ×
           </button>
         </header>
@@ -104,9 +104,10 @@ function closeModal() {
 .modal-body {
   position: relative;
   padding: 20px 10px;
+  color: white
 }
 
-.btn-close {
+.modal-btn-close {
   border: none;
   font-size: 20px;
   padding: 0;

src/components/MyDropMenu.vue

@@ -21,7 +21,7 @@
     <transition name="slide">
       <aside v-if="isOpen" class="side-panel">
         <div class="menu-header">
-          <h3>Навигация</h3>
+          <h1>SkyVue</h1>
         </div>
         
         <nav class="menu-content">
@@ -68,7 +68,9 @@ defineExpose({ open: () => (isOpen.value = true), close: closeMenu });
   cursor: pointer;
   padding: 5px;
 }
-
+h1{
+  text-align: center;
+}
 .line {
   width: 100%;
   height: 4px;
@@ -77,9 +79,9 @@ defineExpose({ open: () => (isOpen.value = true), close: closeMenu });
 }
 
 /* Анимация бургера в крестик */
-.is-active .line:nth-child(1) { transform: translateY(8px) rotate(45deg); }
+.is-active .line:nth-child(1) { transform: translateY(6px) rotate(45deg); }
 .is-active .line:nth-child(2) { opacity: 0; }
-.is-active .line:nth-child(3) { transform: translateY(-9px) rotate(-45deg); }
+.is-active .line:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }
 
 /* Боковая панель */
 .side-panel {
@@ -90,7 +92,7 @@ defineExpose({ open: () => (isOpen.value = true), close: closeMenu });
   height: 100vh;
   background: white;
   z-index: 1000;
-  padding: 80px 20px 20px;
+  padding: 0 20px 20px;
 }
 
 /* Затемнение фона */