Виправлення помилок.

Додан новий метод авторізації в застосунок.

web/css/main.css

@@ -110,10 +110,11 @@
     border: 0;
     padding: 0;
     font-family: 'Roboto', sans-serif;
-    margin: 0;
+    /* margin: 0; */
     font-weight: 400;
     outline: none;
     -webkit-text-size-adjust: 100%;
+    -webkit-tap-highlight-color: transparent;
 }
 
 *:disabled {
@@ -122,7 +123,8 @@
 }
 
 @media(hover: hover) {
-    a:hover, 
+
+    a:hover,
     button:hover,
     select:hover,
     input:hover,
@@ -175,9 +177,20 @@ a:active {
 }
 
 body {
+    overscroll-behavior-y: none;
     background-color: var(--ColorThemes2);
     color: var(--ColorThemes3);
     /* transition: .3s ease; */
+    margin: 0;
+}
+
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+    margin: 0;
 }
 
 /* Стили для анимации обновления страници свайпом */
@@ -201,6 +214,108 @@ body {
     }
 }
 
+@keyframes slide-in {
+    from {
+        opacity: 0;
+        transform: translateY(-15px);
+    }
+
+    to {
+        opacity: 1;
+        transform: translateY(0);
+    }
+}
+
+@keyframes slide-out {
+    from {
+        opacity: 1;
+        transform: translateY(0);
+    }
+
+    to {
+        opacity: 0;
+        transform: translateY(-15);
+    }
+}
+
+dialog {
+    border: none;
+    border-radius: 12px;
+    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2);
+    background-color: var(--ColorThemes0);
+    color: var(--ColorThemes3);
+    animation: slide-in 0.3s ease-out forwards;
+}
+
+dialog:open {
+    box-shadow: 0 8px 40px rgba(227, 182, 0, 0.15);
+}
+
+dialog::backdrop {
+    background: rgba(0, 0, 0, 0.2);
+    backdrop-filter: blur(3px);
+}
+
+dialog>header,
+dialog>footer {
+    padding: 20px;
+}
+
+dialog>content {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    padding: 0 20px;
+}
+
+dialog>header>h1 {
+    color: var(--ColorThemes3);
+    font-size: var(--FontSize5);
+}
+
+dialog>footer>button {
+    width: 100%;
+    border-radius: 5px;
+    height: 30px;
+    background: var(--ColorThemes1);
+    color: var(--ColorThemes3);
+    font-size: var(--FontSize2);
+}
+
+/* Стилизуем само окно */
+[popover] {
+    padding: 24px;
+    border: none;
+    border-radius: 12px;
+    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2);
+    background-color: var(--ColorThemes2);
+    color: var(--ColorThemes3);
+    max-width: 400px;
+    gap: 10px;
+}
+
+/* Стилизуем фон вокруг окна (работает только когда popover открыт) */
+[popover]::backdrop {
+    background: rgba(0, 0, 0, 0.4);
+    backdrop-filter: blur(3px);
+    /* Добавляем красивое размытие фона */
+}
+[popover]>button {
+    margin-top: 15px;
+    width: 100%;
+    border-radius: 5px;
+    height: 30px;
+    background: var(--ColorThemes3);
+    color: var(--ColorThemes0);
+    font-size: var(--FontSize2);
+}
+
+
+
+
+
+
 select {
     -moz-appearance: none;
     -webkit-appearance: none;