eval_ex

<svg xmlns="http://www.w3.org/2000/svg" viewBox="35 5 330 390" width="330" height="390">
  <defs>
    <!-- Premium gradient for main hexagon -->
    <linearGradient id="hexGrad" x1="0%" y1="0%" x2="100%" y2="100%">
      <stop offset="0%" style="stop-color:#1E1B4B;stop-opacity:1" />
      <stop offset="35%" style="stop-color:#312E81;stop-opacity:1" />
      <stop offset="65%" style="stop-color:#3730A3;stop-opacity:1" />
      <stop offset="100%" style="stop-color:#1E1B4B;stop-opacity:1" />
    </linearGradient>

    <!-- Outer ring gradient -->
    <linearGradient id="ringGrad" x1="0%" y1="0%" x2="100%" y2="100%">
      <stop offset="0%" style="stop-color:#818CF8;stop-opacity:1" />
      <stop offset="50%" style="stop-color:#6366F1;stop-opacity:1" />
      <stop offset="100%" style="stop-color:#4F46E5;stop-opacity:1" />
    </linearGradient>

    <!-- Metallic accent gradient -->
    <linearGradient id="metallicGrad" x1="0%" y1="0%" x2="100%" y2="100%">
      <stop offset="0%" style="stop-color:#E0E7FF;stop-opacity:1" />
      <stop offset="25%" style="stop-color:#A5B4FC;stop-opacity:1" />
      <stop offset="50%" style="stop-color:#C7D2FE;stop-opacity:1" />
      <stop offset="75%" style="stop-color:#818CF8;stop-opacity:1" />
      <stop offset="100%" style="stop-color:#E0E7FF;stop-opacity:1" />
    </linearGradient>

    <!-- Chart bar gradients -->
    <linearGradient id="bar1Grad" x1="0%" y1="100%" x2="0%" y2="0%">
      <stop offset="0%" style="stop-color:#06B6D4;stop-opacity:1" />
      <stop offset="100%" style="stop-color:#22D3EE;stop-opacity:1" />
    </linearGradient>
    <linearGradient id="bar2Grad" x1="0%" y1="100%" x2="0%" y2="0%">
      <stop offset="0%" style="stop-color:#10B981;stop-opacity:1" />
      <stop offset="100%" style="stop-color:#34D399;stop-opacity:1" />
    </linearGradient>
    <linearGradient id="bar3Grad" x1="0%" y1="100%" x2="0%" y2="0%">
      <stop offset="0%" style="stop-color:#8B5CF6;stop-opacity:1" />
      <stop offset="100%" style="stop-color:#A78BFA;stop-opacity:1" />
    </linearGradient>
    <linearGradient id="bar4Grad" x1="0%" y1="100%" x2="0%" y2="0%">
      <stop offset="0%" style="stop-color:#F59E0B;stop-opacity:1" />
      <stop offset="100%" style="stop-color:#FBBF24;stop-opacity:1" />
    </linearGradient>

    <!-- Checkmark gradient -->
    <linearGradient id="checkGrad" x1="0%" y1="0%" x2="100%" y2="100%">
      <stop offset="0%" style="stop-color:#34D399;stop-opacity:1" />
      <stop offset="100%" style="stop-color:#10B981;stop-opacity:1" />
    </linearGradient>

    <!-- Radial glow for center -->
    <radialGradient id="centerGlow" cx="50%" cy="50%" r="50%">
      <stop offset="0%" style="stop-color:#6366F1;stop-opacity:0.4" />
      <stop offset="100%" style="stop-color:#1E1B4B;stop-opacity:0" />
    </radialGradient>

    <!-- Circuit pattern gradient -->
    <linearGradient id="circuitGrad" x1="0%" y1="0%" x2="100%" y2="0%">
      <stop offset="0%" style="stop-color:#4F46E5;stop-opacity:0.3" />
      <stop offset="50%" style="stop-color:#6366F1;stop-opacity:0.6" />
      <stop offset="100%" style="stop-color:#4F46E5;stop-opacity:0.3" />
    </linearGradient>

    <!-- Advanced drop shadow -->
    <filter id="dropShadow" x="-50%" y="-50%" width="200%" height="200%">
      <feGaussianBlur in="SourceAlpha" stdDeviation="8" result="blur"/>
      <feOffset dx="0" dy="4" result="offsetBlur"/>
      <feFlood flood-color="#000000" flood-opacity="0.5"/>
      <feComposite in2="offsetBlur" operator="in"/>
      <feMerge>
        <feMergeNode/>
        <feMergeNode in="SourceGraphic"/>
      </feMerge>
    </filter>

    <!-- Outer glow filter -->
    <filter id="outerGlow" x="-100%" y="-100%" width="300%" height="300%">
      <feGaussianBlur in="SourceGraphic" stdDeviation="4" result="blur"/>
      <feFlood flood-color="#818CF8" flood-opacity="0.6"/>
      <feComposite in2="blur" operator="in"/>
      <feMerge>
        <feMergeNode/>
        <feMergeNode in="SourceGraphic"/>
      </feMerge>
    </filter>

    <!-- Inner shadow for depth -->
    <filter id="innerShadow" x="-50%" y="-50%" width="200%" height="200%">
      <feComponentTransfer in="SourceAlpha">
        <feFuncA type="table" tableValues="1 0"/>
      </feComponentTransfer>
      <feGaussianBlur stdDeviation="3"/>
      <feOffset dx="2" dy="3" result="offsetblur"/>
      <feFlood flood-color="#000" flood-opacity="0.4" result="color"/>
      <feComposite in2="offsetblur" operator="in"/>
      <feComposite in2="SourceAlpha" operator="in"/>
      <feMerge>
        <feMergeNode in="SourceGraphic"/>
        <feMergeNode/>
      </feMerge>
    </filter>

    <!-- Emboss filter for 3D effect -->
    <filter id="emboss">
      <feConvolveMatrix order="3" kernelMatrix="2 0 0 0 1 0 0 0 -1" preserveAlpha="true"/>
    </filter>

    <!-- Soft glow for icons -->
    <filter id="softGlow">
      <feGaussianBlur stdDeviation="2" result="coloredBlur"/>
      <feMerge>
        <feMergeNode in="coloredBlur"/>
        <feMergeNode in="SourceGraphic"/>
      </feMerge>
    </filter>

    <!-- Bar glow -->
    <filter id="barGlow">
      <feGaussianBlur stdDeviation="1.5" result="blur"/>
      <feMerge>
        <feMergeNode in="blur"/>
        <feMergeNode in="SourceGraphic"/>
      </feMerge>
    </filter>

    <!-- Hexagon clip path -->
    <clipPath id="hexClip">
      <path d="M 200,28 L 345,115 L 345,285 L 200,372 L 55,285 L 55,115 Z"/>
    </clipPath>

    <!-- Data node pattern -->
    <pattern id="dataNodes" x="0" y="0" width="40" height="40" patternUnits="userSpaceOnUse">
      <circle cx="20" cy="20" r="1.5" fill="#6366F1" opacity="0.3"/>
      <circle cx="0" cy="0" r="1" fill="#818CF8" opacity="0.2"/>
      <circle cx="40" cy="40" r="1" fill="#818CF8" opacity="0.2"/>
    </pattern>

    <!-- Circuit line pattern -->
    <pattern id="circuitLines" x="0" y="0" width="60" height="60" patternUnits="userSpaceOnUse">
      <path d="M0 30 L20 30 L25 25 L35 25 L40 30 L60 30" fill="none" stroke="#4F46E5" stroke-width="0.5" opacity="0.15"/>
      <path d="M30 0 L30 20 L25 25" fill="none" stroke="#4F46E5" stroke-width="0.5" opacity="0.15"/>
      <circle cx="25" cy="25" r="2" fill="none" stroke="#6366F1" stroke-width="0.5" opacity="0.2"/>
    </pattern>
  </defs>

  <!-- Background ambient glow -->
  <ellipse cx="200" cy="200" rx="180" ry="180" fill="url(#centerGlow)" opacity="0.5"/>

  <!-- Outer hexagon frame with glow -->
  <path d="M 200,15 L 355,105 L 355,295 L 200,385 L 45,295 L 45,105 Z"
        fill="none"
        stroke="url(#metallicGrad)"
        stroke-width="6"
        filter="url(#outerGlow)"
        opacity="0.8"/>

  <!-- Main hexagon with shadow -->
  <path d="M 200,25 L 348,112 L 348,288 L 200,375 L 52,288 L 52,112 Z"
        fill="url(#hexGrad)"
        stroke="url(#ringGrad)"
        stroke-width="3"
        filter="url(#dropShadow)"/>

  <!-- Inner decorative hexagon ring -->
  <path d="M 200,40 L 335,120 L 335,280 L 200,360 L 65,280 L 65,120 Z"
        fill="none"
        stroke="#4F46E5"
        stroke-width="1.5"
        stroke-dasharray="8 4"
        opacity="0.4"/>

  <!-- Background pattern layer -->
  <g clip-path="url(#hexClip)" opacity="0.6">
    <rect x="40" y="40" width="320" height="380" fill="url(#dataNodes)"/>
    <rect x="40" y="40" width="320" height="380" fill="url(#circuitLines)"/>
  </g>

  <!-- Radial center glow -->
  <ellipse cx="200" cy="200" rx="100" ry="100" fill="url(#centerGlow)"/>

  <!-- Decorative corner accents on hexagon -->
  <g stroke="#818CF8" stroke-width="2" fill="none" opacity="0.6">
    <!-- Top -->
    <path d="M 200,40 L 200,60"/>
    <!-- Top right -->
    <path d="M 335,120 L 315,130"/>
    <!-- Bottom right -->
    <path d="M 335,280 L 315,270"/>
    <!-- Bottom -->
    <path d="M 200,360 L 200,340"/>
    <!-- Bottom left -->
    <path d="M 65,280 L 85,270"/>
    <!-- Top left -->
    <path d="M 65,120 L 85,130"/>
  </g>

  <!-- Central evaluation chart display base -->
  <g transform="translate(200, 200)">
    <!-- Chart background panel with glass effect -->
    <rect x="-85" y="-70" width="170" height="140" rx="12" ry="12"
          fill="#1E1B4B" opacity="0.7" filter="url(#innerShadow)"/>
    <rect x="-85" y="-70" width="170" height="140" rx="12" ry="12"
          fill="none" stroke="#6366F1" stroke-width="1.5" opacity="0.6"/>

    <!-- Chart grid lines -->
    <g stroke="#4F46E5" stroke-width="0.5" opacity="0.3">
      <line x1="-70" y1="-40" x2="70" y2="-40"/>
      <line x1="-70" y1="-10" x2="70" y2="-10"/>
      <line x1="-70" y1="20" x2="70" y2="20"/>
      <line x1="-70" y1="50" x2="70" y2="50"/>
    </g>

    <!-- Evaluation bar chart with glow -->
    <g filter="url(#barGlow)">
      <!-- Bar 1 - Cyan -->
      <rect x="-65" y="-30" width="28" height="85" rx="4" ry="4" fill="url(#bar1Grad)"/>
      <rect x="-65" y="-30" width="28" height="85" rx="4" ry="4" fill="none" stroke="#22D3EE" stroke-width="1" opacity="0.8"/>

      <!-- Bar 2 - Green (tallest - success) -->
      <rect x="-30" y="-55" width="28" height="110" rx="4" ry="4" fill="url(#bar2Grad)"/>
      <rect x="-30" y="-55" width="28" height="110" rx="4" ry="4" fill="none" stroke="#34D399" stroke-width="1" opacity="0.8"/>

      <!-- Bar 3 - Purple -->
      <rect x="5" y="-20" width="28" height="75" rx="4" ry="4" fill="url(#bar3Grad)"/>
      <rect x="5" y="-20" width="28" height="75" rx="4" ry="4" fill="none" stroke="#A78BFA" stroke-width="1" opacity="0.8"/>

      <!-- Bar 4 - Orange -->
      <rect x="40" y="-42" width="28" height="97" rx="4" ry="4" fill="url(#bar4Grad)"/>
      <rect x="40" y="-42" width="28" height="97" rx="4" ry="4" fill="none" stroke="#FBBF24" stroke-width="1" opacity="0.8"/>
    </g>

    <!-- Bar highlight reflections -->
    <g opacity="0.3">
      <rect x="-63" y="-28" width="8" height="40" rx="2" fill="#fff"/>
      <rect x="-28" y="-53" width="8" height="50" rx="2" fill="#fff"/>
      <rect x="7" y="-18" width="8" height="35" rx="2" fill="#fff"/>
      <rect x="42" y="-40" width="8" height="45" rx="2" fill="#fff"/>
    </g>

    <!-- Chart baseline -->
    <line x1="-75" y1="55" x2="75" y2="55" stroke="#818CF8" stroke-width="2"/>
  </g>

  <!-- Checkmark badge with success indicator -->
  <g transform="translate(280, 130)" filter="url(#softGlow)">
    <!-- Badge circle background -->
    <circle cx="0" cy="0" r="28" fill="#1E1B4B" stroke="url(#checkGrad)" stroke-width="3"/>
    <circle cx="0" cy="0" r="22" fill="url(#checkGrad)" opacity="0.15"/>

    <!-- Animated-style checkmark -->
    <path d="M -12,0 L -4,8 L 14,-10"
          fill="none"
          stroke="url(#checkGrad)"
          stroke-width="5"
          stroke-linecap="round"
          stroke-linejoin="round"/>
  </g>

  <!-- Magnifying glass / analysis icon -->
  <g transform="translate(120, 130)" filter="url(#softGlow)">
    <!-- Glass circle -->
    <circle cx="0" cy="0" r="28" fill="#1E1B4B" stroke="#818CF8" stroke-width="3"/>
    <circle cx="-3" cy="-3" r="12" fill="none" stroke="#A5B4FC" stroke-width="2.5"/>
    <!-- Handle -->
    <line x1="6" y1="6" x2="15" y2="15" stroke="#A5B4FC" stroke-width="3" stroke-linecap="round"/>
    <!-- Lens reflection -->
    <path d="M -9,-8 Q -12,-3 -9,0" fill="none" stroke="#C7D2FE" stroke-width="1.5" stroke-linecap="round" opacity="0.6"/>
  </g>

  <!-- Metrics indicator circles -->
  <g transform="translate(200, 320)">
    <!-- Left metric dot -->
    <circle cx="-50" cy="0" r="8" fill="#06B6D4"/>
    <circle cx="-50" cy="0" r="12" fill="none" stroke="#06B6D4" stroke-width="1" opacity="0.4"/>

    <!-- Center metric dot -->
    <circle cx="0" cy="0" r="8" fill="#10B981"/>
    <circle cx="0" cy="0" r="12" fill="none" stroke="#10B981" stroke-width="1" opacity="0.4"/>

    <!-- Right metric dot -->
    <circle cx="50" cy="0" r="8" fill="#8B5CF6"/>
    <circle cx="50" cy="0" r="12" fill="none" stroke="#8B5CF6" stroke-width="1" opacity="0.4"/>
  </g>

  <!-- Top accent bar -->
  <g transform="translate(200, 75)">
    <rect x="-60" y="-4" width="120" height="8" rx="4" fill="url(#metallicGrad)" opacity="0.6"/>
    <rect x="-40" y="-2" width="80" height="4" rx="2" fill="#818CF8" opacity="0.8"/>
  </g>

  <!-- Data flow lines connecting elements -->
  <g stroke="url(#circuitGrad)" stroke-width="1" fill="none" opacity="0.5">
    <!-- Left flow -->
    <path d="M 120,160 Q 120,200 150,220 Q 160,225 170,220"/>
    <!-- Right flow -->
    <path d="M 280,160 Q 280,200 250,220 Q 240,225 230,220"/>
    <!-- Bottom connections -->
    <path d="M 150,312 Q 180,300 200,290"/>
    <path d="M 200,290 Q 220,300 250,312"/>
  </g>

  <!-- Subtle corner tech details -->
  <g stroke="#6366F1" stroke-width="1" fill="none" opacity="0.3">
    <!-- Top left corner detail -->
    <path d="M 80,90 L 90,85 L 100,90 L 100,100"/>
    <!-- Top right corner detail -->
    <path d="M 320,90 L 310,85 L 300,90 L 300,100"/>
    <!-- Bottom corners -->
    <path d="M 80,310 L 90,315 L 100,310 L 100,300"/>
    <path d="M 320,310 L 310,315 L 300,310 L 300,300"/>
  </g>

  <!-- Outer corner gems -->
  <g fill="#818CF8" opacity="0.7">
    <polygon points="200,22 205,30 195,30" />
    <polygon points="200,378 205,370 195,370" />
  </g>

</svg>