/* Peep-pink hearts drift around the Join button without capturing input. */
.login-button{position:relative;overflow:visible;isolation:isolate}
.login-button .join-hearts{
  position:absolute;inset:0;z-index:1;margin:0;font-size:initial;
  pointer-events:none;overflow:visible;
}
.join-hearts i{
  position:absolute;display:block;left:var(--heart-left);top:var(--heart-top);
  color:#f76cbd;font:normal var(--heart-size,12px)/1 sans-serif;
  text-shadow:0 1px 3px #7c205d77;opacity:0;pointer-events:none;
}
.join-hearts i::before{content:'♥'}
.join-hearts i:nth-child(1){--heart-left:-6px;--heart-top:45%;--heart-size:11px;--heart-x:-10px;--heart-y:-16px;--heart-delay:-.25s;--heart-time:2.1s}
.join-hearts i:nth-child(2){--heart-left:9%;--heart-top:108%;--heart-size:10px;--heart-x:-9px;--heart-y:-22px;--heart-delay:-1.25s;--heart-time:2.3s}
.join-hearts i:nth-child(3){--heart-left:29%;--heart-top:125%;--heart-size:13px;--heart-x:-6px;--heart-y:-28px;--heart-delay:-.65s;--heart-time:2.5s}
.join-hearts i:nth-child(4){--heart-left:55%;--heart-top:120%;--heart-size:10px;--heart-x:4px;--heart-y:-30px;--heart-delay:-1.7s;--heart-time:2.2s}
.join-hearts i:nth-child(5){--heart-left:78%;--heart-top:108%;--heart-size:13px;--heart-x:5px;--heart-y:-23px;--heart-delay:-1s;--heart-time:2.4s}
.join-hearts i:nth-child(6){--heart-left:94%;--heart-top:45%;--heart-size:11px;--heart-x:8px;--heart-y:-15px;--heart-delay:-1.9s;--heart-time:2.15s}
@keyframes join-heart-float{
  0%{opacity:0;transform:translate(0,0) scale(.55) rotate(-10deg)}
  20%{opacity:.95}
  70%{opacity:.85}
  100%{opacity:0;transform:translate(var(--heart-x),var(--heart-y)) scale(1.05) rotate(12deg)}
}
@media(any-hover:hover){
  .login-button:hover .join-hearts i{animation:join-heart-float var(--heart-time) ease-out var(--heart-delay) infinite}
}
.login-button:focus-visible .join-hearts i{animation:join-heart-float var(--heart-time) ease-out var(--heart-delay) infinite}
@media(prefers-reduced-motion:reduce){
  .login-button:is(:hover,:focus-visible) .join-hearts i{animation:none;opacity:.85;transform:scale(.85)}
}