@media screen and (max-width: 500px) {
  body {
    font-size: 16px;
  }

  .icon img {
    width: 120px;
    height: 120px;
  }

  .icon span {
    font-size: 20px;
  }

  .player-panel {
    height: 30vh;
  }

  .player-portrait {
    width: 100px;
    height: 100px;
  }

  .level-coins {
    font-size: 18px;
  }

  .xp-bar {
    height: 18px;
  }

  #xpProgress {
    font-size: 12px;
    line-height: 18px;
  }

  .player-attributes div {
    font-size: 16px;
  }

  .enemy-selection .enemy {
    width: 70px;
    height: 70px;
  }

  .enemy-selection .enemy img {
    width: 70px;
    height: 70px;
    object-fit: cover;
  }

  .enemy-selection .enemy small {
    bottom: -20px;
    font-size: 12px;
    width: 70px;
  }

  .slot,
  .inventory-item {
    width: 50px !important;
    height: 50px !important;
  }

  /* --- Магазин --- */
  .shop-content {
    width: 100%;
    padding: 0 4vw 14vw 4vw;
    gap: 8px 6px;
    grid-template-columns: 1fr 1fr;
    justify-items: center;
  }

  .shop-item {
    width: 100%;
    max-width: 120px;
    font-size: 12px;
  }
}

@media screen and (max-width: 400px) {
  /* Для совсем маленьких экранов магазин ещё компактнее */
  .shop-content {
    padding: 0 0 12px 0;
    gap: 5px 2px;
  }

  .shop-item {
    width: 100%;
    max-width: 95vw;
    font-size: 10px;
  }
}

@media (max-width:500px) {
  .combo-modal-content, .dodge-modal-content { min-width: 98vw; padding: 10vw 2vw; }
  #dodgeSlider { width: 94vw; min-width: 170px; }
}

@media (max-width: 600px) {
  .shop-tab { min-width: 90px; font-size: 13px; padding: 7px 0 7px 0; }
  .shop-tabs { gap: 8px; }
}

@media (max-width: 500px) {
  .battle-main-inner,
  #enemy-selection-container,
  #battleContainer,
  #battleTabCombos {
    width: 97vw;
    max-width: 99vw;
  }
  .combo-item {
    font-size: 0.91rem;
  }
}

@media (max-width: 440px) {
  #mastermindModal .modal-content.mastermind-content {
    width: 96vw;
    margin: 5vw auto 0 auto;
  }
}