/* Keep the native share panel attached to the bottom edge at every viewport width. */
.modal-backdrop > .share-sheet {
  width: min(100%, 430px) !important;
  max-width: 430px !important;
  align-self: flex-end !important;
  max-height: calc(100dvh - env(safe-area-inset-top));
  margin: 0 !important;
  overflow-y: auto;
  border-radius: 28px 28px 0 0 !important;
  animation: share-sheet-up .24s ease-out both;
}

/* The three-day membership gift only belongs to the newly registered audience. */
html.kori-audience-existing .gift-card {
  display: none !important;
}

/* Reserve a clean text-safe area to the left of KORI's telescope on phones. */
@media (max-width: 759px) {
  .welcome-offer {
    width: min(180px, 46vw);
    line-height: 1.2;
  }

  .welcome-offer > span:first-child {
    width: 100%;
    font-size: 18px;
    line-height: 1.25;
  }

  .welcome-offer b {
    display: block;
    width: max-content;
    margin-top: 6px;
    font-size: 23px;
    white-space: nowrap;
  }

  .welcome-kori {
    right: -26px;
  }
}

@media (max-width: 370px) {
  .welcome-offer {
    width: min(164px, 45vw);
  }

  .welcome-offer > span:first-child { font-size: 17px; }
  .welcome-offer b { font-size: 21px; }
}

@keyframes share-sheet-up {
  from { opacity: 0; transform: translateY(28px); }
  to { opacity: 1; transform: translateY(0); }
}

@media (prefers-reduced-motion: reduce) {
  .modal-backdrop > .share-sheet { animation: none; }
}