frontend/src/logo.svg

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 200 200">
  <defs>
    <linearGradient id="bgGradient" x1="0%" y1="0%" x2="100%" y2="100%">
      <stop offset="0%" style="stop-color:#f3e7e9;stop-opacity:1" />
      <stop offset="100%" style="stop-color:#e3eeff;stop-opacity:1" />
    </linearGradient>
    <radialGradient id="centerGlow" cx="50%" cy="50%" r="50%" fx="50%" fy="50%">
      <stop offset="0%" style="stop-color:#ffffff;stop-opacity:0.8" />
      <stop offset="100%" style="stop-color:#ffffff;stop-opacity:0" />
    </radialGradient>
    <filter id="dropShadow" x="-20%" y="-20%" width="140%" height="140%">
      <feGaussianBlur in="SourceAlpha" stdDeviation="2" />
      <feOffset dx="2" dy="2" result="offsetblur" />
      <feComponentTransfer>
        <feFuncA type="linear" slope="0.2" />
      </feComponentTransfer>
      <feMerge>
        <feMergeNode />
        <feMergeNode in="SourceGraphic" />
      </feMerge>
    </filter>
  </defs>
  
  <circle cx="100" cy="100" r="90" fill="url(#centerGlow)" />
  
  <g filter="url(#dropShadow)">
    <g transform="rotate(15, 100, 100)">
      <ellipse cx="100" cy="100" rx="80" ry="70" fill="none" stroke="url(#ellipse1)" stroke-width="3" />
      <ellipse cx="100" cy="100" rx="60" ry="50" fill="none" stroke="url(#ellipse2)" stroke-width="3" />
      <ellipse cx="100" cy="100" rx="40" ry="30" fill="none" stroke="url(#ellipse3)" stroke-width="3" />
    </g>
    
    <path d="M 100 100 Q 150 50, 180 100 T 100 180 T 20 100 T 100 20 T 180 100" fill="none" stroke="url(#spiral)" stroke-width="3" />
    
    <g transform="rotate(-15, 100, 100)">
      <path d="M 20 100 C 60 60, 140 140, 180 100" fill="none" stroke="url(#curve1)" stroke-width="3" />
      <path d="M 100 20 C 140 60, 60 140, 100 180" fill="none" stroke="url(#curve2)" stroke-width="3" />
    </g>
  </g>
  
  <text>
    <textPath href="#formula" startOffset="10%">
      <tspan font-family="Arial, sans-serif" font-size="14" fill="#4a4a4a" font-weight="bold">3ⁿ</tspan>
      <tspan font-family="Arial, sans-serif" font-size="14" fill="#4a4a4a" font-weight="bold"> · 2ᵐ</tspan>
      <tspan font-family="Arial, sans-serif" font-size="14" fill="#4a4a4a" font-weight="bold"> + ...</tspan>
    </textPath>
  </text>
  
  <path id="formula" d="M 100 100 m -75 0 a 75 75 0 1 1 150 0 a 75 75 0 1 1 -150 0" fill="none" />
  
  <defs>
    <linearGradient id="ellipse1" x1="0%" y1="0%" x2="100%" y2="100%">
      <stop offset="0%" style="stop-color:#405de6" />
      <stop offset="100%" style="stop-color:#5851db" />
    </linearGradient>
    <linearGradient id="ellipse2" x1="0%" y1="0%" x2="100%" y2="100%">
      <stop offset="0%" style="stop-color:#fd1d1d" />
      <stop offset="100%" style="stop-color:#fc6767" />
    </linearGradient>
    <linearGradient id="ellipse3" x1="0%" y1="0%" x2="100%" y2="100%">
      <stop offset="0%" style="stop-color:#4facfe" />
      <stop offset="100%" style="stop-color:#00f2fe" />
    </linearGradient>
    <linearGradient id="spiral" x1="0%" y1="0%" x2="100%" y2="100%">
      <stop offset="0%" style="stop-color:#667eea" />
      <stop offset="100%" style="stop-color:#764ba2" />
    </linearGradient>
    <linearGradient id="curve1" x1="0%" y1="0%" x2="100%" y2="100%">
      <stop offset="0%" style="stop-color:#ff9a9e" />
      <stop offset="100%" style="stop-color:#fad0c4" />
    </linearGradient>
    <linearGradient id="curve2" x1="0%" y1="0%" x2="100%" y2="100%">
      <stop offset="0%" style="stop-color:#a18cd1" />
      <stop offset="100%" style="stop-color:#fbc2eb" />
    </linearGradient>
  </defs>
</svg>