function squirclePath(size, r = 0.2237) {
  const k = size * r;
  return `M0,${k} C0,${k * 0.35} ${k * 0.35},0 ${k},0 L${size - k},0 C${size - k * 0.35},0 ${size},${k * 0.35} ${size},${k} L${size},${size - k} C${size},${size - k * 0.35} ${size - k * 0.35},${size} ${size - k},${size} L${k},${size} C${k * 0.35},${size} 0,${size - k * 0.35} 0,${size - k} Z`;
}

function IconE({ size = 256, radius = 0.2237 }) {
  const id = React.useId();
  const s = 1024;
  return (
    <svg width={size} height={size} viewBox={`0 0 ${s} ${s}`} style={{ display: 'block' }}>
      <defs>
        <clipPath id={`clipE-${id}`}><path d={squirclePath(s, radius)} /></clipPath>
        <linearGradient id={`paperE-${id}`} x1="0" y1="0" x2="1" y2="1">
          <stop offset="0%"  stopColor="#FAF0D6" />
          <stop offset="100%" stopColor="#F0E1B8" />
        </linearGradient>
      </defs>

      <g clipPath={`url(#clipE-${id})`}>
        <rect width={s} height={s} fill={`url(#paperE-${id})`} />

        <g fill="#0F1E2E" opacity="0.04">
          {Array.from({length: 80}).map((_, i) => (
            <circle key={i} cx={(i * 137) % 1024} cy={(i * 211) % 1024} r="1.5" />
          ))}
        </g>

        <line x1="200" y1="60" x2="200" y2="964" stroke="#C44A4A" strokeWidth="3" opacity="0.45" />

        <g stroke="#1E5A8C" strokeWidth="1.6" opacity="0.18">
          <line x1="60" y1="280" x2="964" y2="280" />
          <line x1="60" y1="380" x2="964" y2="380" />
          <line x1="60" y1="480" x2="964" y2="480" />
          <line x1="60" y1="580" x2="964" y2="580" />
          <line x1="60" y1="680" x2="964" y2="680" />
          <line x1="60" y1="780" x2="964" y2="780" />
        </g>

        <text x="300" y="780" textAnchor="start" dominantBaseline="alphabetic"
          fontFamily="Georgia, 'Times New Roman', serif" fontWeight="900"
          fontSize="720" fill="#061830" letterSpacing="-20">L</text>

        <g transform="translate(700, 700) rotate(-8)">
          <circle cx="0" cy="0" r="110" fill="none" stroke="#00A7E2" strokeWidth="14" opacity="0.9" />
          <path d="M -38,5 L -8,38 L 50,-30" stroke="#00A7E2" strokeWidth="22"
            strokeLinecap="round" strokeLinejoin="round" fill="none" />
        </g>
      </g>
    </svg>
  );
}

Object.assign(window, { squirclePath, IconE });
