.pwa-update-notice,
.pwa-install-hint {
  position: fixed;
  z-index: 420;
  left: 50%;
  transform: translateX(-50%);
  width: min(calc(100% - 24px), 560px);
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 11px 12px;
  border: 1px solid rgba(85, 177, 232, .24);
  border-radius: 16px;
  color: #eaf6ff;
  background: rgba(5, 16, 34, .97);
  box-shadow: 0 18px 55px rgba(0, 0, 0, .38);
  backdrop-filter: blur(20px) saturate(125%);
  font-family: Inter, Sora, system-ui, sans-serif;
}
.pwa-update-notice { top: max(12px, env(safe-area-inset-top)); }
.pwa-install-hint { bottom: calc(82px + env(safe-area-inset-bottom)); }
.pwa-update-notice > span,
.pwa-install-hint > div { min-width: 0; flex: 1; }
.pwa-update-notice b,
.pwa-install-hint b { display: block; font-size: 12px; }
.pwa-update-notice small,
.pwa-install-hint span { display: block; margin-top: 2px; color: #8da2bd; font-size: 10px; line-height: 1.35; }
.pwa-update-notice button,
.pwa-install-hint button {
  min-height: 40px;
  border: 1px solid rgba(69, 201, 238, .22);
  border-radius: 12px;
  color: #dff8ff;
  background: rgba(18, 98, 129, .36);
  padding: 0 12px;
  font: 600 10px Sora, sans-serif;
}
.pwa-install-hint .pwa-install-close { width: 40px; padding: 0; font-size: 18px; color: #8ca0b8; background: rgba(14, 29, 49, .8); }
.pwa-install-hint[hidden] { display: none !important; }
@media (min-width: 761px) {
  .pwa-install-hint { bottom: 22px; }
}