/* Shared pulsing emblem — rotating ring + textPath */
let __emblemId = 0;
function PulseEmblem({ label = 'ourcly · agent matchmaker · ' }) {
  const pathIdRef = React.useRef(null);
  if (pathIdRef.current == null) pathIdRef.current = `rotcircle-${++__emblemId}`;
  const pid = pathIdRef.current;
  return (
    <div className="relative w-28 h-28 flex items-center justify-center pointer-events-none">
      <div className="pulse-ring"></div>
      <svg
        className="absolute inset-0 w-full h-full spin-slow"
        viewBox="0 0 100 100"
        style={{ transform: 'scale(1.55)' }}
        aria-hidden="true"
      >
        <defs>
          <path id={pid} d="M 50,50 m -38,0 a 38,38 0 1,1 76,0 a 38,38 0 1,1 -76,0" />
        </defs>
        <text
          xmlSpace="preserve"
          className="fill-white/85"
          style={{
            fontSize: '7.5px',
            letterSpacing: '0.18em',
            fontFamily: 'Recursive, monospace',
            fontVariationSettings: '"MONO" 1, "CASL" 0',
            textTransform: 'uppercase',
          }}
        >
          <textPath
            href={`#${pid}`}
            startOffset="0%"
            textLength="238"
            lengthAdjust="spacing"
          >{label}</textPath>
        </text>
      </svg>
    </div>
  );
}

window.PulseEmblem = PulseEmblem;