<svg width="400" height="400" viewBox="0 0 400 400" xmlns="http://www.w3.org/2000/svg">
  <rect width="400" height="400" fill="#f3f4f6"/>

  <!-- Monitor/Screen -->
  <g transform="translate(70, 60)">
    <rect x="0" y="0" width="260" height="180" rx="8" fill="white" stroke="#d1d5db" stroke-width="2"/>
    <rect x="10" y="10" width="240" height="160" rx="4" fill="#1f2937"/>

    <!-- CTR Display -->
    <text x="130" y="70" text-anchor="middle" font-family="system-ui" font-size="48" fill="#10b981" font-weight="bold">2.5%</text>
    <text x="130" y="95" text-anchor="middle" font-family="system-ui" font-size="14" fill="#6b7280">CTR</text>

    <!-- Metrics bar -->
    <rect x="20" y="110" width="200" height="4" rx="2" fill="#374151"/>
    <rect x="20" y="110" width="100" height="4" rx="2" fill="#10b981"/>

    <!-- Small stats -->
    <text x="25" y="135" font-family="system-ui" font-size="10" fill="#9ca3af">10K</text>
    <text x="25" y="148" font-family="system-ui" font-size="8" fill="#6b7280">Impressions</text>

    <text x="100" y="135" font-family="system-ui" font-size="10" fill="#9ca3af">250</text>
    <text x="100" y="148" font-family="system-ui" font-size="8" fill="#6b7280">Clicks</text>
  </g>

  <!-- Pointer/Cursor Icon -->
  <g transform="translate(180, 160)">
    <path d="M0,0 L0,20 L5,15 L10,22 L12,21 L7,14 L14,14 Z" fill="#3b82f6" stroke="#1e40af" stroke-width="1"/>
  </g>

  <!-- Click burst effect -->
  <g transform="translate(185, 165)">
    <circle cx="0" cy="0" r="8" fill="none" stroke="#3b82f6" stroke-width="2" opacity="0.6"/>
    <circle cx="0" cy="0" r="13" fill="none" stroke="#3b82f6" stroke-width="1.5" opacity="0.3"/>
    <circle cx="0" cy="0" r="18" fill="none" stroke="#3b82f6" stroke-width="1" opacity="0.15"/>
  </g>

  <!-- Chart/Graph -->
  <g transform="translate(50, 260)">
    <!-- Axes -->
    <line x1="0" y1="80" x2="300" y2="80" stroke="#9ca3af" stroke-width="2"/>
    <line x1="0" y1="0" x2="0" y2="80" stroke="#9ca3af" stroke-width="2"/>

    <!-- Bars -->
    <rect x="20" y="30" width="35" height="50" rx="3" fill="#10b981"/>
    <rect x="75" y="40" width="35" height="40" rx="3" fill="#3b82f6"/>
    <rect x="130" y="15" width="35" height="65" rx="3" fill="#10b981"/>
    <rect x="185" y="35" width="35" height="45" rx="3" fill="#6366f1"/>
    <rect x="240" y="10" width="35" height="70" rx="3" fill="#10b981"/>

    <!-- Labels -->
    <text x="37" y="95" text-anchor="middle" font-family="system-ui" font-size="8" fill="#6b7280">Day 1</text>
    <text x="92" y="95" text-anchor="middle" font-family="system-ui" font-size="8" fill="#6b7280">Day 2</text>
    <text x="147" y="95" text-anchor="middle" font-family="system-ui" font-size="8" fill="#6b7280">Day 3</text>
    <text x="202" y="95" text-anchor="middle" font-family="system-ui" font-size="8" fill="#6b7280">Day 4</text>
    <text x="257" y="95" text-anchor="middle" font-family="system-ui" font-size="8" fill="#6b7280">Day 5</text>

    <!-- Trend arrow -->
    <path d="M260,25 L280,15 L280,25 Z" fill="#10b981"/>
    <line x1="190" y1="40" x2="260" y2="25" stroke="#10b981" stroke-width="2" stroke-dasharray="3,3"/>
  </g>

  <!-- Rating stars -->
  <g transform="translate(280, 80)">
    <text x="0" y="0" font-size="20">⭐</text>
    <text x="0" y="25" font-size="20">⭐</text>
    <text x="0" y="50" font-size="20">⭐</text>
  </g>

  <!-- Percentage badge -->
  <g transform="translate(320, 180)">
    <circle cx="30" cy="30" r="28" fill="#3b82f6" stroke="#1e40af" stroke-width="2"/>
    <text x="30" y="37" text-anchor="middle" font-family="system-ui" font-size="18" fill="white" font-weight="bold">+50%</text>
  </g>

  <text x="200" y="385" text-anchor="middle" font-family="system-ui" font-size="16" font-weight="600" fill="#1f2937">CTR Calculator</text>
</svg>
