:root {
  --font-scale: 1;
}

html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

.app-shell {
  width: 100%;
}

.hero {
  aspect-ratio: 9 / 4;
}

.module-hero {
  aspect-ratio: 3 / 1;
}

.detail-cover {
  aspect-ratio: 16 / 9;
}

.hero,
.module-hero {
  min-height: 0;
}

.hero > *,
.module-hero > * {
  min-width: 0;
}

@media (max-width: 360px) {
  main {
    padding-inline: 12px;
  }

  .topbar {
    padding-inline: 14px;
  }

  .products {
    gap: 8px;
  }
}
