#toTop{
  position:fixed;
  right:20px;
  bottom:calc(24px + env(safe-area-inset-bottom));
  width:48px;height:48px;border-radius:999px;border:0;
  background:var(--brand); color:#fff;
  display:grid; place-items:center;
  box-shadow:0 10px 30px rgba(124,58,237,.35), inset 0 1px 0 rgba(255,255,255,.15);
  opacity:0; visibility:hidden; transform:translateY(8px);
  transition:opacity .18s ease, transform .18s ease, box-shadow .18s ease;
  z-index:90; cursor:pointer;
}
#toTop svg{ width:22px;height:22px; }
#toTop:hover{ box-shadow:0 14px 34px rgba(124,58,237,.45), inset 0 1px 0 rgba(255,255,255,.2) }
#toTop:focus{ outline:2px solid rgba(255,255,255,.35); outline-offset:2px }
#toTop.show{ opacity:1; visibility:visible; transform:translateY(0) }
@media (max-width:980px){ #toTop{ right:16px; bottom:calc(20px + env(safe-area-inset-bottom)); width:44px; height:44px } }