/* /apps/ in the lab (pool 2, item 9, 16.09.2026): only what the sub-page
   language of lab.css does not already give. The card is the featured card of
   the home (.sps-card); the head, buttons, tags, footer and dock are shared. */

/* The list of apps starts where the visuals of a service page start. */
.apl { margin-top: 40px; padding: 0 var(--g); }
.apl .sps-card { margin-top: 0; }
.apl .sps-card + .sps-card { margin-top: 12px; }

/* The app's icon on the tile of the site — the same plate and the same icon
   size as the case card and the service thumbnail (.svs-media.is-tile in
   lab.css); here the slot is the featured card's visual, which fills its
   frame absolutely, so the tile centres inside that frame. */
.apl .sps-media.is-tile {
  display: grid;
  place-items: center;
  background: radial-gradient(120% 120% at 30% 20%, rgba(224, 85, 154, 0.20), rgba(224, 85, 154, 0) 62%), var(--ground);
}
.apl .sps-media.is-tile img {
  width: 32%;
  height: auto;
  object-fit: contain;
  border-radius: 22%;
}

/* Closing line of the collection, at the card, in the quiet voice of the page. */
.apl-foot { margin: 20px var(--g) 0; max-width: 44ch; font: 400 15px/22px "Inter", sans-serif; color: var(--ink-mute); }

@media (max-width: 719.98px) {
  .apl { margin-top: 32px; }
  .apl .sps-media.is-tile img { width: 36%; }
}