
#wanderer {
    position: absolute;
    width: 30px;
    height: 30px;
    background-color: white;
    border-radius: 50%;
    opacity: 0.8;
    box-shadow: 0 0 25px white;
    transition: top 3s ease, left 3s ease;
    animation: pulse 3s ease-in-out infinite;
}
#loading-wanderer {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #000; /* Match your background */
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 999999;
    pointer-events: none;
  }

  /* Optional: size change for small screens */
  @media (max-width: 768px) {
    #wanderer {
      width: 18px;
      height: 18px;
    }
  }
  @keyframes pulse {
    0%, 100% { transform: scale(1); }
    50%      { transform: scale(1.2); }
  }

  #loading-wanderer.fade-out {
    animation: fadeOut 0.5s ease forwards;
  }
  
  @keyframes fadeOut {
    to {
      opacity: 0;
      visibility: hidden;
    }
  }