/* The first frame uses the same field and isotype as the native launch art. */
#pipa-launch { display: none; }
html.pipa-launching { background-color: #d3ed83; }
html.pipa-launching #pipa-launch {
  position: fixed; inset: 0; z-index: 2147483647;
  display: grid; place-items: center; overflow: hidden;
  background: #d3ed83; pointer-events: none;
}
html.pipa-launching #pipa-launch.launch-ready {
  animation: pipa-launch-exit 265ms ease-in both;
}
#pipa-launch img, #pipa-launch::before, #pipa-launch::after { grid-area: 1 / 1; }
#pipa-launch img {
  width: 96px; height: 96px; position: relative;
  animation: pipa-launch-mark 540ms cubic-bezier(.2,.8,.25,1) both;
}
#pipa-launch::before, #pipa-launch::after {
  content: ""; width: 112px; height: 112px;
  border: 1.5px solid #183e37; border-radius: 55% 33% 54% 34%;
  animation: pipa-launch-ring 610ms cubic-bezier(.16,.7,.32,1) both;
}
#pipa-launch::after { animation-delay: 85ms; }
@keyframes pipa-launch-exit { from { opacity: 1 } 100% { opacity: 0; visibility: hidden } }
@keyframes pipa-launch-mark { 0%,100% { transform: scale(1) } 43% { transform: scale(1.065) } }
@keyframes pipa-launch-ring {
  from { opacity: 0; transform: scale(.77) }
  24% { opacity: .22 }
  to { opacity: 0; transform: scale(1.95) }
}
@media (prefers-reduced-motion: reduce) {
  html.pipa-launching #pipa-launch.launch-ready, #pipa-launch img { animation: none; }
  #pipa-launch::before, #pipa-launch::after { content: none; }
}