/* Responsive marker layout */
@media (max-width: 449px) {
  /* Muuta container flex-layoutiksi */
  #vehicle-container {
    display: flex !important;
    flex-direction: column !important;
    aspect-ratio: auto !important;
    height: auto !important;
  }

  /* Kuva sopeutuu */
  #vehicle-container img {
    width: 100%;
    aspect-ratio: 16 / 9;
    object-fit: contain;
  }

  /* Overlay siirtuu kuvan alle flex-layoutiksi */
  #overlay {
    position: static !important;
    display: flex !important;
    flex-wrap: wrap;
    gap: 0.5rem;
    padding: 0.5rem;
    background: rgba(55, 65, 81, 0.8);
    justify-content: space-around;
    align-items: center;
    width: 100% !important;
    height: auto !important;
  }

  /* Markerit menettävät absoluuttisen sijainnin */
  #overlay .marker {
    position: static !important;
    left: auto !important;
    top: auto !important;
    flex: 1 1 calc(50% - 0.25rem);
    min-width: 80px;
  }

  /* Pointer display piilotetaan pienillä näytöillä */
  #pointer-display {
    display: none;
  }
}
