<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1200 675" role="img" aria-label="A/B-тест двух вариантов страницы приложения">
  <defs>
    <linearGradient id="bg" x1="0" y1="0" x2="1" y2="1">
      <stop offset="0" stop-color="#e7f6ff"/><stop offset="1" stop-color="#f3f8fb"/>
    </linearGradient>
  </defs>
  <rect width="1200" height="675" fill="url(#bg)"/>
  <circle cx="1000" cy="130" r="180" fill="#71cbf3" opacity="0.18"/>
  <circle cx="170" cy="560" r="150" fill="#f6dd00" opacity="0.16"/>
  <!-- variant A -->
  <g opacity="0.85">
    <rect x="280" y="160" width="270" height="380" rx="24" fill="#ffffff" stroke="#e1eaf0" stroke-width="3"/>
    <circle cx="345" cy="230" r="34" fill="#9fb3c2"/>
    <rect x="400" y="210" width="110" height="16" rx="8" fill="#27333c"/>
    <rect x="400" y="238" width="80" height="12" rx="6" fill="#9fb3c2"/>
    <rect x="310" y="290" width="210" height="110" rx="12" fill="#e1eaf0"/>
    <rect x="310" y="420" width="210" height="40" rx="10" fill="#9fb3c2"/>
    <text x="415" y="520" text-anchor="middle" font-family="Arial, sans-serif" font-size="42" font-weight="800" fill="#9fb3c2">A</text>
  </g>
  <!-- variant B (winner) -->
  <g>
    <rect x="650" y="140" width="270" height="400" rx="24" fill="#ffffff" stroke="#23b26a" stroke-width="5"/>
    <rect x="680" y="180" width="68" height="68" rx="16" fill="#f6dd00"/>
    <path d="M714 198 l20 38 h-13 l-7-14 -7 14 h-13 z" fill="#27333c"/>
    <rect x="768" y="192" width="110" height="16" rx="8" fill="#27333c"/>
    <rect x="768" y="220" width="80" height="12" rx="6" fill="#9fb3c2"/>
    <rect x="680" y="272" width="210" height="110" rx="12" fill="#71cbf3" opacity="0.5"/>
    <rect x="680" y="402" width="210" height="40" rx="10" fill="#0d98ec"/>
    <text x="785" y="512" text-anchor="middle" font-family="Arial, sans-serif" font-size="42" font-weight="800" fill="#23b26a">B</text>
    <circle cx="905" cy="160" r="30" fill="#23b26a"/>
    <path d="M891 160 l10 10 18-19" stroke="#ffffff" stroke-width="6" fill="none" stroke-linecap="round" stroke-linejoin="round"/>
  </g>
  <!-- vs divider -->
  <text x="600" y="360" text-anchor="middle" font-family="Arial, sans-serif" font-size="34" font-weight="800" fill="#27333c">vs</text>
  <!-- uplift label -->
  <rect x="955" y="300" width="150" height="56" rx="28" fill="#23b26a"/>
  <text x="1030" y="337" text-anchor="middle" font-family="Arial, sans-serif" font-size="28" font-weight="800" fill="#ffffff">+18%</text>
</svg>
