style: добавлены responsive стили для планшетов

Добавлены медиа-запросы для планшетов с малой высотой (1080x700):
- GamePort.styles.css: уменьшены отступы для PlayerPort и ActivePort
- GamePorts.vue: уменьшены отступы и gap в сетке портов
- IconButton.vue: уменьшены размеры кнопок для всех размеров

Улучшает отображение интерфейса на планшетах с малой высотой экрана.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>

client/src/components/game/GamePort.styles.css

@@ -79,6 +79,13 @@
   border-radius: var(--radius-lg);
 }
 
+/* Планшет - уменьшаем отступы */
+@media (max-width: 1080px) and (max-height: 700px) {
+  .player-port {
+    padding: 0.5rem;
+  }
+}
+
 /* Тёмная тема */
 [data-theme="dark"] .player-port {
   background: linear-gradient(135deg, #2a4a3e 0%, #1f3830 100%) !important; /* Градиент для тёмной темы */
@@ -258,6 +265,13 @@
   border-radius: var(--radius-lg);
 }
 
+/* Планшет - уменьшаем отступы */
+@media (max-width: 1080px) and (max-height: 700px) {
+  .active-port {
+    padding: 0.5rem;
+  }
+}
+
 .active-port.bonus-active {
   background: linear-gradient(135deg, var(--color-surface) 0%, rgba(251, 191, 36, 0.2) 100%);
   box-shadow: 0 0 20px rgba(251, 191, 36, 0.3);

client/src/components/game/GamePorts.vue

@@ -224,6 +224,18 @@ onMounted(async () => {
 }
 
 /* Responsive */
+
+/* Планшет с малой высотой */
+@media (max-width: 1080px) and (max-height: 700px) {
+  .game-ports {
+    padding: 16px;
+  }
+
+  .ports-grid {
+    gap: 16px;
+  }
+}
+
 @media (max-width: 768px) {
   .game-ports {
     padding: 16px;

client/src/components/ui/IconButton.vue

@@ -284,6 +284,29 @@ const iconComponent = computed(() => {
   }
 }
 
+/* Планшет с малой высотой - еще меньше кнопки */
+@media (max-width: 1080px) and (max-height: 700px) {
+  .icon-button--sm {
+    width: 36px !important;
+    height: 36px !important;
+  }
+
+  .icon-button--md {
+    width: 48px !important;
+    height: 48px !important;
+  }
+
+  .icon-button--lg {
+    width: 60px !important;
+    height: 60px !important;
+  }
+
+  .icon-button--xl {
+    width: 75px !important;
+    height: 75px !important;
+  }
+}
+
 @media (max-width: 768px) {
   .icon-button--sm {
     width: 36px !important;