Update style.css

style.css

@@ -4,29 +4,30 @@
 
 /* Общие стили из вашего CSS, но с адаптивными улучшениями */
 body {
-    padding: 1rem; /* Уменьшил отступ для мобильных */
+    padding: 0;
     font-family: -apple-system, BlinkMacSystemFont, "Arial", sans-serif;
-    margin: 0; /* Убрал margin по умолчанию */
+    margin: 0;
+    overflow: hidden; /* Предотвращает полосы прокрутки */
 }
 
 h1 {
-    font-size: 1.2rem; /* Уменьшил размер шрифта для мобильных */
+    font-size: 1.2rem;
     margin-top: 0;
 }
 
 p {
     color: rgb(107, 114, 128);
-    font-size: 0.9rem; /* Уменьшил размер шрифта для мобильных */
-    margin-bottom: 0.5rem; /* Уменьшил отступ для мобильных */
-    margin-top: 0.25rem; /* Уменьшил отступ для мобильных */
+    font-size: 0.9rem;
+    margin-bottom: 0.5rem;
+    margin-top: 0.25rem;
 }
 
 .card {
-    max-width: 100%; /* Занимает всю ширину на мобильных */
+    max-width: 100%;
     margin: 0 auto;
-    padding: 0.5rem; /* Уменьшил отступ для мобильных */
+    padding: 0.5rem;
     border: 1px solid lightgray;
-    border-radius: 0.5rem; /* Уменьшил радиус для мобильных */
+    border-radius: 0.5rem;
 }
 
 .card p:last-child {
@@ -34,9 +35,9 @@ p {
 }
 
 /* Адаптивные стили */
-@media (min-width: 640px) { /* Для экранов больше 640px */
+@media (min-width: 640px) {
     body {
-        padding: 2rem;
+        padding: 0;
     }
     h1 {
         font-size: 1.6rem;
@@ -50,3 +51,69 @@ p {
         border-radius: 1rem;
     }
 }
+
+/* Стили для iframe */
+iframe {
+    position: fixed;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    border: none;
+    margin: 0;
+    padding: 0;
+}
+
+/* Стили для кнопок установки */
+#installButton, #iosInstallPrompt {
+    display: none;
+    position: fixed;
+    bottom: 20px;
+    left: 50%;
+    transform: translateX(-50%);
+    padding: 12px 20px;
+    background-color: #007bff;
+    color: white;
+    border: none;
+    border-radius: 5px;
+    cursor: pointer;
+    z-index: 1000;
+    font-size: 16px;
+    text-transform: uppercase;
+    letter-spacing: 1px;
+    box-shadow: 0 0 10px #007bff;
+    transition: box-shadow 0.3s ease-in-out, transform 0.3s ease-in-out;
+}
+
+/* Hover эффект с усилением свечения и небольшим подъемом */
+#installButton:hover, #iosInstallPrompt:hover {
+    box-shadow: 0 0 20px #007bff, 0 0 30px #007bff;
+    transform: translateX(-50%) scale(1.05); /* Небольшое увеличение */
+}
+
+/* Дополнительный эффект пульсации с использованием keyframes */
+@keyframes pulse {
+    0% {
+        box-shadow: 0 0 10px #007bff;
+    }
+    50% {
+        box-shadow: 0 0 20px #007bff, 0 0 30px #007bff;
+    }
+    100% {
+        box-shadow: 0 0 10px #007bff;
+    }
+}
+
+/* Применение анимации к кнопке */
+#installButton.pulse-animation, #iosInstallPrompt.pulse-animation {
+    animation: pulse 2s infinite;
+}
+
+#iosInstallPrompt {
+    background-color: #28a745;
+    box-shadow: 0 0 10px #28a745;
+}
+
+#iosInstallPrompt:hover {
+    box-shadow: 0 0 20px #28a745, 0 0 30px #28a745;
+}