.satoads-pwa{
  --pwa-ease:var(--satoads-ease,cubic-bezier(0.22,1,0.36,1));
  --pwa-card:var(--satoads-surface,#191919);
  --pwa-ink:var(--satoads-text,#ffffff);
  --pwa-body:var(--satoads-body,#dadbdf);
  --pwa-mute:var(--satoads-text-muted,#7d8187);
  --pwa-hair:var(--satoads-hairline,#212327);
  --pwa-outline:var(--satoads-outline-border,rgba(255,255,255,0.25));
  --pwa-radius:var(--satoads-radius,8px);
  --pwa-accent:var(--satoads-accent,#ff7a17);
  box-sizing:border-box;
  font-family:var(--satoads-font,inherit)
}
.satoads-pwa *,
.satoads-pwa *::before,
.satoads-pwa *::after{box-sizing:border-box}
.satoads-pwa:not(.is-preview){
  position:fixed;
  inset:0;
  z-index:100050;
  display:grid;
  place-items:end center;
  padding:max(12px,env(safe-area-inset-top)) 12px max(12px,env(safe-area-inset-bottom))
}
.satoads-pwa[hidden]{display:none!important}
.satoads-pwa:not(.is-preview).is-open{display:grid!important}
.satoads-pwa__scrim{
  position:absolute;
  inset:0;
  background:rgba(10,10,10,0.72);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px)
}
.satoads-pwa__sheet{
  position:relative;
  z-index:1;
  width:min(100%,420px);
  padding:24px 20px 20px;
  background:var(--pwa-card);
  color:var(--pwa-ink);
  border:1px solid var(--pwa-hair);
  border-radius:var(--pwa-radius);
  outline:none
}
.satoads-pwa__close{
  position:absolute;
  top:12px;
  inset-inline-end:12px;
  z-index:2;
  width:36px;
  height:36px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  margin:0;
  padding:0;
  border:1px solid var(--pwa-outline);
  border-radius:var(--pwa-radius);
  background:color-mix(in srgb,var(--pwa-card) 82%,transparent);
  color:var(--pwa-ink);
  cursor:pointer
}
.satoads-pwa__close:focus-visible{
  outline:2px solid var(--pwa-ink);
  outline-offset:2px
}
.satoads-pwa__app{
  display:flex;
  align-items:center;
  gap:12px;
  margin:0 0 16px;
  padding-inline-end:40px
}
.satoads-pwa__icon{
  width:56px;
  height:56px;
  flex:0 0 56px;
  overflow:hidden;
  border-radius:14px;
  background:var(--satoads-surface-2,#1a1c20);
  border:1px solid var(--pwa-hair)
}
.satoads-pwa__icon img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover
}
.satoads-pwa__icon.is-letter{
  display:flex;
  align-items:center;
  justify-content:center;
  background:var(--pwa-ink);
  color:var(--pwa-card);
  font-size:22px;
  font-weight:500;
  letter-spacing:-0.04em
}
.satoads-pwa__meta{
  display:flex;
  flex-direction:column;
  gap:2px;
  min-width:0
}
.satoads-pwa__meta strong{
  font-size:16px;
  font-weight:500;
  letter-spacing:-0.03em;
  line-height:1.3;
  color:var(--pwa-ink)
}
.satoads-pwa__meta span{
  font-family:var(--satoads-font-mono,ui-monospace,monospace);
  font-size:12px;
  letter-spacing:1.1px;
  text-transform:uppercase;
  color:var(--pwa-mute)
}
.satoads-pwa__title{
  margin:0 0 8px;
  font-size:clamp(18px,2.8vw,22px);
  font-weight:400;
  letter-spacing:-0.04em;
  line-height:1.3;
  color:var(--pwa-ink)
}
.satoads-pwa__copy{
  margin:0 0 16px;
  font-size:15px;
  font-weight:400;
  line-height:1.55;
  color:var(--pwa-body)
}
.satoads-pwa__steps{
  margin:0 0 16px;
  padding:12px 12px 4px;
  list-style:none;
  border:1px solid var(--pwa-hair);
  border-radius:var(--pwa-radius);
  background:color-mix(in srgb,var(--pwa-ink) 4%,transparent)
}
.satoads-pwa__steps[hidden]{display:none!important}
.satoads-pwa__steps li{
  display:flex;
  align-items:flex-start;
  gap:10px;
  margin:0 0 10px;
  font-size:13px;
  line-height:1.45;
  color:var(--pwa-body)
}
.satoads-pwa__step-icon{
  flex:0 0 28px;
  width:28px;
  height:28px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:8px;
  border:1px solid var(--pwa-outline);
  color:var(--pwa-ink)
}
.satoads-pwa__actions{
  display:flex;
  flex-wrap:wrap;
  gap:8px
}
.satoads-pwa .satoads-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  min-height:40px;
  padding:8px 16px;
  border-radius:var(--satoads-radius,8px);
  font-family:inherit;
  font-size:14px;
  font-weight:400;
  line-height:20px;
  border:1px solid transparent;
  cursor:pointer;
  box-shadow:none
}
.satoads-pwa .satoads-btn-primary{
  flex:1 1 auto;
  background:var(--satoads-primary,#ffffff);
  color:var(--satoads-on-primary,#0a0a0a);
  border-color:var(--satoads-primary,#ffffff)
}
.satoads-pwa .satoads-btn-outline{
  background:transparent;
  color:var(--pwa-ink);
  border-color:var(--pwa-outline)
}
.satoads-pwa.is-ios .satoads-pwa__install.is-guide{
  pointer-events:none;
  opacity:0.72
}

html.satoads-pwa-open,
html.satoads-pwa-open body{overflow:hidden}

.satoads-pwa:not(.is-preview):not(.is-open) .satoads-pwa__sheet,
.satoads-pwa:not(.is-preview):not(.is-open) .satoads-pwa__scrim{
  opacity:0;
  pointer-events:none
}
.satoads-pwa:not(.is-preview).is-open .satoads-pwa__scrim{
  animation:satoads-pwa-scrim 0.28s var(--pwa-ease) both
}
.satoads-pwa:not(.is-preview).is-open .satoads-pwa__sheet{
  animation:satoads-pwa-sheet 0.34s var(--pwa-ease) both
}
.satoads-pwa.is-closing .satoads-pwa__scrim{
  animation:satoads-pwa-scrim-out 0.2s ease both
}
.satoads-pwa.is-closing .satoads-pwa__sheet{
  animation:satoads-pwa-sheet-out 0.2s ease both
}

@keyframes satoads-pwa-scrim{
  from{opacity:0}
  to{opacity:1}
}
@keyframes satoads-pwa-sheet{
  from{opacity:0;transform:translateY(16px)}
  to{opacity:1;transform:none}
}
@keyframes satoads-pwa-scrim-out{
  to{opacity:0}
}
@keyframes satoads-pwa-sheet-out{
  to{opacity:0;transform:translateY(12px)}
}

@media (min-width:721px){
  .satoads-pwa:not(.is-preview){
    place-items:center;
    padding:24px
  }
}

.satoads-pwa.is-preview{
  position:relative;
  display:block;
  max-width:420px;
  pointer-events:none
}
.satoads-pwa.is-preview .satoads-pwa__sheet{
  width:100%
}
.satoads-pwa-admin .mps-prefs-notice-warn{
  background:#fcf9e8;
  border-color:#dba617;
  color:#614200
}
.satoads-pwa-admin-preview{
  margin-top:8px;
  padding:20px;
  border:1px dashed var(--satoads-hairline,#dcdcde);
  border-radius:8px;
  background:#0a0a0a
}
.satoads-pwa-admin-preview .satoads-pwa{
  --pwa-card:#191919;
  --pwa-ink:#ffffff;
  --pwa-body:#dadbdf;
  --pwa-mute:#7d8187;
  --pwa-hair:#212327;
  --pwa-outline:rgba(255,255,255,0.25);
  --satoads-primary:#ffffff;
  --satoads-on-primary:#0a0a0a
}

@media (prefers-reduced-motion:reduce){
  .satoads-pwa__scrim,
  .satoads-pwa__sheet,
  .satoads-pwa.is-open .satoads-pwa__scrim,
  .satoads-pwa.is-open .satoads-pwa__sheet,
  .satoads-pwa.is-closing .satoads-pwa__scrim,
  .satoads-pwa.is-closing .satoads-pwa__sheet{
    animation:none!important
  }
}