/*
  Safari stability layer

  Device figures use a flow-based ratio spacer instead of asking a grid item
  to derive its height from aspect-ratio. The visual layers remain absolutely
  positioned, so the Apple artwork and real screenshots are unchanged.
*/

.apple-device {
  height: auto;
  aspect-ratio: auto;
  flex-shrink: 0;
}

.apple-device::before {
  display: block;
  width: 100%;
  padding-top: 204.08163265%;
  content: "";
  pointer-events: none;
}

.apple-device--ipad::before {
  padding-top: 130.43478261%;
}

.apple-device--ipad-landscape::before {
  padding-top: 76.66666667%;
}

.apple-device__screen,
.apple-device__art {
  display: block;
}

/*
  Preserve the existing 0.3% iPad screen overscan without a transformed image
  layer. This avoids sub-pixel transform repainting while keeping the opening
  completely filled beneath the official bezel.
*/

.apple-device--ipad-landscape .apple-device__screen {
  top: 4.995835%;
  left: 3.995733%;
  width: 92.008533%;
  height: 90.008348%;
  transform: none;
}