// Shared SPOT logo — uses the trimmed white-on-transparent extraction
// of the user's icon. Drops in cleanly on any background and accepts a
// glow color so each variant can theme it.

function SpotMark({ size = 80, glow = false, accent = '#d8ff00', style, className }) {
  // The trim has aspect ~362x498 ≈ 0.727
  const w = size;
  const h = Math.round(size * (498 / 362));
  return (
    <img
      src="assets/spot-mark-trim.png"
      alt="SPOT"
      width={w}
      height={h}
      className={className}
      style={{
        display:'block',
        filter: glow ? `drop-shadow(0 0 28px ${accent}cc) drop-shadow(0 0 64px ${accent}55)` : 'none',
        transition: 'filter 0.5s ease',
        ...style,
      }}
    />
  );
}

window.SpotLogo = SpotMark;
window.SpotMark = SpotMark;