// Generated by orrery. Edit the diagram spec and re-render instead of editing this file.
import { type SVGProps, useId } from "react";

export default function StreamingAnalyticsOnGoogleCloud(props: SVGProps<SVGSVGElement>) {
  const uid = useId().replace(/[^A-Za-z0-9_-]/g, "");
  return (
    <svg xmlns="http://www.w3.org/2000/svg" xmlnsXlink="http://www.w3.org/1999/xlink" width="687" height="1456" viewBox="0 0 687 1456" role="img" aria-labelledby={`${uid}-sdw-title ${uid}-sdw-desc`} fontFamily="'Geist Mono', ui-monospace, SFMono-Regular, Menlo, Consolas, 'Liberation Mono', monospace" {...props}>
      <title id={`${uid}-sdw-title`}>
        Streaming analytics on Google Cloud
      </title>
      <desc id={`${uid}-sdw-desc`}>
        Streaming analytics on Google Cloud. 8 components in 3 groups. Connections: Store devices to Pub/Sub (publish); Web and mobile apps to Pub/Sub (publish); Pub/Sub to Dataflow (subscribe); Dataflow to BigQuery (events and scores); Dataflow to Cloud Storage (raw files); Dataflow to Vertex AI (online prediction); BigQuery to Looker (SQL); BigQuery to Vertex AI (training data).
      </desc>
      <defs>
        <linearGradient id={`${uid}-bg`} x1="0" y1="0" x2="0.34" y2="0.94">
          <stop offset="0" stopColor="#0e1a24" />
          <stop offset="0.6" stopColor="#0b1012" />
        </linearGradient>
        <pattern id={`${uid}-grid`} width="20" height="20" patternUnits="userSpaceOnUse">
          <path d="M0 0.5H20M0.5 0V20" fill="none" stroke="#ffffff" strokeOpacity="0.045" strokeWidth="1" />
        </pattern>
        <radialGradient id={`${uid}-wash`} gradientUnits="userSpaceOnUse" cx="273" cy="731.25" r="504.19">
          <stop offset="0" stopColor="#60a5fa" stopOpacity="0.12" />
          <stop offset="1" stopColor="#60a5fa" stopOpacity="0" />
        </radialGradient>
        <symbol id={`${uid}-s1`} viewBox="0 0 24 24" overflow="visible">
          <g fill="none" stroke="#919394" strokeLinecap="round" strokeLinejoin="round" strokeWidth="1.25">
            <path d="M5 6a1 1 0 0 1 1-1h12a1 1 0 0 1 1 1v12a1 1 0 0 1-1 1H6a1 1 0 0 1-1-1z" />
            <path d="M9 9h6v6H9zm-6 1h2m-2 4h2m5-11v2m4-2v2m7 5h-2m2 4h-2m-5 7v-2m-4 2v-2" />
          </g>
        </symbol>
        <symbol id={`${uid}-s2`} viewBox="0 0 24 24" overflow="visible">
          <path fill="none" stroke="#919394" strokeLinecap="round" strokeLinejoin="round" strokeWidth="1.25" d="M6 5a2 2 0 0 1 2-2h8a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H8a2 2 0 0 1-2-2zm5-1h2m-1 13v.01" />
        </symbol>
        <symbol id={`${uid}-s3`} viewBox="0 0 512 512" overflow="visible">
          <rect width="512" height="512" fill="none" />
          <path fill="#9aa0a6" d="M155.24 255.523c-11.135 0-21.995 1.79-32.254 5.226l-38.85-74.169c-4.096-7.817-13.754-10.834-21.568-6.741-7.817 4.095-10.835 13.752-6.741 21.568l38.865 74.199a103 103 0 0 0-11.037 9.569c-19.122 19.12-29.652 44.544-29.652 71.585s10.531 52.464 29.652 71.585c19.12 19.121 44.543 29.652 71.585 29.652s52.465-10.531 71.585-29.652c39.466-39.473 39.469-103.7 0-143.17-19.12-19.121-44.544-29.652-71.585-29.652m48.989 150.226c-13.086 13.086-30.484 20.292-48.989 20.292s-35.903-7.206-48.989-20.292-20.292-30.484-20.292-48.989 7.206-35.903 20.292-48.989c5-5 10.633-9.133 16.713-12.342l.119-.058.025-.015c9.796-5.141 20.752-7.877 32.132-7.877 18.506 0 35.903 7.207 48.989 20.292s20.292 30.483 20.292 48.989-7.207 35.903-20.292 48.989m251.943-95.156-38.865-74.198a103 103 0 0 0 11.038-9.57c19.122-19.12 29.652-44.544 29.652-71.585s-10.53-52.464-29.652-71.585c-19.12-19.12-44.545-29.652-71.585-29.652s-52.464 10.531-71.585 29.652c-39.472 39.472-39.472 103.698 0 143.17 19.12 19.121 44.544 29.652 71.585 29.652 11.136 0 21.995-1.79 32.255-5.226l38.85 74.169c2.854 5.45 8.413 8.567 14.167 8.567 2.499 0 5.034-.587 7.4-1.828 7.818-4.094 10.835-13.751 6.74-21.567ZM307.771 204.229c-13.084-13.086-20.292-30.483-20.292-48.989s7.207-35.903 20.292-48.989 30.484-20.292 48.989-20.292 35.903 7.206 48.989 20.292 20.292 30.484 20.292 48.989-7.206 35.903-20.292 48.989a69.5 69.5 0 0 1-16.825 12.399l-.006.003-.003.002c-9.802 5.149-20.766 7.888-32.154 7.888-18.506 0-35.903-7.207-48.989-20.292z" />
          <path fill="#4285f4" d="M356.76 54.003c-27.041 0-52.465 10.531-71.585 29.652-19.121 19.12-29.652 44.544-29.652 71.585 0 21.638 6.749 42.235 19.24 59.401l-83.135 83.135c5.337 3.522 6.499 4.277 12.601 9.995 27.879 26.118 27.012 70.965 0 97.978-13.086 13.086-30.484 20.292-48.989 20.292s-35.903-7.206-48.989-20.292l-22.596 22.596c19.12 19.121 44.544 29.652 71.585 29.652s52.465-10.531 71.585-29.652c19.121-19.12 29.652-44.544 29.652-71.585 0-21.638-6.749-42.235-19.24-59.401l83.134-83.134c-3.873-2.619-6.619-4.107-12.6-9.996-27.222-26.801-27.012-70.965 0-97.978 13.086-13.086 30.484-20.292 48.989-20.292s35.903 7.206 48.989 20.292l22.596-22.596c-19.12-19.121-44.544-29.652-71.585-29.652" />
        </symbol>
        <filter id={`${uid}-f1`} x="-0.1" y="-0.1" width="1.2" height="1.2" colorInterpolationFilters="sRGB">
          <feFlood floodColor="#919394" />
          <feComposite in2="SourceAlpha" operator="in" />
        </filter>
        <symbol id={`${uid}-s4`} viewBox="0 0 512 512" overflow="visible">
          <rect width="512" height="512" fill="none" />
          <path fill="#34a853" d="M442 277.9H70c-8.8 0-16 7.2-16 16V442c0 8.8 7.2 16 16 16h107.2c1.5.5 3.1.7 4.8.7s3.3-.3 4.8-.7H442c8.8 0 16-7.2 16-16V293.9c0-8.8-7.2-16-16-16m-356 32h80V426H86zm340 116H198V309.8h228z" />
          <path fill="#fbbc04" d="M442 54H70c-8.8 0-16 7.2-16 16v148.8c0 8.8 7.2 16 16 16h372c8.8 0 16-7.2 16-16V70c0-8.8-7.2-16-16-16M86 86h80v116.8H86zm340 116.8H198V86h228z" />
          <path fill="#ea4335" d="M442 234.8h-16V86H54V70c0-8.8 7.2-16 16-16h372c8.8 0 16 7.2 16 16v148.8c0 8.8-7.2 16-16 16" />
          <path fill="#4285f4" d="M442 457.9h-16V309.8H54v-16c0-8.8 7.2-16 16-16h372c8.8 0 16 7.2 16 16v148.1c0 8.8-7.2 16-16 16" />
          <circle cx="349" cy="144.4" r="37" fill="#ea4335" />
          <circle cx="349" cy="367.9" r="37" fill="#4285f4" />
        </symbol>
        <symbol id={`${uid}-s5`} viewBox="0 0 512 512" overflow="visible">
          <rect width="512" height="512" fill="none" />
          <path fill="#34a853" d="M311.9 418.9c-8.8 0-16-7.2-16-16V257.1c0-8.8 7.2-16 16-16s16 7.2 16 16v145.8c0 8.8-7.2 16-16 16m-164.3 0c-8.8 0-16-7.2-16-16V202.4c0-8.8 7.2-16 16-16s16 7.2 16 16v200.5c0 8.8-7.2 16-16 16m82.2 18.5c-8.8 0-16-7.2-16-16V147.6c0-8.8 7.2-16 16-16s16 7.2 16 16v273.7c0 8.8-7.2 16-16 16Z" />
          <path fill="#fbbc04" d="M229.8 437.4c-114.5 0-207.6-93.1-207.6-207.6h32c0 96.8 78.8 175.6 175.6 175.6s175.6-78.8 175.6-175.6h32c0 114.5-93.1 207.6-207.6 207.6" />
          <path fill="#ea4335" d="M437.4 229.8h-32c0-96.8-78.8-175.6-175.6-175.6S54.1 132.9 54.1 229.8h-32c0-114.5 93.2-207.7 207.7-207.7s207.6 93.1 207.6 207.6Z" />
          <path fill="#4285f4" d="m487.4 464.8-100-100c32.3-37.6 49.9-85 49.9-135.1s-21.6-107.6-60.8-146.8l-22.6 22.6c33.2 33.2 51.4 77.3 51.4 124.2s-18.3 90.9-51.5 124.1c-5 5-7.5 7-11.8 10.8l122.8 122.8c3.1 3.1 7.2 4.7 11.3 4.7s8.2-1.6 11.3-4.7c6.2-6.2 6.2-16.4 0-22.6" />
        </symbol>
        <symbol id={`${uid}-s6`} viewBox="0 0 512 512" overflow="visible">
          <rect width="512" height="512" fill="none" />
          <path fill="#ea4335" d="M128 244.99c-8.84 0-16-7.16-16-16v-95.97c0-8.84 7.16-16 16-16s16 7.16 16 16v95.97c0 8.84-7.16 16-16 16" />
          <path fill="#fbbc04" d="M256 458c-2.98 0-5.97-.83-8.59-2.5l-186-122c-7.46-4.74-9.65-14.63-4.91-22.09 4.75-7.46 14.64-9.65 22.09-4.91L256 423.03 433.41 306.5c7.45-4.74 17.34-2.55 22.09 4.91 4.74 7.46 2.55 17.34-4.91 22.09l-186 122c-2.62 1.67-5.61 2.5-8.59 2.5" />
          <path fill="#34a853" d="M256 388.03c-8.84 0-16-7.16-16-16v-73.06c0-8.84 7.16-16 16-16s16 7.16 16 16v73.06c0 8.84-7.16 16-16 16" />
          <circle cx="128" cy="70" r="16" fill="#ea4335" />
          <circle cx="128" cy="292" r="16" fill="#ea4335" />
          <path fill="#4285f4" d="M384.23 308.01c-8.82 0-15.98-7.14-16-15.97l-.23-94.01c-.02-8.84 7.13-16.02 15.97-16.03h.04c8.82 0 15.98 7.14 16 15.97l.23 94.01c.02 8.84-7.13 16.02-15.97 16.03z" />
          <circle cx="384" cy="70" r="16" fill="#4285f4" />
          <circle cx="384" cy="134" r="16" fill="#4285f4" />
          <path fill="#fbbc04" d="M320 220.36c-8.84 0-16-7.16-16-16V101.34c0-8.84 7.16-16 16-16s16 7.16 16 16v103.02c0 8.84-7.16 16-16 16" />
          <circle cx="256" cy="171" r="16" fill="#34a853" />
          <circle cx="256" cy="235" r="16" fill="#34a853" />
          <circle cx="320" cy="265" r="16" fill="#fbbc04" />
          <circle cx="320" cy="329" r="16" fill="#fbbc04" />
          <path fill="#fbbc04" d="M192 217.36c-8.84 0-16-7.16-16-16V101.34c0-8.84 7.16-16 16-16s16 7.16 16 16v100.02c0 8.84-7.16 16-16 16" />
          <circle cx="192" cy="265" r="16" fill="#fbbc04" />
          <circle cx="192" cy="329" r="16" fill="#fbbc04" />
        </symbol>
        <symbol id={`${uid}-s7`} viewBox="0 0 512 512" overflow="visible">
          <rect width="512" height="512" fill="none" />
          <path fill="#4285f4" d="M313.5 297c44.4 0 80.5 36.1 80.5 80.5S357.9 458 313.5 458 233 421.9 233 377.5s36.1-80.5 80.5-80.5m0-32C251.4 265 201 315.4 201 377.5S251.4 490 313.5 490 426 439.6 426 377.5 375.6 265 313.5 265" />
          <path fill="#ea4335" d="M338.1 40.9c-25.1-25.1-66.1-25.1-91.2 0-21.2 21.2-24.5 53.5-10.1 78.2l-44.3 42.3c-6.4 6.1-6.6 16.2-.5 22.6 3.1 3.3 7.4 5 11.6 5s7.9-1.5 11-4.4l44.7-42.7c10.2 6.1 21.7 9.1 33.2 9.1 16.5 0 33-6.3 45.6-18.9 25.1-25.2 25.1-66.1 0-91.2m-22.6 68.6c-12.7 12.7-33.3 12.7-46 0s-12.7-33.3 0-46c6.3-6.3 14.7-9.5 23-9.5s16.6 3.2 23 9.5c12.7 12.7 12.7 33.3 0 46" />
          <path fill="#34a853" d="M313.5 265c-21.5 0-42.1 6-60.1 17.4s-38.6-37.9-38.6-37.9l-22.4 22.9 36.6 35.8 22.9 22.4c1.5-1.8 3-3.5 4.7-5.1 3.1-3.1 6.4-5.9 9.8-8.4 13.8-9.9 30-15.2 47.1-15.2 44.4 0 80.5 36.1 80.5 80.5h32c0-62-50.5-112.5-112.5-112.5Z" />
          <path fill="#fbbc04" d="M161.5 290.5c-19.3 0-38.7-7.4-53.4-22.1-29.4-29.4-29.4-77.3 0-106.8 29.4-29.4 77.3-29.4 106.8 0 29.4 29.4 29.4 77.3 0 106.8-14.7 14.7-34.1 22.1-53.4 22.1m0-119c-11.1 0-22.3 4.2-30.8 12.7-17 17-17 44.6 0 61.5 17 17 44.6 17 61.5 0 17-17 17-44.6 0-61.5-8.5-8.5-19.6-12.7-30.8-12.7Z" />
        </symbol>
      </defs>
      <rect width="687" height="1456" fill={`url(#${uid}-bg)`} />
      <rect width="687" height="1456" fill={`url(#${uid}-grid)`} />
      <rect width="687" height="1456" fill={`url(#${uid}-wash)`} />
      <text fontSize="18" fontWeight="700" letterSpacing="1.08" fill="#dadbdb">
        <tspan x="28" y="42.89">
          STREAMING ANALYTICS ON GOOGLE CLOUD
        </tspan>
      </text>
      <text fontSize="10.75" fontWeight="400" fill="#9d9fa0">
        <tspan x="28" y="65">
          Events flow through Pub/Sub and Dataflow into BigQuery for Looker dashboards and Vertex AI models
        </tspan>
      </text>
      <g id={`${uid}-g-sources`}>
        <rect x="69" y="96" width="265" height="160" rx="2" fill="#ffffff" fillOpacity="0.03" stroke="#ffffff" strokeOpacity="0.16" strokeWidth="1" />
        <g opacity="0">
          <rect x="69" y="96" width="265" height="160" rx="2" fill="#60a5fa" fillOpacity="0.03" stroke="#60a5fa" strokeOpacity="0.6" strokeWidth="1" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.0545;0.0825;0.912;0.94;1" dur="6.425s" repeatCount="indefinite" />
        </g>
      </g>
      <g id={`${uid}-g-gcloud`}>
        <rect x="28" y="420" width="474" height="943" rx="2" fill="#ffffff" fillOpacity="0.03" stroke="#ffffff" strokeOpacity="0.16" strokeWidth="1" />
        <g opacity="0">
          <rect x="28" y="420" width="474" height="943" rx="2" fill="#60a5fa" fillOpacity="0.03" stroke="#60a5fa" strokeOpacity="0.6" strokeWidth="1" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.0545;0.0825;0.912;0.94;1" dur="6.425s" repeatCount="indefinite" />
        </g>
      </g>
      <g id={`${uid}-g-project`}>
        <rect x="48" y="472" width="434" height="871" rx="2" fill="#ffffff" fillOpacity="0.03" stroke="#ffffff" strokeOpacity="0.16" strokeWidth="1" />
        <g opacity="0">
          <rect x="48" y="472" width="434" height="871" rx="2" fill="none" stroke="#60a5fa" strokeOpacity="0.6" strokeWidth="1" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.0545;0.0825;0.912;0.94;1" dur="6.425s" repeatCount="indefinite" />
        </g>
      </g>
      <g id={`${uid}-e-e1`}>
        <path d="M132 227.5 L132 358 Q132 366 140 366 L189 366 Q197 366 197 374 L197 523.5" fill="none" stroke="#ffffff" strokeOpacity="0.25" strokeWidth="1" strokeLinecap="round" strokeLinejoin="round" />
        <path d="M193 518 L197 524 L201 518" fill="none" stroke="#ffffff" strokeOpacity="0.4" strokeWidth="1" strokeLinecap="round" strokeLinejoin="round" />
        <path d="M132 227.5 L132 358 Q132 366 140 366 L189 366 Q197 366 197 374 L197 523.5" fill="none" stroke="#60a5fa" strokeOpacity="0.5" strokeWidth="1.2" strokeLinecap="round" strokeLinejoin="round" pathLength="1" strokeDasharray="1 1" strokeDashoffset="1" opacity="0">
          <animate attributeName="stroke-dashoffset" values="1;1;0;0" keyTimes="0;0.1946;0.3502;1" calcMode="spline" keySplines="0 0 1 1;0.65 0 0.35 1;0 0 1 1" dur="6.425s" repeatCount="indefinite" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.1946;0.2226;0.9;0.928;1" dur="6.425s" repeatCount="indefinite" />
        </path>
        <g opacity="0">
          <path d="M193 518 L197 524 L201 518" fill="none" stroke="#60a5fa" strokeOpacity="0.7" strokeWidth="1" strokeLinecap="round" strokeLinejoin="round" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.3502;0.3782;0.9;0.928;1" dur="6.425s" repeatCount="indefinite" />
        </g>
      </g>
      <g id={`${uid}-e-e2`}>
        <path d="M264 236 L264 273 Q264 281 256 281 L228 281 Q220 281 220 289 L220 523.5" fill="none" stroke="#ffffff" strokeOpacity="0.25" strokeWidth="1" strokeLinecap="round" strokeLinejoin="round" />
        <path d="M216 518 L220 524 L224 518" fill="none" stroke="#ffffff" strokeOpacity="0.4" strokeWidth="1" strokeLinecap="round" strokeLinejoin="round" />
      </g>
      <g id={`${uid}-e-e3`}>
        <path d="M209 612 L209 760.5" fill="none" stroke="#ffffff" strokeOpacity="0.25" strokeWidth="1" strokeLinecap="round" strokeLinejoin="round" />
        <path d="M205 755 L209 761 L213 755" fill="none" stroke="#ffffff" strokeOpacity="0.4" strokeWidth="1" strokeLinecap="round" strokeLinejoin="round" />
        <path d="M209 612 L209 760.5" fill="none" stroke="#60a5fa" strokeOpacity="0.5" strokeWidth="1.2" strokeLinecap="round" strokeLinejoin="round" pathLength="1" strokeDasharray="1 1" strokeDashoffset="1" opacity="0">
          <animate attributeName="stroke-dashoffset" values="1;1;0;0" keyTimes="0;0.3875;0.46;1" calcMode="spline" keySplines="0 0 1 1;0.65 0 0.35 1;0 0 1 1" dur="6.425s" repeatCount="indefinite" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.3875;0.4156;0.9;0.928;1" dur="6.425s" repeatCount="indefinite" />
        </path>
        <g opacity="0">
          <path d="M205 755 L209 761 L213 755" fill="none" stroke="#60a5fa" strokeOpacity="0.7" strokeWidth="1" strokeLinecap="round" strokeLinejoin="round" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.46;0.488;0.9;0.928;1" dur="6.425s" repeatCount="indefinite" />
        </g>
      </g>
      <g id={`${uid}-e-e4`}>
        <path d="M235 849 L235 946 Q235 954 243 954 L392 954 Q400 954 400 962 L400 997.5" fill="none" stroke="#ffffff" strokeOpacity="0.25" strokeWidth="1" strokeLinecap="round" strokeLinejoin="round" />
        <path d="M396 992 L400 998 L404 992" fill="none" stroke="#ffffff" strokeOpacity="0.4" strokeWidth="1" strokeLinecap="round" strokeLinejoin="round" />
        <path d="M235 849 L235 946 Q235 954 243 954 L392 954 Q400 954 400 962 L400 997.5" fill="none" stroke="#60a5fa" strokeOpacity="0.5" strokeWidth="1.2" strokeLinecap="round" strokeLinejoin="round" pathLength="1" strokeDasharray="1 1" strokeDashoffset="1" opacity="0">
          <animate attributeName="stroke-dashoffset" values="1;1;0;0" keyTimes="0;0.4974;0.6501;1" calcMode="spline" keySplines="0 0 1 1;0.65 0 0.35 1;0 0 1 1" dur="6.425s" repeatCount="indefinite" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.4974;0.5254;0.9;0.928;1" dur="6.425s" repeatCount="indefinite" />
        </path>
        <g opacity="0">
          <path d="M396 992 L400 998 L404 992" fill="none" stroke="#60a5fa" strokeOpacity="0.7" strokeWidth="1" strokeLinecap="round" strokeLinejoin="round" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.6501;0.6781;0.9;0.928;1" dur="6.425s" repeatCount="indefinite" />
        </g>
      </g>
      <g id={`${uid}-e-e5`}>
        <path d="M184 849 L184 861 Q184 869 176 869 L127 869 Q119 869 119 877 L119 997.5" fill="none" stroke="#ffffff" strokeOpacity="0.25" strokeWidth="1" strokeLinecap="round" strokeLinejoin="round" />
        <path d="M115 992 L119 998 L123 992" fill="none" stroke="#ffffff" strokeOpacity="0.4" strokeWidth="1" strokeLinecap="round" strokeLinejoin="round" />
      </g>
      <g id={`${uid}-e-e6`}>
        <path d="M209 849 L209 1183 Q209 1191 217 1191 L230 1191 Q238 1191 238 1199 L238 1234.5" fill="none" stroke="#ffffff" strokeOpacity="0.25" strokeWidth="1" strokeLinecap="round" strokeLinejoin="round" />
        <path d="M234 1229 L238 1235 L242 1229" fill="none" stroke="#ffffff" strokeOpacity="0.4" strokeWidth="1" strokeLinecap="round" strokeLinejoin="round" />
      </g>
      <g id={`${uid}-e-e7`}>
        <path d="M414 1086 L414 1234.5" fill="none" stroke="#ffffff" strokeOpacity="0.25" strokeWidth="1" strokeLinecap="round" strokeLinejoin="round" />
        <path d="M410 1229 L414 1235 L418 1229" fill="none" stroke="#ffffff" strokeOpacity="0.4" strokeWidth="1" strokeLinecap="round" strokeLinejoin="round" />
        <path d="M414 1086 L414 1234.5" fill="none" stroke="#60a5fa" strokeOpacity="0.5" strokeWidth="1.2" strokeLinecap="round" strokeLinejoin="round" pathLength="1" strokeDasharray="1 1" strokeDashoffset="1" opacity="0">
          <animate attributeName="stroke-dashoffset" values="1;1;0;0" keyTimes="0;0.6875;0.7599;1" calcMode="spline" keySplines="0 0 1 1;0.65 0 0.35 1;0 0 1 1" dur="6.425s" repeatCount="indefinite" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.6875;0.7155;0.9;0.928;1" dur="6.425s" repeatCount="indefinite" />
        </path>
        <g opacity="0">
          <path d="M410 1229 L414 1235 L418 1229" fill="none" stroke="#60a5fa" strokeOpacity="0.7" strokeWidth="1" strokeLinecap="round" strokeLinejoin="round" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.7599;0.7879;0.9;0.928;1" dur="6.425s" repeatCount="indefinite" />
        </g>
      </g>
      <g id={`${uid}-e-e8`}>
        <path d="M386 1086 L386 1098 Q386 1106 378 1106 L289 1106 Q281 1106 281 1114 L281 1234.5" fill="none" stroke="#ffffff" strokeOpacity="0.25" strokeWidth="1" strokeLinecap="round" strokeLinejoin="round" strokeDasharray="1 2.5" />
        <path d="M277 1229 L281 1235 L285 1229" fill="none" stroke="#ffffff" strokeOpacity="0.4" strokeWidth="1" strokeLinecap="round" strokeLinejoin="round" />
      </g>
      <g id={`${uid}-el-e1`}>
        <rect x="137" y="325" width="52" height="21" rx="3" fill="#0b1012" stroke="#ffffff" strokeOpacity="0.1" strokeWidth="1" />
        <text fontSize="8.5" fontWeight="700" letterSpacing="0.51" fill="#979899" textAnchor="middle">
          <tspan x="163.26" y="338.52">
            PUBLISH
          </tspan>
        </text>
        <g opacity="0">
          <rect x="137" y="325" width="52" height="21" rx="3" fill="#0b1012" stroke="#60a5fa" strokeOpacity="0.5" strokeWidth="1" />
          <text fontSize="8.5" fontWeight="700" letterSpacing="0.51" fill="#60a5fa" textAnchor="middle">
            <tspan x="163.26" y="338.52">
              PUBLISH
            </tspan>
          </text>
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.1946;0.2226;0.9;0.928;1" dur="6.425s" repeatCount="indefinite" />
        </g>
      </g>
      <g id={`${uid}-el-e2`}>
        <rect x="225" y="325" width="52" height="21" rx="3" fill="#0b1012" stroke="#ffffff" strokeOpacity="0.1" strokeWidth="1" />
        <text fontSize="8.5" fontWeight="700" letterSpacing="0.51" fill="#979899" textAnchor="middle">
          <tspan x="251.26" y="338.52">
            PUBLISH
          </tspan>
        </text>
      </g>
      <g id={`${uid}-el-e3`}>
        <rect x="214" y="676" width="66" height="21" rx="3" fill="#0b1012" stroke="#ffffff" strokeOpacity="0.1" strokeWidth="1" />
        <text fontSize="8.5" fontWeight="700" letterSpacing="0.51" fill="#979899" textAnchor="middle">
          <tspan x="247.26" y="689.52">
            SUBSCRIBE
          </tspan>
        </text>
        <g opacity="0">
          <rect x="214" y="676" width="66" height="21" rx="3" fill="#0b1012" stroke="#60a5fa" strokeOpacity="0.5" strokeWidth="1" />
          <text fontSize="8.5" fontWeight="700" letterSpacing="0.51" fill="#60a5fa" textAnchor="middle">
            <tspan x="247.26" y="689.52">
              SUBSCRIBE
            </tspan>
          </text>
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.3875;0.4156;0.9;0.928;1" dur="6.425s" repeatCount="indefinite" />
        </g>
      </g>
      <g id={`${uid}-el-e4`}>
        <rect x="240" y="913" width="112" height="21" rx="3" fill="#0b1012" stroke="#ffffff" strokeOpacity="0.1" strokeWidth="1" />
        <text fontSize="8.5" fontWeight="700" letterSpacing="0.51" fill="#979899" textAnchor="middle">
          <tspan x="296.26" y="926.52">
            EVENTS AND SCORES
          </tspan>
        </text>
        <g opacity="0">
          <rect x="240" y="913" width="112" height="21" rx="3" fill="#0b1012" stroke="#60a5fa" strokeOpacity="0.5" strokeWidth="1" />
          <text fontSize="8.5" fontWeight="700" letterSpacing="0.51" fill="#60a5fa" textAnchor="middle">
            <tspan x="296.26" y="926.52">
              EVENTS AND SCORES
            </tspan>
          </text>
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.4974;0.5254;0.9;0.928;1" dur="6.425s" repeatCount="indefinite" />
        </g>
      </g>
      <g id={`${uid}-el-e5`}>
        <rect x="124" y="913" width="59" height="21" rx="3" fill="#0b1012" stroke="#ffffff" strokeOpacity="0.1" strokeWidth="1" />
        <text fontSize="8.5" fontWeight="700" letterSpacing="0.51" fill="#979899" textAnchor="middle">
          <tspan x="153.76" y="926.52">
            RAW FILES
          </tspan>
        </text>
      </g>
      <g id={`${uid}-el-e6`}>
        <rect x="214" y="1031.5" width="103" height="21" rx="3" fill="#0b1012" stroke="#ffffff" strokeOpacity="0.1" strokeWidth="1" />
        <text fontSize="8.5" fontWeight="700" letterSpacing="0.51" fill="#979899" textAnchor="middle">
          <tspan x="265.76" y="1045.02">
            ONLINE PREDICTION
          </tspan>
        </text>
      </g>
      <g id={`${uid}-el-e7`}>
        <rect x="419" y="1150" width="35" height="21" rx="3" fill="#0b1012" stroke="#ffffff" strokeOpacity="0.1" strokeWidth="1" />
        <text fontSize="8.5" fontWeight="700" letterSpacing="0.51" fill="#979899" textAnchor="middle">
          <tspan x="436.76" y="1163.52">
            SQL
          </tspan>
        </text>
        <g opacity="0">
          <rect x="419" y="1150" width="35" height="21" rx="3" fill="#0b1012" stroke="#60a5fa" strokeOpacity="0.5" strokeWidth="1" />
          <text fontSize="8.5" fontWeight="700" letterSpacing="0.51" fill="#60a5fa" textAnchor="middle">
            <tspan x="436.76" y="1163.52">
              SQL
            </tspan>
          </text>
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.6875;0.7155;0.9;0.928;1" dur="6.425s" repeatCount="indefinite" />
        </g>
      </g>
      <g id={`${uid}-el-e8`}>
        <rect x="286" y="1150" width="80" height="21" rx="3" fill="#0b1012" stroke="#ffffff" strokeOpacity="0.1" strokeWidth="1" />
        <text fontSize="8.25" fontWeight="700" letterSpacing="0.5" fill="#979899" textAnchor="middle">
          <tspan x="326.25" y="1163.43">
            TRAINING DATA
          </tspan>
        </text>
      </g>
      <g id={`${uid}-gh-sources`}>
        <text fontSize="11" fontWeight="700" letterSpacing="1.1" fill="#649adb">
          <tspan x="81" y="118.36">
            EVENT SOURCES
          </tspan>
        </text>
      </g>
      <g id={`${uid}-gh-gcloud`}>
        <text fontSize="11" fontWeight="700" letterSpacing="1.1" fill="#649adb">
          <tspan x="40" y="442.35">
            GOOGLE CLOUD
          </tspan>
        </text>
      </g>
      <g id={`${uid}-gh-project`}>
        <text fontSize="11" fontWeight="700" letterSpacing="1.1" fill="#9d9fa0">
          <tspan x="226" y="494.35">
            PROJECT ANALYTICS-PROD
          </tspan>
        </text>
      </g>
      <g id={`${uid}-n-devices`}>
        <rect x="107.5" y="156.5" width="48" height="48" rx="8.16" fill="#0b1012" stroke="#ffffff" strokeOpacity="0.16" strokeWidth="1" />
        <g opacity="0">
          <rect x="107.5" y="156.5" width="48" height="48" rx="8.16" fill="#60a5fa" fillOpacity="0.15" stroke="#60a5fa" strokeOpacity="0.65" strokeWidth="1" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.1089;0.137;0.912;0.94;1" dur="6.425s" repeatCount="indefinite" />
        </g>
        <use href={`#${uid}-s1`} x="117.1" y="166.1" width="28.8" height="28.8" />
        <text fontSize="11.25" fontWeight="700" letterSpacing="0.9" fill="#9d9fa0" textAnchor="middle">
          <tspan x="131.95" y="222.94">
            STORE DEVICES
          </tspan>
        </text>
      </g>
      <g id={`${uid}-n-apps`}>
        <rect x="240" y="148" width="48" height="48" rx="8.16" fill="#0b1012" stroke="#ffffff" strokeOpacity="0.16" strokeWidth="1" />
        <g opacity="0">
          <rect x="240" y="148" width="48" height="48" rx="8.16" fill="#60a5fa" fillOpacity="0.15" stroke="#60a5fa" strokeOpacity="0.65" strokeWidth="1" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.1089;0.137;0.912;0.94;1" dur="6.425s" repeatCount="indefinite" />
        </g>
        <use href={`#${uid}-s2`} x="249.6" y="157.6" width="28.8" height="28.8" />
        <text fontSize="11.5" fontWeight="700" letterSpacing="0.92" fill="#9d9fa0" textAnchor="middle">
          <tspan x="264.46" y="214.53">
            WEB AND MOBILE
          </tspan>
          <tspan x="264.46" y="231.43">
            APPS
          </tspan>
        </text>
      </g>
      <g id={`${uid}-n-topic`}>
        <rect x="184.5" y="524" width="48" height="48" rx="8.16" fill="#0b1012" stroke="#ffffff" strokeOpacity="0.16" strokeWidth="1" />
        <g opacity="0">
          <rect x="184.5" y="524" width="48" height="48" rx="8.16" fill="#60a5fa" fillOpacity="0.15" stroke="#60a5fa" strokeOpacity="0.65" strokeWidth="1" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.1089;0.137;0.912;0.94;1" dur="6.425s" repeatCount="indefinite" />
        </g>
        <use href={`#${uid}-s3`} x="194.58" y="534.08" width="27.84" height="27.84" filter={`url(#${uid}-f1)`} />
        <text fontSize="11.5" fontWeight="700" letterSpacing="0.92" fill="#9d9fa0" textAnchor="middle">
          <tspan x="208.96" y="590.53">
            PUB/SUB
          </tspan>
        </text>
        <text fontSize="10" fontWeight="400" fill="#979a9b" textAnchor="middle">
          <tspan x="208.51" y="607.7">
            events topic
          </tspan>
        </text>
      </g>
      <g id={`${uid}-n-pipeline`}>
        <rect x="185" y="761" width="48" height="48" rx="8.16" fill="#0b1012" stroke="#ffffff" strokeOpacity="0.16" strokeWidth="1" />
        <g opacity="0">
          <rect x="185" y="761" width="48" height="48" rx="8.16" fill="#60a5fa" fillOpacity="0.15" stroke="#60a5fa" strokeOpacity="0.65" strokeWidth="1" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.1089;0.137;0.912;0.94;1" dur="6.425s" repeatCount="indefinite" />
        </g>
        <use href={`#${uid}-s3`} x="195.08" y="771.08" width="27.84" height="27.84" filter={`url(#${uid}-f1)`} />
        <text fontSize="11.5" fontWeight="700" letterSpacing="0.92" fill="#9d9fa0" textAnchor="middle">
          <tspan x="209.47" y="827.53">
            DATAFLOW
          </tspan>
        </text>
        <text fontSize="10" fontWeight="400" fill="#979a9b" textAnchor="middle">
          <tspan x="209.01" y="844.7">
            Streaming pipeline
          </tspan>
        </text>
      </g>
      <g id={`${uid}-n-archive`}>
        <rect x="94.5" y="998" width="48" height="48" rx="8.16" fill="#0b1012" stroke="#ffffff" strokeOpacity="0.16" strokeWidth="1" />
        <g opacity="0">
          <rect x="94.5" y="998" width="48" height="48" rx="8.16" fill="#60a5fa" fillOpacity="0.15" stroke="#60a5fa" strokeOpacity="0.65" strokeWidth="1" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.1089;0.137;0.912;0.94;1" dur="6.425s" repeatCount="indefinite" />
        </g>
        <use href={`#${uid}-s4`} x="104.58" y="1008.08" width="27.84" height="27.84" filter={`url(#${uid}-f1)`} />
        <text fontSize="11.5" fontWeight="700" letterSpacing="0.92" fill="#9d9fa0" textAnchor="middle">
          <tspan x="118.96" y="1064.53">
            CLOUD STORAGE
          </tspan>
        </text>
        <text fontSize="10" fontWeight="400" fill="#979a9b" textAnchor="middle">
          <tspan x="118.5" y="1081.7">
            Raw event archive
          </tspan>
        </text>
      </g>
      <g id={`${uid}-n-warehouse`}>
        <rect x="376" y="998" width="48" height="48" rx="8.16" fill="#0b1012" stroke="#ffffff" strokeOpacity="0.16" strokeWidth="1" />
        <g opacity="0">
          <rect x="376" y="998" width="48" height="48" rx="8.16" fill="#60a5fa" fillOpacity="0.15" stroke="#60a5fa" strokeOpacity="0.65" strokeWidth="1" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.1089;0.137;0.912;0.94;1" dur="6.425s" repeatCount="indefinite" />
        </g>
        <use href={`#${uid}-s5`} x="386.08" y="1008.08" width="27.84" height="27.84" filter={`url(#${uid}-f1)`} />
        <text fontSize="11.5" fontWeight="700" letterSpacing="0.92" fill="#9d9fa0" textAnchor="middle">
          <tspan x="400.46" y="1064.53">
            BIGQUERY
          </tspan>
        </text>
        <text fontSize="10" fontWeight="400" fill="#979a9b" textAnchor="middle">
          <tspan x="400" y="1081.7">
            Analytics tables
          </tspan>
        </text>
      </g>
      <g id={`${uid}-n-model`}>
        <rect x="235.5" y="1235" width="48" height="48" rx="8.16" fill="#0b1012" stroke="#ffffff" strokeOpacity="0.16" strokeWidth="1" />
        <g opacity="0">
          <rect x="235.5" y="1235" width="48" height="48" rx="8.16" fill="#60a5fa" fillOpacity="0.15" stroke="#60a5fa" strokeOpacity="0.65" strokeWidth="1" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.1089;0.137;0.912;0.94;1" dur="6.425s" repeatCount="indefinite" />
        </g>
        <use href={`#${uid}-s6`} x="245.58" y="1245.08" width="27.84" height="27.84" filter={`url(#${uid}-f1)`} />
        <text fontSize="11.5" fontWeight="700" letterSpacing="0.92" fill="#9d9fa0" textAnchor="middle">
          <tspan x="259.96" y="1301.53">
            VERTEX AI
          </tspan>
        </text>
        <text fontSize="10" fontWeight="400" fill="#979a9b" textAnchor="middle">
          <tspan x="259.51" y="1318.7">
            Demand forecast model
          </tspan>
        </text>
      </g>
      <g id={`${uid}-n-dashboards`}>
        <rect x="389.5" y="1235" width="48" height="48" rx="8.16" fill="#0b1012" stroke="#ffffff" strokeOpacity="0.16" strokeWidth="1" />
        <g opacity="0">
          <rect x="389.5" y="1235" width="48" height="48" rx="8.16" fill="#60a5fa" fillOpacity="0.15" stroke="#60a5fa" strokeOpacity="0.65" strokeWidth="1" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.1089;0.137;0.912;0.94;1" dur="6.425s" repeatCount="indefinite" />
        </g>
        <use href={`#${uid}-s7`} x="399.58" y="1245.08" width="27.84" height="27.84" filter={`url(#${uid}-f1)`} />
        <text fontSize="11.5" fontWeight="700" letterSpacing="0.92" fill="#9d9fa0" textAnchor="middle">
          <tspan x="413.97" y="1301.53">
            LOOKER
          </tspan>
        </text>
        <text fontSize="10" fontWeight="400" fill="#979a9b" textAnchor="middle">
          <tspan x="413.51" y="1318.7">
            Sales dashboards
          </tspan>
        </text>
      </g>
      <g id={`${uid}-story`}>
        <path d="M132 227.5 L132 358 Q132 366 140 366 L189 366 Q197 366 197 374 L197 523.5" fill="none" stroke="#60a5fa" strokeOpacity="0.6" strokeWidth="2.4" pathLength="1" strokeDasharray="0.07 2" strokeDashoffset="0.07" opacity="0">
          <animate attributeName="stroke-dashoffset" values="0.07;0.07;-0.93;-1;-1" keyTimes="0;0.1946;0.3502;0.3614;1" calcMode="spline" keySplines="0 0 1 1;0.65 0 0.35 1;0 0 1 1;0 0 1 1" dur="6.425s" repeatCount="indefinite" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.1946;0.1961;0.3614;0.363;1" dur="6.425s" repeatCount="indefinite" />
        </path>
        <circle r="2.5" fill="#60a5fa" opacity="0">
          <animateMotion path="M132 227.5 L132 358 Q132 366 140 366 L189 366 Q197 366 197 374 L197 523.5" dur="6.425s" repeatCount="indefinite" calcMode="spline" keyPoints="0;0;1;1" keyTimes="0;0.1946;0.3502;1" keySplines="0 0 1 1;0.65 0 0.35 1;0 0 1 1" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.1712;0.1946;0.3875;0.4109;1" dur="6.425s" repeatCount="indefinite" />
        </circle>
        <circle r="2" fill="#60a5fa" opacity="0">
          <animateMotion path="M264 236 L264 273 Q264 281 256 281 L228 281 Q220 281 220 289 L220 523.5" dur="6.425s" repeatCount="indefinite" calcMode="spline" keyPoints="0;0;1;1" keyTimes="0;0.449;0.6046;1" keySplines="0 0 1 1;0.65 0 0.35 1;0 0 1 1" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.4256;0.449;0.6046;0.628;1" dur="6.425s" repeatCount="indefinite" />
        </circle>
        <path d="M209 612 L209 760.5" fill="none" stroke="#60a5fa" strokeOpacity="0.6" strokeWidth="2.4" pathLength="1" strokeDasharray="0.18 2" strokeDashoffset="0.18" opacity="0">
          <animate attributeName="stroke-dashoffset" values="0.18;0.18;-0.82;-1;-1" keyTimes="0;0.3875;0.46;0.4727;1" calcMode="spline" keySplines="0 0 1 1;0.65 0 0.35 1;0 0 1 1;0 0 1 1" dur="6.425s" repeatCount="indefinite" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.3875;0.3891;0.4727;0.4743;1" dur="6.425s" repeatCount="indefinite" />
        </path>
        <circle r="2.5" fill="#60a5fa" opacity="0">
          <animateMotion path="M209 612 L209 760.5" dur="6.425s" repeatCount="indefinite" calcMode="spline" keyPoints="0;0;1;1" keyTimes="0;0.3875;0.46;1" keySplines="0 0 1 1;0.65 0 0.35 1;0 0 1 1" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.3642;0.3875;0.4974;0.5207;1" dur="6.425s" repeatCount="indefinite" />
        </circle>
        <path d="M235 849 L235 946 Q235 954 243 954 L392 954 Q400 954 400 962 L400 997.5" fill="none" stroke="#60a5fa" strokeOpacity="0.6" strokeWidth="2.4" pathLength="1" strokeDasharray="0.08 2" strokeDashoffset="0.08" opacity="0">
          <animate attributeName="stroke-dashoffset" values="0.08;0.08;-0.92;-1;-1" keyTimes="0;0.4974;0.6501;0.6628;1" calcMode="spline" keySplines="0 0 1 1;0.65 0 0.35 1;0 0 1 1;0 0 1 1" dur="6.425s" repeatCount="indefinite" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.4974;0.4989;0.6628;0.6643;1" dur="6.425s" repeatCount="indefinite" />
        </path>
        <circle r="2.5" fill="#60a5fa" opacity="0">
          <animateMotion path="M235 849 L235 946 Q235 954 243 954 L392 954 Q400 954 400 962 L400 997.5" dur="6.425s" repeatCount="indefinite" calcMode="spline" keyPoints="0;0;1;1" keyTimes="0;0.4974;0.6501;1" keySplines="0 0 1 1;0.65 0 0.35 1;0 0 1 1" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.474;0.4974;0.6875;0.7108;1" dur="6.425s" repeatCount="indefinite" />
        </circle>
        <circle r="2" fill="#60a5fa" opacity="0">
          <animateMotion path="M184 849 L184 861 Q184 869 176 869 L127 869 Q119 869 119 877 L119 997.5" dur="6.425s" repeatCount="indefinite" calcMode="spline" keyPoints="0;0;1;1" keyTimes="0;0.6186;0.7227;1" keySplines="0 0 1 1;0.65 0 0.35 1;0 0 1 1" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.5952;0.6186;0.7227;0.746;1" dur="6.425s" repeatCount="indefinite" />
        </circle>
        <path d="M414 1086 L414 1234.5" fill="none" stroke="#60a5fa" strokeOpacity="0.6" strokeWidth="2.4" pathLength="1" strokeDasharray="0.18 2" strokeDashoffset="0.18" opacity="0">
          <animate attributeName="stroke-dashoffset" values="0.18;0.18;-0.82;-1;-1" keyTimes="0;0.6875;0.7599;0.7726;1" calcMode="spline" keySplines="0 0 1 1;0.65 0 0.35 1;0 0 1 1;0 0 1 1" dur="6.425s" repeatCount="indefinite" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.6875;0.689;0.7726;0.7742;1" dur="6.425s" repeatCount="indefinite" />
        </path>
        <circle r="2.5" fill="#60a5fa" opacity="0">
          <animateMotion path="M414 1086 L414 1234.5" dur="6.425s" repeatCount="indefinite" calcMode="spline" keyPoints="0;0;1;1" keyTimes="0;0.6875;0.7599;1" keySplines="0 0 1 1;0.65 0 0.35 1;0 0 1 1" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.6641;0.6875;0.7599;0.7833;1" dur="6.425s" repeatCount="indefinite" />
        </circle>
      </g>
      <g id={`${uid}-legend`}>
        <rect x="531" y="1375" width="128" height="53" rx="6" fill="#0b1012" stroke="#ffffff" strokeOpacity="0.1" strokeWidth="1" />
        <path d="M541 1392.5 H569" fill="none" stroke="#ffffff" strokeOpacity="0.4" strokeWidth="1" strokeLinecap="round" />
        <text fontSize="9.5" fontWeight="700" letterSpacing="0.57" fill="#9d9fa0">
          <tspan x="577" y="1395.87">
            DATA FLOW
          </tspan>
        </text>
        <path d="M541 1410.5 H569" fill="none" stroke="#ffffff" strokeOpacity="0.4" strokeWidth="1" strokeLinecap="round" strokeDasharray="1 2.5" />
        <text fontSize="8.25" fontWeight="700" letterSpacing="0.5" fill="#9d9fa0">
          <tspan x="577" y="1413.43">
            TRAINING DATA
          </tspan>
        </text>
      </g>
    </svg>
  );
}
