Update style.css

style.css

@@ -1,4 +1,3 @@
-/* Общие стили для всего приложения */
 body {
   font-family: Arial, sans-serif;
   background-color: #f0f0f0;
@@ -7,16 +6,18 @@ body {
   display: flex;
   flex-direction: column;
   justify-content: space-between;
-  align-items: center;
   height: 100vh;
   overflow: hidden;
 }
 
-/* Стили для руки */
+/* Стили для руки игрока и оппонента */
 .hand {
   display: flex;
   justify-content: center;
-  margin: 10px 0;
+  align-items: center;
+  height: 15%;
+  padding: 5px;
+  background-color: #ddd;
 }
 
 .opponent-hand {
@@ -27,9 +28,10 @@ body {
   align-self: flex-end;
 }
 
+/* Карта */
 .card {
-  width: 80px;
-  height: 120px;
+  width: 60px;
+  height: 90px;
   background-color: white;
   border: 2px solid black;
   border-radius: 10px;
@@ -41,44 +43,40 @@ body {
   box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
   cursor: pointer;
   position: relative;
+  z-index: 5;
 }
 
 .card.dragging {
   opacity: 0.5;
   z-index: 10;
 }
 
-.card:hover {
-  transform: translateY(-3px);
-  box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
-  transition: transform 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
-}
-
-/* Стили для рядов */
+/* Слот на игровом поле */
 .row {
   display: flex;
   justify-content: center;
   margin-bottom: 10px;
-  border: 2px dashed #ccc; /* Разметка поля */
-  height: 120px; /* Высота ряда, равная высоте карт */
+  border: 2px dashed #ccc;
+  height: 20%;
+  width: 100%;
 }
 
-/* Стили для полоски между картами оппонента и игрока */
+/* Полоска между полем */
 .divider {
   width: 100%;
   border-top: 2px solid black;
-  margin: 10px 0;
   padding: 5px 0;
   font-weight: bold;
   text-transform: uppercase;
   font-size: 12px;
+  text-align: center;
 }
 
-/* Адаптация для мобильных устройств */
+/* Мобильные устройства */
 @media (max-width: 480px) {
   .card {
-      width: 70px;
-      height: 100px;
+      width: 50px;
+      height: 75px;
       font-size: 12px;
   }