.bn-top{
  position:fixed;
  right:28px;
  bottom:28px;
  z-index:90;
  width:40px;
  height:40px;
  padding:0;
  display:flex;
  align-items:center;
  justify-content:center;
  border:1px solid var(--line2);
  background:var(--surface);
  color:var(--text);
  cursor:pointer;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .15s,visibility .15s,border-color .15s,background .15s;
  -webkit-tap-highlight-color:transparent;
}
.bn-top.is-visible{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
}
.bn-top:hover{
  border-color:var(--blue);
  color:#fff;
  background:rgba(37,99,235,0.12);
}
.bn-top:focus{
  outline:none;
}
.bn-top:focus-visible{
  border-color:var(--blue);
  box-shadow:0 0 0 2px rgba(37,99,235,0.35);
}
.bn-top svg{
  width:16px;
  height:16px;
  display:block;
}
@media(max-width:960px){
  .bn-top{
    right:16px;
    bottom:calc(24px + env(safe-area-inset-bottom, 0px));
    width:44px;
    height:44px;
  }
}