/* Approved icon/loading geometry only. Preserve all previously published asset bytes. */
.section-cards--apps,
.screen-loading__section-grid {
  --home-app-icon-size: 64px;
  --home-app-icon-clearance: 8px;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px 0;
  width: calc(100% - 2 * var(--app-inline-gutter) - 10px);
  max-width: 420px;
  height: auto;
  margin: 18px auto 0;
}

.section-cards--apps > .section-card > .section-card__artwork {
  position: relative;
  inset: auto;
  flex: 0 0 auto;
  border-radius: 22.5%;
  overflow: hidden;
  background: none;
}

.section-cards--apps > .section-card > .section-card__artwork,
.screen-loading__section-card::before {
  box-sizing: border-box;
  width: min(var(--home-app-icon-size), calc(100% - var(--home-app-icon-clearance, 8px)));
  height: auto;
  aspect-ratio: 1;
}

@media (max-width: 350px) {
  .section-cards--apps,
  .screen-loading__section-grid { --home-app-icon-size: 60px; }
}

.screen-loading__section-card { position: relative; box-sizing: border-box; min-width: 0; height: 90px; padding: 0; border: 0; background: transparent; }

@media (max-width: 350px) {
  .screen-loading__section-card { height: 86px; }
}
