/* Install nudge. Scoped hard so it cannot leak into the theme. */

.suroy-install{
  position:fixed; left:12px; right:12px; bottom:12px; z-index:99999;
  max-width:420px; margin:0 auto;
  background:#171717; color:#FBF8F2;
  border-radius:6px; padding:18px 44px 18px 18px;
  box-shadow:0 12px 40px rgba(0,0,0,.34);
  font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  transform:translateY(140%); opacity:0;
  transition:transform .32s cubic-bezier(.2,.7,.3,1), opacity .32s;
}
.suroy-install.is-in{transform:translateY(0); opacity:1}

@media(min-width:900px){
  .suroy-install{left:auto; right:24px; bottom:24px; width:380px; margin:0}
}

.suroy-install__t{
  margin:0 0 6px; font-size:15px; font-weight:600; line-height:1.35; color:#FBF8F2;
}
.suroy-install__s{
  margin:0; font-size:13px; line-height:1.55; color:rgba(251,248,242,.72);
}
.suroy-install__steps{
  margin:10px 0 0; padding:0 0 0 18px; font-size:13px; line-height:1.7;
  color:rgba(251,248,242,.72);
}
.suroy-install__steps li{margin:0}
.suroy-install__steps strong{color:#FBF8F2; font-weight:600}
.suroy-install__steps svg{vertical-align:-2px; margin:0 1px}

.suroy-install__go{
  display:block; width:100%; margin:14px 0 0;
  background:#E8832A; color:#171717; border:0; border-radius:3px;
  padding:12px 16px; font:inherit; font-size:14px; font-weight:600;
  cursor:pointer; min-height:44px;
}
.suroy-install__go:hover{background:#f0913c}

.suroy-install__x{
  position:absolute; top:8px; right:8px; width:32px; height:32px;
  background:none; border:0; color:rgba(251,248,242,.55);
  font-size:22px; line-height:1; cursor:pointer; border-radius:3px;
}
.suroy-install__x:hover{color:#FBF8F2}

@media(prefers-reduced-motion:reduce){
  .suroy-install{transition:none; transform:none; opacity:1}
}
