.pwa-install {
  position: fixed;
  inset: 0;
  z-index: 2147483000;
  display: grid;
  padding: 24px;
  place-items: center;
  visibility: hidden;
  opacity: 0;
  pointer-events: none;
  background: rgba(22, 39, 73, .32);
  backdrop-filter: blur(7px);
  -webkit-backdrop-filter: blur(7px);
  transition: opacity .22s ease, visibility .22s ease;
}

.pwa-install.is-open { visibility: visible; opacity: 1; pointer-events: auto; }

.pwa-install__card {
  position: relative;
  width: min(100%, 570px);
  padding: 36px 36px 28px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.88);
  border-radius: 30px;
  color: #172b56;
  background: linear-gradient(135deg, #fff 0%, #fbfdff 63%, #edf5ff 100%);
  box-shadow: 0 28px 75px rgba(12, 30, 66, .28);
  animation: pwaInstallEnter .28s ease both;
}

.pwa-install__card::after {
  content: "";
  position: absolute;
  z-index: -1;
  width: 220px;
  height: 220px;
  right: -118px;
  bottom: -132px;
  border-radius: 50%;
  background: rgba(191, 219, 254, .36);
}

.pwa-install__close {
  position: absolute;
  top: 17px;
  left: 17px;
  display: grid;
  width: 36px;
  height: 36px;
  padding: 0;
  place-items: center;
  border: 0;
  border-radius: 50%;
  color: #54657f;
  background: transparent;
  font: inherit;
  font-size: 2rem;
  line-height: 1;
  cursor: pointer;
}

.pwa-install__close:hover { color: #1e3a6b; background: #f1f5f9; }
.pwa-install__close:focus-visible, .pwa-install button:focus-visible { outline: 3px solid #93c5fd; outline-offset: 3px; }

.pwa-install__content { display: flex; align-items: center; gap: 25px; padding: 4px 20px 18px 4px; }
.pwa-install__copy { flex: 1 1 0; }
.pwa-install__copy h2 { margin: 0 0 12px; color: #132957; font-size: clamp(1.35rem, 4vw, 1.7rem); font-weight: 900; line-height: 1.75; }
.pwa-install__copy p { margin: 0; color: #72819a; font-size: .88rem; font-weight: 500; line-height: 2; }

.pwa-install__visual { position: relative; flex: 0 0 auto; width: 132px; height: 132px; }
.pwa-install__logo { position: absolute; inset: 14px; display: grid; place-items: center; overflow: hidden; border: 1px solid #dbeafe; border-radius: 31px; background: #fff; box-shadow: 0 15px 30px rgba(37,99,235,.13); transform: rotate(-4deg); }
.pwa-install__logo img { width: 81%; height: 81%; object-fit: contain; }
.pwa-install__spark { position: absolute; z-index: 1; color: #6099fa; text-shadow: 0 4px 10px rgba(37,99,235,.14); font-size: 1.9rem; line-height: 1; }
.pwa-install__spark--one { top: 0; right: 0; }.pwa-install__spark--two { top: 23px; right: -9px; font-size: 1.17rem; color: #a7c8ff; }

.pwa-install__ios-help { margin: 0 4px 14px; border-radius: 13px; padding: 11px 13px; color: #3e5b86; background: #eff6ff; font-size: .78rem; font-weight: 600; line-height: 1.85; }
.pwa-install__actions { display: flex; align-items: center; gap: 15px; padding: 0 4px; }
.pwa-install__primary { min-height: 54px; display: inline-flex; flex: 1 1 auto; align-items: center; justify-content: center; gap: 9px; border: 0; border-radius: 15px; padding: 0 20px; color: #fff; background: linear-gradient(115deg, #1f6fec, #377bf3); box-shadow: 0 13px 22px rgba(37,99,235,.25); font: inherit; font-size: .89rem; font-weight: 800; cursor: pointer; transition: transform .18s ease, box-shadow .18s ease; }
.pwa-install__primary:hover { transform: translateY(-2px); box-shadow: 0 16px 25px rgba(37,99,235,.32); }.pwa-install__primary i { width: 23px; height: 23px; }
.pwa-install__later { min-height: 50px; flex: 0 0 auto; border: 0; padding: 0 15px; color: #667793; background: transparent; font: inherit; font-size: .88rem; font-weight: 800; cursor: pointer; }.pwa-install__later:hover { color: #1d4ed8; }

@keyframes pwaInstallEnter { from { transform: translateY(16px) scale(.98); } to { transform: translateY(0) scale(1); } }

@media (max-width: 520px) {
  .pwa-install { align-items: end; padding: 14px; }
  .pwa-install__card { padding: 42px 22px 21px; border-radius: 28px; }
  .pwa-install__content { gap: 12px; padding: 0 8px 18px 0; }
  .pwa-install__visual { width: 104px; height: 104px; }.pwa-install__logo { inset: 11px; border-radius: 27px; }
  .pwa-install__copy h2 { margin-bottom: 9px; font-size: 1.25rem; line-height: 1.68; }.pwa-install__copy p { font-size: .79rem; line-height: 1.95; }
  .pwa-install__actions { gap: 7px; }.pwa-install__primary { min-height: 52px; padding: 0 11px; font-size: .79rem; }.pwa-install__primary i { width: 21px; height: 21px; }.pwa-install__later { padding: 0 8px; font-size: .8rem; }
}

@media (max-width: 360px) { .pwa-install__visual { width: 82px; height: 82px; }.pwa-install__copy h2 { font-size: 1.12rem; }.pwa-install__copy p { font-size: .72rem; }.pwa-install__primary { font-size: .71rem; } }
@media (prefers-reduced-motion: reduce) { .pwa-install, .pwa-install__primary { transition: none; }.pwa-install__card { animation: none; } }