.back-to-top {
  position:fixed;
  right:26px;
  bottom:26px;
  z-index:30;
  display:grid;
  place-items:center;
  width:48px;
  height:48px;
  border-radius:50%;
  border:1px solid #d9efff99;
  color:#fff;
  background:linear-gradient(135deg,#328aff80,#091d48c9);
  box-shadow:inset 0 1px 5px #ffffff50,0 8px 28px #000a;
  backdrop-filter:blur(18px);
  font-size:25px;
  cursor:pointer;
  opacity:0;
  visibility:hidden;
  transform:translateY(12px);
  transition:opacity .25s,transform .25s,visibility .25s
}

.back-to-top.is-visible {
  opacity:1;
  visibility:visible;
  transform:none
}

.back-to-top:focus-visible {
  outline:2px solid #98d8ff;
  outline-offset:4px
}

@media(max-width:850px) {
  .back-to-top {
    right:18px;
    bottom:18px;
    width:44px;
    height:44px
  }

}

@media(prefers-reduced-motion:reduce) {
  .back-to-top {
    transition:none
  }

}