.premium-trial-overlay {
  position: fixed;
  inset: 0;
  z-index: 160000;
  display: grid;
  place-items: center;
  padding: max(20px, env(safe-area-inset-top)) max(18px, env(safe-area-inset-right)) max(20px, env(safe-area-inset-bottom)) max(18px, env(safe-area-inset-left));
  background:
    radial-gradient(circle at 50% 38%, rgba(195, 77, 220, .16), transparent 40%),
    rgba(4, 4, 9, .78);
  -webkit-backdrop-filter: blur(18px) saturate(.78);
  backdrop-filter: blur(18px) saturate(.78);
  opacity: 0;
  transition: opacity .24s ease;
}

.premium-trial-overlay.is-visible { opacity: 1; }

.premium-trial-dialog {
  --trial-accent: #f052ad;
  --trial-violet: #9b5de7;
  position: relative;
  isolation: isolate;
  width: min(100%, 520px);
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, .13);
  border-radius: 30px;
  padding: 38px;
  color: #f9f5ff;
  background:
    linear-gradient(145deg, rgba(26, 22, 36, .98), rgba(12, 12, 20, .99) 65%),
    #111019;
  box-shadow: 0 36px 100px rgba(0, 0, 0, .64), 0 0 0 1px rgba(240, 82, 173, .04) inset;
  transform: translateY(16px) scale(.975);
  transition: transform .34s cubic-bezier(.2, .85, .2, 1);
}

.premium-trial-overlay.is-visible .premium-trial-dialog { transform: translateY(0) scale(1); }

.premium-trial-dialog::before,
.premium-trial-dialog::after {
  content: "";
  position: absolute;
  z-index: -1;
  border-radius: 50%;
  pointer-events: none;
}

.premium-trial-dialog::before {
  width: 270px;
  height: 270px;
  top: -150px;
  right: -85px;
  border: 1px solid rgba(246, 115, 193, .18);
  box-shadow: 0 0 70px rgba(142, 72, 208, .2) inset;
}

.premium-trial-dialog::after {
  width: 180px;
  height: 180px;
  right: 28px;
  bottom: -118px;
  background: rgba(115, 62, 184, .19);
  filter: blur(42px);
}

.premium-trial-close {
  position: absolute;
  top: 16px;
  right: 16px;
  width: 40px;
  height: 40px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(255, 255, 255, .1);
  border-radius: 14px;
  color: rgba(255, 255, 255, .72);
  background: rgba(255, 255, 255, .055);
  font: 400 24px/1 inherit;
  cursor: pointer;
  transition: color .2s ease, background .2s ease, transform .2s ease;
}

.premium-trial-close:hover { color: #fff; background: rgba(255, 255, 255, .1); transform: rotate(4deg); }

.premium-trial-brand {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 24px;
  color: #f4aad3;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .18em;
  text-transform: uppercase;
}

.premium-trial-brand img {
  width: 30px;
  height: 30px;
  padding: 5px;
  border: 1px solid rgba(255, 255, 255, .1);
  border-radius: 10px;
  background: rgba(255, 255, 255, .055);
}

.premium-trial-copy h2 {
  max-width: 430px;
  margin: 0;
  font-size: clamp(34px, 6vw, 50px);
  line-height: .98;
  letter-spacing: -.055em;
  text-wrap: balance;
}

.premium-trial-copy h2 em {
  color: transparent;
  background: linear-gradient(100deg, #ff68b7, #c47af2 72%);
  -webkit-background-clip: text;
  background-clip: text;
  font-style: normal;
}

.premium-trial-copy > p {
  max-width: 450px;
  margin: 17px 0 0;
  color: rgba(243, 237, 249, .66);
  font-size: 15px;
  line-height: 1.55;
}

.premium-trial-features {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 22px 0 26px;
  padding: 0;
  list-style: none;
}

.premium-trial-features li {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 34px;
  padding: 7px 11px;
  border: 1px solid rgba(255, 255, 255, .08);
  border-radius: 999px;
  color: rgba(255, 255, 255, .8);
  background: rgba(255, 255, 255, .035);
  font-size: 12px;
  font-weight: 750;
}

.premium-trial-features li::before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--trial-accent), var(--trial-violet));
  box-shadow: 0 0 10px rgba(240, 82, 173, .7);
}

.premium-trial-actions {
  display: grid;
  grid-template-columns: 1.2fr .8fr;
  gap: 10px;
}

.premium-trial-action {
  min-height: 52px;
  border: 1px solid rgba(255, 255, 255, .1);
  border-radius: 16px;
  padding: 0 18px;
  color: #fff;
  background: rgba(255, 255, 255, .055);
  font: 850 14px/1 inherit;
  cursor: pointer;
  transition: transform .18s ease, filter .18s ease, background .18s ease;
}

.premium-trial-action:hover { transform: translateY(-1px); background: rgba(255, 255, 255, .085); }
.premium-trial-action:disabled { cursor: wait; opacity: .64; transform: none; }

.premium-trial-action--primary {
  border-color: transparent;
  background: linear-gradient(100deg, #ed4fa8, #a75de7);
  box-shadow: 0 12px 32px rgba(183, 67, 181, .25);
}

.premium-trial-action--primary:hover { background: linear-gradient(100deg, #f45db2, #b36bed); filter: brightness(1.04); }

.premium-trial-never {
  display: block;
  width: max-content;
  margin: 17px auto 0;
  border: 0;
  padding: 3px 6px;
  color: rgba(255, 255, 255, .43);
  background: transparent;
  font: 700 12px/1.2 inherit;
  cursor: pointer;
  transition: color .2s ease;
}

.premium-trial-never:hover { color: rgba(255, 255, 255, .78); }

.premium-trial-legal {
  margin: 13px auto 0;
  color: rgba(255, 255, 255, .34);
  font-size: 10px;
  line-height: 1.45;
  text-align: center;
}

.premium-trial-legal a { color: rgba(255, 255, 255, .52); text-decoration: underline; text-underline-offset: 2px; }
.premium-trial-legal a:hover { color: rgba(255, 255, 255, .8); }

.premium-trial-state {
  display: none;
  margin-top: 24px;
  padding: 18px;
  border: 1px solid rgba(255, 255, 255, .09);
  border-radius: 18px;
  background: rgba(5, 5, 10, .38);
}

.premium-trial-state.is-visible { display: block; }
.premium-trial-state strong { display: block; margin-bottom: 6px; font-size: 15px; }
.premium-trial-state p { margin: 0; color: rgba(255, 255, 255, .58); font-size: 13px; line-height: 1.5; }
.premium-trial-state a { color: #f7a7d4; font-weight: 800; }

.premium-trial-progress {
  height: 3px;
  overflow: hidden;
  margin-top: 14px;
  border-radius: 999px;
  background: rgba(255, 255, 255, .08);
}

.premium-trial-progress i {
  display: block;
  width: 42%;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, transparent, #f052ad, #b269e9, transparent);
  animation: premium-trial-scan 1.7s ease-in-out infinite;
}

.premium-trial-dialog.is-waiting .premium-trial-actions,
.premium-trial-dialog.is-waiting .premium-trial-legal,
.premium-trial-dialog.is-waiting .premium-trial-never { display: none; }

.premium-trial-dialog.is-success .premium-trial-state {
  border-color: rgba(90, 225, 165, .24);
  background: rgba(34, 132, 93, .09);
}

@keyframes premium-trial-scan {
  from { transform: translateX(-120%); }
  to { transform: translateX(330%); }
}

@media (max-width: 560px) {
  .premium-trial-overlay { align-items: end; padding: 12px max(10px, env(safe-area-inset-right)) max(10px, env(safe-area-inset-bottom)) max(10px, env(safe-area-inset-left)); }
  .premium-trial-dialog { width: 100%; border-radius: 26px; padding: 31px 22px 24px; }
  .premium-trial-brand { margin-bottom: 19px; }
  .premium-trial-copy h2 { padding-right: 18px; font-size: clamp(32px, 10.5vw, 43px); }
  .premium-trial-copy > p { font-size: 14px; }
  .premium-trial-features { margin: 19px 0 22px; }
  .premium-trial-actions { grid-template-columns: 1fr; }
  .premium-trial-action { min-height: 50px; }
}

@media (prefers-reduced-motion: reduce) {
  .premium-trial-overlay,
  .premium-trial-dialog,
  .premium-trial-action { transition: none; }
  .premium-trial-progress i { animation: none; width: 100%; }
}