// portal-logo.jsx — Second World portal logo

function PortalLogo({ size = 32, animated = true }) {
  return (
    <svg width={size} height={size} viewBox="0 0 64 64" fill="none"
         style={{ display: 'block' }}>
      <defs>
        <radialGradient id="pg-core" cx="50%" cy="50%" r="50%">
          <stop offset="0%" stopColor="oklch(0.92 0.14 268)" />
          <stop offset="50%" stopColor="oklch(0.7 0.18 268)" />
          <stop offset="100%" stopColor="oklch(0.4 0.18 268 / 0)" />
        </radialGradient>
        <linearGradient id="pg-ring" x1="0" y1="0" x2="1" y2="1">
          <stop offset="0%" stopColor="oklch(0.85 0.16 268)" />
          <stop offset="50%" stopColor="oklch(0.78 0.14 195)" />
          <stop offset="100%" stopColor="oklch(0.6 0.18 320)" />
        </linearGradient>
        <linearGradient id="pg-ring2" x1="1" y1="0" x2="0" y2="1">
          <stop offset="0%" stopColor="oklch(0.78 0.14 195)" />
          <stop offset="100%" stopColor="oklch(0.85 0.16 268)" />
        </linearGradient>
      </defs>
      {/* Outer portal ring (vertical ellipse) */}
      <ellipse cx="32" cy="32" rx="13" ry="26"
               stroke="url(#pg-ring)" strokeWidth="1.6" fill="none"
               style={animated ? { transformOrigin: '32px 32px', animation: 'portalSpin 12s linear infinite' } : {}} />
      {/* Inner ring (horizontal-ish) */}
      <ellipse cx="32" cy="32" rx="26" ry="13"
               stroke="url(#pg-ring2)" strokeWidth="1.6" fill="none"
               opacity="0.85"
               style={animated ? { transformOrigin: '32px 32px', animation: 'portalSpin2 16s linear infinite reverse' } : {}} />
      {/* Glowing core */}
      <circle cx="32" cy="32" r="8" fill="url(#pg-core)"
              style={animated ? { animation: 'portalPulse 3s ease-in-out infinite' } : {}} />
      {/* Tiny stars */}
      <circle cx="14" cy="20" r="0.8" fill="white" opacity="0.7" />
      <circle cx="50" cy="46" r="0.6" fill="white" opacity="0.5" />
      <circle cx="48" cy="16" r="0.5" fill="white" opacity="0.6" />
    </svg>
  );
}

window.PortalLogo = PortalLogo;