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

export default function MultiCloudWithASharedIdentityProvider(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="1323" height="1594" viewBox="0 0 1323 1594" 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`}>
        Multi-cloud with a shared identity provider
      </title>
      <desc id={`${uid}-sdw-desc`}>
        Multi-cloud with a shared identity provider. 12 components in 10 groups. Connections: Okta to AWS Cloud (SAML); Okta to Google Cloud (OIDC); Okta to Microsoft Entra tenant (SAML); Amazon EKS to Direct Connect gateway; Direct Connect gateway to AWS Direct Connect; BigQuery to Cloud Router (Private Google Access); Cloud Router to Partner Interconnect; Azure App Service to Private endpoint (Private Link); Private endpoint to ExpressRoute gateway; ExpressRoute gateway to Azure ExpressRoute; AWS Direct Connect to Colocation router (private VIF); Partner Interconnect to Colocation router (VLAN attachment); Azure ExpressRoute to Colocation router (private peering).
      </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="30.07" height="30.07" patternUnits="userSpaceOnUse">
          <path d="M0 0.75H30.07M0.75 0V30.07" fill="none" stroke="#ffffff" strokeOpacity="0.045" strokeWidth="1.5" />
        </pattern>
        <radialGradient id={`${uid}-wash`} gradientUnits="userSpaceOnUse" cx="204" cy="258.5" r="1045.4">
          <stop offset="0" stopColor="#60a5fa" stopOpacity="0.12" />
          <stop offset="1" stopColor="#60a5fa" stopOpacity="0" />
        </radialGradient>
        <mask id={`${uid}-m-e1`} maskUnits="userSpaceOnUse" x="0" y="0" width="1323" height="1594">
          <path d="M360 184 L360 196 Q360 204 352 204 L56 204 Q48 204 48 212 L48 332.25" fill="none" stroke="#ffffff" strokeWidth="10.82" pathLength="1" strokeDasharray="1 1" strokeDashoffset="1">
            <animate attributeName="stroke-dashoffset" values="1;1;0;0" keyTimes="0;0.3619;0.6394;1" calcMode="spline" keySplines="0 0 1 1;0.65 0 0.35 1;0 0 1 1" dur="3.454s" repeatCount="indefinite" />
          </path>
        </mask>
        <symbol id={`${uid}-s1`} viewBox="0 0 40 40" overflow="visible">
          <g fill="none" fillRule="evenodd">
            <rect width="40" height="40" fill="#fff" />
            <path fill="#232f3e" d="M32.698 23.9c.361.47-.4 2.4-.74 3.264-.105.262.117.365.35.168 1.512-1.284 1.904-3.975 1.593-4.363-.307-.386-2.95-.717-4.563.432-.249.177-.206.42.07.389.907-.112 2.93-.357 3.29.11m-.842 2.01c.518-.378.074-.941-.454-.72-3.513 1.464-7.327 2.173-10.8 2.173-5.143 0-10.127-1.39-14.156-3.695-.352-.202-.613.155-.319.414 3.733 3.316 8.67 5.309 14.147 5.309 3.91 0 8.451-1.208 11.582-3.481m-2.144-5.215a6.6 6.6 0 0 1-1.459-.161q-.714-.163-1.093-.373-.233-.128-.29-.258a.7.7 0 0 1-.059-.26v-.47q0-.29.216-.292.083.002.173.033.091.034.241.098.48.21 1.044.324.564.113 1.126.113.895 0 1.384-.308a.97.97 0 0 0 .49-.873.88.88 0 0 0-.258-.65q-.256-.258-.952-.484l-1.375-.421q-1.045-.325-1.517-.938a2.17 2.17 0 0 1-.472-1.347q0-.581.258-1.027.255-.445.676-.761.427-.314.99-.478a4.3 4.3 0 0 1 1.19-.162q.315 0 .64.04a6.3 6.3 0 0 1 1.15.252q.248.082.4.162a.9.9 0 0 1 .28.227.5.5 0 0 1 .083.308v.436q0 .291-.217.29-.114.002-.364-.111c-.54-.24-1.15-.356-1.82-.356q-.815 0-1.262.258-.448.26-.448.827 0 .388.283.655.281.267 1.044.51l1.342.423q1.028.322 1.466.888.441.568.441 1.295 0 .6-.25 1.078-.248.477-.689.817a3.1 3.1 0 0 1-1.05.518q-.615.179-1.343.178m-12.165-.244q-.248.002-.365-.087-.117-.09-.199-.365l-2.222-7.157a1.8 1.8 0 0 1-.082-.371q0-.227.233-.227h.927q.265 0 .374.09.106.086.19.364l1.59 6.12 1.477-6.12q.066-.278.181-.364.116-.09.38-.09h.765q.263 0 .38.09.116.086.182.364l1.493 6.2 1.64-6.2q.082-.278.19-.364.109-.09.373-.09h.878q.233 0 .233.227a1 1 0 0 1-.016.144 2 2 0 0 1-.068.227l-2.286 7.157q-.083.275-.2.365-.116.088-.364.087h-.813q-.264.001-.38-.094-.116-.099-.182-.373l-1.476-5.96-1.457 5.96q-.067.274-.183.373-.116.095-.38.094zM9.94 19.449q.465 0 .98-.17.513-.17.893-.592.232-.259.324-.591.09-.33.09-.801v-.388a8 8 0 0 0-1.757-.211q-.945 0-1.408.373-.464.37-.465 1.07 0 .645.35.978.347.332.993.332m3.846-1.408q0 .517.107.825.11.31.307.664a.4.4 0 0 1 .066.209q0 .148-.182.276l-.597.39a.5.5 0 0 1-.248.08.4.4 0 0 1-.282-.128 2 2 0 0 1-.339-.43 6 6 0 0 1-.29-.544q-1.112 1.28-2.785 1.28-1.194.001-1.89-.664-.696-.664-.696-1.78 0-1.182.863-1.903.86-.72 2.32-.721.48 0 1.002.073t1.084.203v-.68q.001-1.052-.446-1.482-.446-.428-1.54-.428a4.5 4.5 0 0 0-1.02.12 7.5 7.5 0 0 0-1.02.315 3 3 0 0 1-.33.122.7.7 0 0 1-.15.024q-.199.001-.2-.292v-.452q.001-.228.068-.323.066-.099.265-.195a6 6 0 0 1 1.192-.421 6 6 0 0 1 1.476-.18c1.126 0 1.952.254 2.477.754q.787.753.788 2.275z" />
          </g>
        </symbol>
        <filter id={`${uid}-f1`} x="-0.1" y="-0.1" width="1.2" height="1.2" colorInterpolationFilters="sRGB">
          <feColorMatrix type="matrix" values="0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  -0.8504 -2.8608 -0.2888 0 2.4" result="a" />
          <feFlood floodColor="#b6b7b8" />
          <feComposite in2="a" operator="in" />
          <feComposite in2="SourceAlpha" operator="in" />
        </filter>
        <filter id={`${uid}-f2`} x="-0.1" y="-0.1" width="1.2" height="1.2" colorInterpolationFilters="sRGB">
          <feColorMatrix type="matrix" values="0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  -0.8504 -2.8608 -0.2888 0 2.4" result="a" />
          <feFlood floodColor="#0b1012" />
          <feComposite in2="a" operator="in" />
          <feComposite in2="SourceAlpha" operator="in" />
        </filter>
        <symbol id={`${uid}-s2`} viewBox="0 0 40 40" overflow="visible">
          <g fill="none" fillRule="evenodd">
            <rect width="40" height="40" fill="#00a4a6" />
            <path fill="#fff" d="M14 20.026v-9h15.293l-4.147 4.146a.5.5 0 0 0 0 .708l4.147 4.146zm12.207-4.5 4.647-4.646a.5.5 0 0 0-.354-.854H14V8.97A1.528 1.528 0 0 0 13.495 6c-.845 0-1.532.687-1.532 1.531 0 .67.435 1.235 1.037 1.442v24.053h-3v1h7v-1h-3v-12h16.5a.5.5 0 0 0 .354-.854z" />
          </g>
        </symbol>
        <filter id={`${uid}-f3`} x="-0.1" y="-0.1" width="1.2" height="1.2" colorInterpolationFilters="sRGB">
          <feColorMatrix type="matrix" values="0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0.8929 3.0038 0.3032 0 -2.604" result="a" />
          <feFlood floodColor="#b6b7b8" />
          <feComposite in2="a" operator="in" />
        </filter>
        <filter id={`${uid}-f4`} x="-0.1" y="-0.1" width="1.2" height="1.2" colorInterpolationFilters="sRGB">
          <feColorMatrix type="matrix" values="0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0.8929 3.0038 0.3032 0 -2.604" result="a" />
          <feFlood floodColor="#0b1012" />
          <feComposite in2="a" operator="in" />
        </filter>
        <symbol id={`${uid}-s3`} viewBox="0 0 18 18" overflow="visible">
          <defs>
            <radialGradient id={`${uid}-s3-sk_a`} cx="-36.63" cy="17.12" r="11.18" gradientTransform="matrix(.94 0 0 .94 41.88 -7.4)" gradientUnits="userSpaceOnUse">
              <stop offset=".27" stopColor="#ffd70f" />
              <stop offset=".49" stopColor="#ffcb12" />
              <stop offset=".88" stopColor="#feac19" />
              <stop offset="1" stopColor="#fea11b" />
            </radialGradient>
          </defs>
          <path fill={`url(#${uid}-s3-sk_a)`} d="M13.56 7.19a2.07 2.07 0 0 0 0-2.93L10 .69a2.06 2.06 0 0 0-2.92 0L3.52 4.26a2.09 2.09 0 0 0 0 2.93l3 3a.6.6 0 0 1 .17.41v5.52a.7.7 0 0 0 .2.5l1.35 1.35a.45.45 0 0 0 .66 0l1.31-1.31.77-.77a.26.26 0 0 0 0-.38l-.55-.56a.29.29 0 0 1 0-.42l.55-.56a.26.26 0 0 0 0-.38L10.4 13a.28.28 0 0 1 0-.41L11 12a.26.26 0 0 0 0-.38l-.77-.78v-.28Zm-5-5.64a1.18 1.18 0 1 1-1.19 1.18 1.17 1.17 0 0 1 1.17-1.18Z" />
          <path fill="#ff9300" d="M7.62 16.21A.25.25 0 0 0 8 16v-4.45a.27.27 0 0 0-.11-.22.25.25 0 0 0-.39.22V16a.27.27 0 0 0 .12.21" opacity=".75" />
          <rect width="5.86" height=".69" x="5.69" y="5.45" fill="#ff9300" opacity=".75" rx=".32" />
          <rect width="5.86" height=".69" x="5.69" y="6.57" fill="#ff9300" opacity=".75" rx=".32" />
        </symbol>
        <filter id={`${uid}-f5`} x="-0.1" y="-0.1" width="1.2" height="1.2" colorInterpolationFilters="sRGB">
          <feFlood floodColor="#919394" />
          <feComposite in2="SourceAlpha" operator="in" />
        </filter>
        <filter id={`${uid}-f6`} x="-0.1" y="-0.1" width="1.2" height="1.2" colorInterpolationFilters="sRGB">
          <feFlood floodColor="#60a5fa" />
          <feComposite in2="SourceAlpha" operator="in" />
        </filter>
        <symbol id={`${uid}-s4`} viewBox="0 0 40 40" overflow="visible">
          <g fill="none" fillRule="evenodd">
            <rect width="40" height="40" fill="#8c4fff" />
            <path fill="#fff" d="m30.97 21.03-2.943-1.264v10.49c2.545-.353 2.932-2.969 2.948-3.088zm-3.943 9.24V19.76l-3.035 1.272v6.201c.013.054.445 2.767 3.035 3.036m.306-11.723a.5.5 0 0 1 .39.001l3.945 1.692a.5.5 0 0 1 .303.46v6.533c-.183 1.447-1.357 4.063-4.527 4.063-3.075 0-4.254-2.612-4.448-3.994l-.004-6.603c0-.2.12-.383.306-.46zm5.65.637-5.461-2.406-5.53 2.327v7.128c-.001.042-.054 2.868 1.657 4.623.917.941 2.194 1.42 3.795 1.42 1.602 0 2.887-.48 3.819-1.423 1.735-1.758 1.72-4.585 1.72-4.613zM31.98 31.55c-1.127 1.144-2.654 1.725-4.536 1.725-1.884 0-3.404-.58-4.517-1.727-2.005-2.063-1.94-5.197-1.935-5.329v-7.446a.5.5 0 0 1 .305-.46l6.035-2.54a.5.5 0 0 1 .396.003l5.956 2.625a.5.5 0 0 1 .299.457v7.375c.002.125.027 3.255-2.003 5.317m-20.988-7.314h8v1h-8c-2.811 0-4.811-2.016-4.98-5.016A4 4 0 0 1 6 19.841c0-2.509 1.318-4.223 3.817-4.979a8 8 0 0 1-.032-.647c0-2.916 1.577-5.445 4.017-6.445 3.298-1.348 7.042-.894 9.106 1.104a8.2 8.2 0 0 1 1.76 2.485c.609-.45 1.4-.66 2.349-.614 1.78.09 3.149 1.713 3.433 4.007 1.498.124 2.485.883 3.01 2.308l-.937.346c-.428-1.157-1.208-1.673-2.531-1.673a.5.5 0 0 1-.5-.47c-.138-2.338-1.406-3.463-2.526-3.519-.945-.053-1.645.22-2.08.791a.5.5 0 0 1-.472.193.5.5 0 0 1-.395-.323 7.4 7.4 0 0 0-1.807-2.814c-1.788-1.73-5.09-2.099-8.031-.895-2.063.845-3.396 3.011-3.396 5.52 0 .272.035.695.066.958a.5.5 0 0 1-.376.544C8.169 16.29 7 17.678 7 19.841c0 .101-.001.201.009.302.14 2.495 1.703 4.093 3.983 4.093" />
          </g>
        </symbol>
        <symbol id={`${uid}-s5`} viewBox="0 0 512 512" overflow="visible">
          <rect width="512" height="512" fill="none" />
          <path fill="#9aa0a6" d="m331.66 331.66-22.627-22.627c29.242-29.243 29.242-76.823 0-106.066l22.627-22.627c41.72 41.719 41.72 109.602 0 151.32m-151.32 0c-41.72-41.719-41.72-109.602 0-151.32l22.627 22.627c-29.242 29.243-29.242 76.823 0 106.066z" />
          <path fill="#4285f4" d="M309.033 202.967c-29.242-29.242-76.824-29.242-106.066 0L180.34 180.34C200.55 160.13 227.42 149 256 149s55.45 11.13 75.66 31.34zM256 363c-28.58 0-55.45-11.13-75.66-31.34l22.627-22.627c29.242 29.242 76.824 29.242 106.066 0l22.627 22.627C311.45 351.87 284.58 363 256 363" />
          <path fill="#4285f4" d="M170.229 147.603a62.2 62.2 0 0 0 8.521-31.478c0-34.531-28.094-62.625-62.625-62.625S53.5 81.594 53.5 116.125s28.094 62.625 62.625 62.625a62.2 62.2 0 0 0 31.478-8.52l45.281 45.281a75.4 75.4 0 0 1 22.627-22.627l-45.281-45.281zm-54.104-.853c-16.887 0-30.625-13.738-30.625-30.625S99.238 85.5 116.125 85.5s30.625 13.738 30.625 30.625-13.738 30.625-30.625 30.625" />
          <path fill="#9aa0a6" d="M215.51 319.117a75.4 75.4 0 0 1-22.627-22.627l-45.281 45.281a62.2 62.2 0 0 0-31.478-8.52c-34.531 0-62.625 28.094-62.625 62.625s28.094 62.625 62.625 62.625 62.625-28.094 62.625-62.625a62.2 62.2 0 0 0-8.521-31.478l45.281-45.281ZM116.125 426.5c-16.887 0-30.625-13.738-30.625-30.625s13.738-30.625 30.625-30.625 30.625 13.738 30.625 30.625-13.738 30.625-30.625 30.625" />
          <path fill="#4285f4" d="M395.875 333.25a62.2 62.2 0 0 0-31.478 8.52l-45.281-45.281a75.4 75.4 0 0 1-22.627 22.627l45.281 45.281a62.2 62.2 0 0 0-8.521 31.478c0 34.531 28.094 62.625 62.625 62.625s62.625-28.094 62.625-62.625-28.094-62.625-62.625-62.625zm0 93.25c-16.887 0-30.625-13.738-30.625-30.625s13.738-30.625 30.625-30.625 30.625 13.738 30.625 30.625-13.738 30.625-30.625 30.625" />
          <path fill="#9aa0a6" d="M395.875 53.5c-34.531 0-62.625 28.094-62.625 62.625a62.24 62.24 0 0 0 8.764 31.902l-45.118 45.118a75.4 75.4 0 0 1 22.481 22.773l45.444-45.444a62.2 62.2 0 0 0 31.054 8.276c34.531 0 62.625-28.094 62.625-62.625S430.406 53.5 395.875 53.5m0 93.25c-16.887 0-30.625-13.738-30.625-30.625S378.988 85.5 395.875 85.5 426.5 99.238 426.5 116.125s-13.738 30.625-30.625 30.625" />
        </symbol>
        <symbol id={`${uid}-s6`} viewBox="0 0 18 18" overflow="visible">
          <path fill="#949494" d="M.5 15.08a.16.16 0 0 0 .08.14l1.16.65L3.7 17a.17.17 0 0 0 .23-.06l.66-1.12a.16.16 0 0 0-.06-.21l-2.3-1.3a.17.17 0 0 1-.08-.14V3.85a.16.16 0 0 1 .08-.14l2.3-1.3a.16.16 0 0 0 .06-.21l-.66-1.12A.17.17 0 0 0 3.7 1L1.78 2.11l-1.2.67a.16.16 0 0 0-.08.14z" />
          <path fill="#a3a3a3" d="m2.14 3.77.06-.06 2.3-1.3a.14.14 0 0 0 .06-.21L3.9 1.08A.15.15 0 0 0 3.68 1L1.75 2.11l-1.19.67s-.05 0-.06.06l.9.51ZM4.5 15.59l-2.3-1.3a.2.2 0 0 1-.07-.09l-1.62 1h.05l1.15.65 2 1.11a.15.15 0 0 0 .22-.06l.66-1.12a.14.14 0 0 0-.09-.19" />
          <path fill="#949494" d="M17.5 15.08a.16.16 0 0 1-.08.14l-1.16.65L14.3 17a.17.17 0 0 1-.23-.06l-.66-1.12a.16.16 0 0 1 .06-.21l2.3-1.3a.17.17 0 0 0 .08-.14V3.85a.16.16 0 0 0-.08-.14l-2.3-1.3a.16.16 0 0 1-.06-.21l.66-1.12A.17.17 0 0 1 14.3 1l1.92 1.09 1.2.67a.16.16 0 0 1 .08.14z" />
          <path fill="#a3a3a3" d="m15.86 3.77-.06-.06-2.3-1.3a.14.14 0 0 1-.06-.21l.66-1.12a.15.15 0 0 1 .22-.08l1.93 1.09 1.19.67.06.06-.9.51ZM13.5 15.59l2.3-1.3a.2.2 0 0 0 .07-.09l1.62 1-1.15.65-2 1.11a.15.15 0 0 1-.22-.06l-.66-1.12a.14.14 0 0 1 .04-.19" />
          <polygon fill="#32bedd" points="14.31 5.93 14.31 12.07 8.99 15.16 8.99 9.01 14.31 5.93" />
          <polygon fill="#9cebff" points="14.31 5.93 9 9.02 3.68 5.93 9 2.84 14.31 5.93" />
          <polygon fill="#50e6ff" points="8.99 9.02 8.99 15.16 3.68 12.07 3.68 5.93 8.99 9.02" />
          <polygon fill="#9cebff" points="3.68 12.07 8.99 9.01 8.99 15.16 3.68 12.07" />
          <polygon fill="#50e6ff" points="14.31 12.07 8.99 9.01 8.99 15.16 14.31 12.07" />
        </symbol>
        <symbol id={`${uid}-s7`} viewBox="0 0 18 18" overflow="visible">
          <defs>
            <linearGradient id={`${uid}-s7-zw_a`} x1="9.88" x2="11.52" y1="8.59" y2="10.23" gradientTransform="rotate(-.08 -285.464 -1454.08)" gradientUnits="userSpaceOnUse">
              <stop offset="0" stopColor="#86d633" />
              <stop offset="1" stopColor="#5e9624" />
            </linearGradient>
            <linearGradient id={`${uid}-s7-zw_b`} x1="6.18" x2="7.81" y1="8.59" y2="10.23" gradientUnits="userSpaceOnUse">
              <stop offset="0" stopColor="#86d633" />
              <stop offset="1" stopColor="#5e9624" />
            </linearGradient>
            <linearGradient id={`${uid}-s7-zw_c`} x1="2.48" x2="4.11" y1="8.59" y2="10.23" gradientUnits="userSpaceOnUse">
              <stop offset="0" stopColor="#86d633" />
              <stop offset="1" stopColor="#5e9624" />
            </linearGradient>
          </defs>
          <circle cx="12.74" cy="8.99" r="1.16" fill={`url(#${uid}-s7-zw_a)`} />
          <circle cx="9.04" cy="9" r="1.16" fill={`url(#${uid}-s7-zw_b)`} />
          <circle cx="5.34" cy="9" r="1.16" fill={`url(#${uid}-s7-zw_c)`} />
          <path fill="#50e6ff" d="m6.182 13.638-.664.665a.3.3 0 0 1-.424 0L.18 9.404a.6.6 0 0 1-.001-.848l.663-.666 5.34 5.324a.3.3 0 0 1 0 .425" />
          <path fill="#1490df" d="m5.418 3.708.666.664a.3.3 0 0 1 0 .424L.838 10.057l-.666-.663a.6.6 0 0 1-.001-.849L4.994 3.71a.3.3 0 0 1 .424 0" />
          <path fill="#50e6ff" d="m17.157 7.88.663.666a.6.6 0 0 1 0 .848l-4.915 4.9a.3.3 0 0 1-.424 0l-.664-.666a.3.3 0 0 1 0-.424z" />
          <path fill="#1490df" d="m17.818 9.387-.665.664-5.247-5.261a.3.3 0 0 1 0-.425l.674-.67a.3.3 0 0 1 .424 0l4.823 4.836a.6.6 0 0 1-.002.849Z" />
        </symbol>
        <symbol id={`${uid}-s8`} viewBox="0 0 256 256" overflow="visible">
          <g fill="#919394">
            <path d="m140.844 1.778l-5.266 64.853a66 66 0 0 0-7.542-.427c-3.203 0-6.334.214-9.393.712l-2.99-31.432a1.72 1.72 0 0 1 1.709-1.848h5.337l-2.562-31.787C120.066.853 120.848 0 121.774 0h17.434c.996 0 1.779.853 1.636 1.849zm-43.976 3.2c-.285-.925-1.281-1.494-2.206-1.138L78.295 9.813c-.925.356-1.352 1.423-.925 2.276l13.307 29.013l-5.052 1.85c-.926.355-1.352 1.421-.926 2.275l13.592 28.515a61 61 0 0 1 15.868-6.044L96.94 4.978zM56.734 23.04l37.643 53.049c-4.768 3.129-9.108 6.827-12.809 11.093L59.011 64.996a1.72 1.72 0 0 1 .071-2.49l4.127-3.413L40.794 36.41c-.711-.711-.64-1.849.142-2.489l13.307-11.164c.783-.64 1.85-.498 2.42.284zM25.139 53.76c-.783-.569-1.921-.284-2.42.569l-8.68 15.075c-.499.854-.143 1.92.71 2.347L43.64 85.404l-2.704 4.623c-.498.853-.142 1.99.783 2.346l28.749 13.156a60.2 60.2 0 0 1 8.254-14.791zM3.862 94.72c.143-.996 1.139-1.564 2.064-1.351l62.976 16.427a62.3 62.3 0 0 0-2.704 16.782l-31.524-2.56a1.642 1.642 0 0 1-1.494-1.991l.925-5.263l-31.808-2.986c-.996-.071-1.637-.996-1.495-1.991l2.99-17.138zm-2.348 42.524c-.996.072-1.637.996-1.494 1.992l3.06 17.137c.142.996 1.138 1.565 2.063 1.351l30.883-8.035l.925 5.262c.143.996 1.139 1.565 2.064 1.351l30.456-8.39c-1.779-5.263-2.917-10.88-3.202-16.64l-64.826 5.972zM11.62 182.33c-.498-.853-.143-1.92.711-2.347l58.778-27.875c2.206 5.262 5.195 10.169 8.753 14.577L54.1 185.031c-.783.569-1.921.356-2.42-.498l-2.704-4.693l-26.257 18.133c-.783.57-1.922.285-2.42-.569l-8.752-15.075zm71.23-12.231L37.094 216.39c-.712.711-.64 1.849.142 2.489l13.378 11.164c.783.64 1.85.498 2.42-.284l18.501-26.027l4.127 3.485c.783.64 1.922.498 2.49-.356l17.933-26.026c-4.839-2.987-9.322-6.614-13.165-10.738zm-9.037 74.31c-.925-.355-1.352-1.421-.925-2.275L100 182.97c4.98 2.56 10.389 4.48 16.01 5.547l-7.97 30.577c-.213.925-1.28 1.494-2.205 1.138l-5.052-1.849l-8.468 30.791c-.285.925-1.281 1.494-2.206 1.138l-16.367-5.973zm46.68-55.11l-5.265 64.853c-.071.996.711 1.849 1.637 1.849h17.434c.996 0 1.779-.853 1.636-1.849l-2.561-31.787h5.336a1.72 1.72 0 0 0 1.708-1.848l-2.988-31.432c-3.06.498-6.191.712-9.393.712c-2.562 0-5.053-.143-7.543-.498m62.763-175.574c.427-.924 0-1.92-.925-2.275l-16.366-5.973c-.926-.356-1.922.213-2.206 1.137l-8.468 30.791l-5.053-1.848c-.925-.356-1.921.213-2.206 1.137l-7.97 30.578c5.693 1.138 11.03 3.058 16.011 5.547zm35.722 25.814L173.222 85.83a62 62 0 0 0-13.165-10.738l17.933-26.026c.569-.783 1.707-.996 2.49-.356l4.127 3.485l18.502-26.027c.57-.782 1.708-.925 2.42-.285l13.377 11.165c.783.64.783 1.778.143 2.489zm24.764 36.409c.925-.427 1.21-1.494.711-2.347L235.7 58.524c-.498-.853-1.637-1.066-2.42-.568l-26.257 18.133l-2.704-4.622c-.499-.854-1.637-1.138-2.42-.498l-25.76 18.347c3.558 4.408 6.476 9.315 8.753 14.577l58.778-27.875zm9.25 23.609l2.99 17.137c.142.996-.499 1.85-1.495 1.991l-64.826 6.045c-.285-5.831-1.424-11.378-3.203-16.64l30.457-8.391c.925-.285 1.921.355 2.063 1.35l.925 5.263l30.884-8.035c.925-.214 1.92.355 2.063 1.35zm-2.917 62.933c.925.213 1.921-.356 2.064-1.351L255.126 144c.143-.996-.498-1.849-1.494-1.991l-31.808-2.987l.925-5.262c.142-.996-.498-1.849-1.495-1.991l-31.523-2.56a62.3 62.3 0 0 1-2.704 16.782l62.976 16.427zM233.28 201.6c-.498.853-1.636 1.067-2.419.569l-53.583-36.978a60.2 60.2 0 0 0 8.254-14.791l28.749 13.156c.925.426 1.28 1.493.783 2.346l-2.704 4.622l28.89 13.654c.854.426 1.21 1.493.712 2.346zm-71.657-21.831l37.643 53.049c.57.782 1.708.924 2.42.284l13.306-11.164c.783-.64.783-1.778.143-2.49l-22.415-22.684l4.127-3.413c.783-.64.783-1.778.07-2.489l-22.557-22.186c-3.771 4.266-8.04 8.035-12.808 11.093zm-.356 72.249c-.925.355-1.921-.214-2.206-1.138l-17.22-62.72a61 61 0 0 0 15.868-6.044l13.592 28.515c.426.925 0 1.991-.926 2.276l-5.052 1.849l13.307 29.013c.427.924 0 1.92-.925 2.275l-16.367 5.974z" />
          </g>
        </symbol>
        <symbol id={`${uid}-s9`} viewBox="0 0 80 80" overflow="visible">
          <g fill="none" fillRule="evenodd">
            <rect width="80" height="80" fill="#ed7100" />
            <path fill="#fff" d="m46.842 32.199-6.829 7.921 7.428 8.664h-2.772L38 41v8h-2V32h2v7l6.181-6.801zM64 48.234l-8-4.801V32a1 1 0 0 0-.496-.864L44 24.426v-9.674l20 11.819zm1.509-23.095-22-13a1 1 0 0 0-1.005-.008c-.311.178-.504.51-.504.869v12c0 .355.189.684.496.864L54 32.574V44a1 1 0 0 0 .486.857l10 6A.997.997 0 0 0 66 50V26a1 1 0 0 0-.491-.861M40.445 66.863 17 54.399V26.571l20-11.819v9.699l-10.537 6.705A1 1 0 0 0 26 32v17a1 1 0 0 0 .538.887l13.453 7c.289.15.633.151.921.001l13.052-6.744 8.032 4.82zm24.07-12.721-10-6a1 1 0 0 0-.974-.03l-13.086 6.761L28 48.393V32.549l10.537-6.705c.288-.184.463-.502.463-.844V13a1 1 0 0 0-1.509-.861l-22 13A1 1 0 0 0 15 26v29c0 .369.204.709.53.883l24.454 13a1 1 0 0 0 .953-.008l23.547-13a1.002 1.002 0 0 0 .031-1.733" />
          </g>
        </symbol>
        <filter id={`${uid}-f7`} x="-0.1" y="-0.1" width="1.2" height="1.2" colorInterpolationFilters="sRGB">
          <feColorMatrix type="matrix" values="0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0.8929 3.0038 0.3032 0 -2.604" result="a" />
          <feFlood floodColor="#919394" />
          <feComposite in2="a" operator="in" />
        </filter>
        <symbol id={`${uid}-s10`} viewBox="0 0 48 48" overflow="visible">
          <polygon fill="#8c4fff" fillRule="evenodd" points="24.279 2 5.779 12.68 6.778 14.413 23.278 4.886 23.278 22.938 7.328 22.938 11.485 18.781 10.072 17.367 3 24.437 10.072 31.507 11.485 30.094 6.328 24.937 23.278 24.937 23.278 42.992 6.778 33.466 5.779 35.198 24.279 45.879 42.778 35.198 41.779 33.466 25.279 42.992 25.279 24.937 41.999 24.937 37.402 29.536 38.816 30.949 45.886 23.879 38.816 16.808 37.402 18.222 42.116 22.938 25.279 22.938 25.279 4.886 41.779 14.413 42.778 12.68" />
        </symbol>
        <symbol id={`${uid}-s11`} 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}-s12`} viewBox="0 0 18 18" overflow="visible">
          <defs>
            <linearGradient id={`${uid}-s12-pq_b`} x1="4.4" x2="4.37" y1="11.48" y2="7.53" gradientUnits="userSpaceOnUse">
              <stop offset="0" stopColor="#ccc" />
              <stop offset="1" stopColor="#fcfcfc" />
            </linearGradient>
            <linearGradient id={`${uid}-s12-pq_c`} x1="10.13" x2="10.13" y1="15.45" y2="11.9" gradientUnits="userSpaceOnUse">
              <stop offset="0" stopColor="#ccc" />
              <stop offset="1" stopColor="#fcfcfc" />
            </linearGradient>
            <linearGradient id={`${uid}-s12-pq_d`} x1="14.18" x2="14.18" y1="11.15" y2="7.38" gradientUnits="userSpaceOnUse">
              <stop offset="0" stopColor="#ccc" />
              <stop offset="1" stopColor="#fcfcfc" />
            </linearGradient>
            <radialGradient id={`${uid}-s12-pq_a`} cx="13428.81" cy="3518.86" r="56.67" gradientTransform="matrix(.15 0 0 .15 -2005.33 -518.83)" gradientUnits="userSpaceOnUse">
              <stop offset=".18" stopColor="#5ea0ef" />
              <stop offset="1" stopColor="#0078d4" />
            </radialGradient>
          </defs>
          <path fill={`url(#${uid}-s12-pq_a)`} d="M14.21 15.72A8.5 8.5 0 0 1 3.79 2.28l.09-.06a8.5 8.5 0 0 1 10.33 13.5" />
          <path fill="#fff" d="M6.69 7.23a13 13 0 0 1 8.91-3.58 8.5 8.5 0 0 0-1.49-1.44 14.3 14.3 0 0 0-4.69 1.1 12.5 12.5 0 0 0-4.08 2.82 2.76 2.76 0 0 1 1.35 1.1m-4.21 3.42a18 18 0 0 0-.83 2.62 8 8 0 0 0 .62.92c.18.23.35.44.55.65a18 18 0 0 1 1.08-3.47 2.76 2.76 0 0 1-1.42-.72" opacity=".6" />
          <path fill="#f2f2f2" d="M3.46 6.11a12 12 0 0 1-.69-2.94 8 8 0 0 0-1.1 1.45A12.7 12.7 0 0 0 2.24 7a2.7 2.7 0 0 1 1.22-.89" opacity=".55" />
          <circle cx="4.38" cy="8.68" r="2.73" fill={`url(#${uid}-s12-pq_b)`} />
          <path fill="#f2f2f2" d="M8.36 13.67a1.77 1.77 0 0 1 .54-1.27 12 12 0 0 1-2.53-1.86 2.74 2.74 0 0 1-1.49.83 13 13 0 0 0 1.45 1.28 12 12 0 0 0 2.05 1.25 2 2 0 0 1-.02-.23m6.3.21a12 12 0 0 1-2.76-.32.4.4 0 0 1 0 .11 1.75 1.75 0 0 1-.51 1.24 13.7 13.7 0 0 0 3.42.24A8.2 8.2 0 0 0 16 13.81a12 12 0 0 1-1.34.07" opacity=".55" />
          <circle cx="10.13" cy="13.67" r="1.78" fill={`url(#${uid}-s12-pq_c)`} />
          <path fill="#f2f2f2" d="M12.32 8.93a1.83 1.83 0 0 1 .61-1 25.5 25.5 0 0 1-4.46-4.14 17 17 0 0 1-2-2.92 7.6 7.6 0 0 0-1.09.42 18 18 0 0 0 2.15 3.18 26.4 26.4 0 0 0 4.79 4.46" opacity=".7" />
          <circle cx="14.18" cy="9.27" r="1.89" fill={`url(#${uid}-s12-pq_d)`} />
          <path fill="#f2f2f2" d="m17.35 10.54-.35-.17-.3-.16h-.06l-.26-.21h-.07L16 9.8a1.76 1.76 0 0 1-.64.92c.12.08.25.15.38.22l.08.05.35.19.86.45a9 9 0 0 0 .29-1.11Z" opacity=".55" />
          <circle cx="4.38" cy="8.68" r="2.73" fill={`url(#${uid}-s12-pq_b)`} />
          <circle cx="10.13" cy="13.67" r="1.78" fill={`url(#${uid}-s12-pq_c)`} />
        </symbol>
        <filter id={`${uid}-f8`} x="-0.1" y="-0.1" width="1.2" height="1.2" colorInterpolationFilters="sRGB">
          <feColorMatrix type="matrix" values="0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0.8929 3.0038 0.3032 0 -2.604" result="a" />
          <feFlood floodColor="#919394" floodOpacity="0.4" />
          <feComposite in2="SourceAlpha" operator="in" result="base" />
          <feFlood floodColor="#919394" />
          <feComposite in2="a" operator="in" result="hi" />
          <feMerge>
            <feMergeNode in="base" />
            <feMergeNode in="hi" />
          </feMerge>
        </filter>
        <symbol id={`${uid}-s13`} viewBox="0 0 18 18" overflow="visible">
          <defs>
            <linearGradient id={`${uid}-s13-130_a`} x1="9.084" x2="9.084" y1="790.967" y2="787.492" gradientTransform="matrix(1 0 0 -1 0 791.516)" gradientUnits="userSpaceOnUse">
              <stop offset="0" stopColor="#50e6ff" />
              <stop offset="1" stopColor="#32bedd" />
            </linearGradient>
            <linearGradient id={`${uid}-s13-130_b`} x1="9.065" x2="9.065" y1="13.843" y2="10.368" gradientUnits="userSpaceOnUse">
              <stop offset="0" stopColor="#5e9624" />
              <stop offset=".183" stopColor="#629c25" />
              <stop offset=".435" stopColor="#6dae2a" />
              <stop offset=".726" stopColor="#7fcb30" />
              <stop offset=".822" stopColor="#86d633" />
            </linearGradient>
          </defs>
          <path fill="#b3b3b3" d="M7.85 13.342a1.738 1.738 0 1 0 2.436-2.479 1.7 1.7 0 0 0-.626-.389V3.009H8.548v7.444a1.73 1.73 0 0 0-.7 2.891Z" />
          <circle cx="9.084" cy="2.209" r="1.738" fill={`url(#${uid}-s13-130_a)`} />
          <path fill="#50e6ff" d="m6.195 16.778-.662.663a.3.3 0 0 1-.424 0L.216 12.564a.6.6 0 0 1 0-.848l.66-.664 5.318 5.302a.3.3 0 0 1 0 .425" />
          <path fill="#1490df" d="m5.435 6.886.664.662a.3.3 0 0 1 0 .424l-5.225 5.24-.664-.663a.6.6 0 0 1-.001-.848L5.01 6.886a.3.3 0 0 1 .425 0" />
          <path fill="#50e6ff" d="m17.122 11.052.661.664a.6.6 0 0 1 0 .848l-4.893 4.879a.3.3 0 0 1-.424-.001l-.662-.664a.3.3 0 0 1 0-.424z" />
          <path fill="#1490df" d="m17.788 12.547-.663.662-5.225-5.24a.3.3 0 0 1 0-.424l.664-.662a.3.3 0 0 1 .424 0L17.79 11.7a.6.6 0 0 1-.002.848" />
          <circle cx="9.065" cy="12.106" r="1.738" fill={`url(#${uid}-s13-130_b)`} />
        </symbol>
        <symbol id={`${uid}-s14`} viewBox="0 0 18 18" overflow="visible">
          <defs>
            <linearGradient id={`${uid}-s14-zy_a`} x1="8.59" x2="9.12" y1="-7.79" y2="20.05" gradientUnits="userSpaceOnUse">
              <stop offset=".22" stopColor="#32d4f5" />
              <stop offset=".47" stopColor="#31d1f3" />
              <stop offset=".63" stopColor="#2ec9eb" />
              <stop offset=".77" stopColor="#29bade" />
              <stop offset=".89" stopColor="#22a5cb" />
              <stop offset="1" stopColor="#198ab3" />
              <stop offset="1" stopColor="#198ab3" />
            </linearGradient>
          </defs>
          <path fill={`url(#${uid}-s14-zy_a)`} d="M15.06 8.67h-1V5.59a5.8 5.8 0 0 0-1.49-3.92A4.79 4.79 0 0 0 8.91 0a4.79 4.79 0 0 0-3.7 1.67 5.73 5.73 0 0 0-1.49 3.92v3.08h-.81a.7.7 0 0 0-.69.69v8a.7.7 0 0 0 .69.69h12.15a.71.71 0 0 0 .7-.69v-8a.71.71 0 0 0-.7-.69m-3.37 0H6.13V5.54A3.18 3.18 0 0 1 7 3.39a2.5 2.5 0 0 1 1.88-.86 2.54 2.54 0 0 1 1.89.86 3 3 0 0 1 .32.43 3 3 0 0 1 .61 1.71Z" />
          <path fill="#50e6ff" d="M15.09 8.67H2.92a.66.66 0 0 0-.44.17l13.05 9a.67.67 0 0 0 .25-.52v-8a.71.71 0 0 0-.69-.65" />
          <path fill="#fff" d="M2.94 8.67H15.1a.7.7 0 0 1 .45.17l-13.06 9a.7.7 0 0 1-.25-.52v-8a.72.72 0 0 1 .7-.65" opacity=".2" />
          <path fill="#fff" d="M7.8 10.6 9 9.4a.07.07 0 0 1 .09 0l1.19 1.2a.06.06 0 0 1 0 .1h-.7a.06.06 0 0 0-.06.06v1.54a.06.06 0 0 1-.06.06h-.79a.05.05 0 0 1-.06-.06v-1.54a.07.07 0 0 0-.07-.06h-.7a.06.06 0 0 1-.04-.1m2.47 5.48-1.19 1.19a.06.06 0 0 1-.09 0L7.8 16.08a.06.06 0 0 1 0-.1h.7a.07.07 0 0 0 .07-.06v-1.55a.06.06 0 0 1 .06-.06h.74a.06.06 0 0 1 .06.06v1.55a.06.06 0 0 0 .06.06h.7a.06.06 0 0 1 .08.1m-4.7-1.55v-.7a.06.06 0 0 0-.06-.06H4a.06.06 0 0 1-.06-.06V13a.06.06 0 0 1 .06-.09h1.51a.06.06 0 0 0 .06-.06v-.7a.07.07 0 0 1 .11-.05l1.19 1.2a.06.06 0 0 1 0 .08l-1.19 1.2a.07.07 0 0 1-.11-.05m6.93-2.38v.7a.06.06 0 0 0 .06.06h1.54s.07 0 .07.06v.74a.07.07 0 0 1-.07.06h-1.54a.06.06 0 0 0-.06.06v.7a.06.06 0 0 1-.1.05l-1.19-1.2v-.08l1.19-1.2s.1-.01.1.05" />
        </symbol>
        <symbol id={`${uid}-s15`} viewBox="0 0 80 80" overflow="visible">
          <g fill="none" fillRule="evenodd">
            <rect width="80" height="80" fill="#8c4fff" />
            <path fill="#fff" d="M29.97 60.66h17.86v-5.873c0-.517-.566-.953-1.236-.953H31.206c-.67 0-1.236.436-1.236.953zm23.172 3.335V68h-2v-4.005c0-.786-.458-1.334-.868-1.334H27.527c-.41 0-.867.548-.867 1.334V68h-2v-4.005c0-1.838 1.287-3.335 2.867-3.335h.443v-5.873c0-1.628 1.451-2.954 3.236-2.954h15.388c1.785 0 3.238 1.326 3.238 2.954v5.873h.442c1.581 0 2.868 1.497 2.868 3.335M45.52 38.594a2.313 2.313 0 0 0 2.31-2.31 2.313 2.313 0 0 0-2.31-2.31 2.313 2.313 0 0 0-2.31 2.31 2.313 2.313 0 0 0 2.31 2.31m-1 12.034V40.465c-1.895-.454-3.311-2.15-3.311-4.181a4.316 4.316 0 0 1 4.31-4.31 4.316 4.316 0 0 1 4.312 4.31c0 2.031-1.417 3.727-3.31 4.181v10.163zM41.137 28.56a2.31 2.31 0 0 0-2.31-2.31 2.31 2.31 0 0 0-2.309 2.31 2.31 2.31 0 0 0 2.309 2.309 2.31 2.31 0 0 0 2.31-2.309m2 0c0 2.005-1.38 3.678-3.237 4.158v17.909h-2V32.765a4.31 4.31 0 0 1-3.383-4.204 4.315 4.315 0 0 1 4.31-4.31 4.316 4.316 0 0 1 4.31 4.31M32.28 33.974a2.31 2.31 0 0 0-2.31 2.31 2.31 2.31 0 0 0 2.31 2.31 2.31 2.31 0 0 0 2.31-2.31 2.31 2.31 0 0 0-2.31-2.31m0-2a4.315 4.315 0 0 1 4.31 4.31c0 2.031-1.416 3.727-3.31 4.181v10.163h-2V40.465c-1.894-.454-3.31-2.15-3.31-4.181a4.316 4.316 0 0 1 4.31-4.31M68 37.365c0 7.653-5.81 10.38-11.247 10.38h-7.816v-2h7.816c2.17 0 9.246-.605 9.246-8.38 0-5.626-4.407-7.69-8.102-8.432a1 1 0 0 1-.802-.922c-.263-4.44-2.857-6.014-4.999-6.014-1.448 0-2.807.69-3.726 1.895a1 1 0 0 1-1.735-.262c-.634-1.724-1.76-4.136-3.518-5.839-3.882-3.773-9.193-4.798-14.213-2.74-4.097 1.677-7.43 6.804-7.43 11.427 0 .51.03 1.02.093 1.519a1 1 0 0 1-.755 1.094c-2.048.5-6.811 2.302-6.811 8.196q.002.308.022.617c.242 4.322 4.309 7.84 9.064 7.84h5.75v2h-5.75c-5.799 0-10.762-4.365-11.062-9.73a13 13 0 0 1-.025-.727c0-4.796 2.785-8.446 7.501-9.908q-.027-.45-.028-.9c0-4.782 3.243-11.058 8.673-13.28 5.778-2.368 11.897-1.187 16.363 3.156 1.558 1.506 2.666 3.447 3.417 5.136a6.57 6.57 0 0 1 4.17-1.495c3.095 0 6.347 2.214 6.93 7.137C64.82 28.525 68 32.137 68 37.366" />
          </g>
        </symbol>
        <symbol id={`${uid}-s16`} viewBox="0 0 18 18" overflow="visible">
          <defs>
            <linearGradient id={`${uid}-s16-10b_a`} x1="5.33" x2="8.74" y1="2.81" y2="6.22" gradientTransform="rotate(-.08 -980.175 -1454.565)" gradientUnits="userSpaceOnUse">
              <stop offset="0" stopColor="#86d633" />
              <stop offset="1" stopColor="#5e9624" />
            </linearGradient>
            <linearGradient id={`${uid}-s16-10b_b`} x1="11.84" x2="15.24" y1="14.54" y2="17.95" gradientUnits="userSpaceOnUse">
              <stop offset="0" stopColor="#86d633" />
              <stop offset="1" stopColor="#5e9624" />
            </linearGradient>
            <linearGradient id={`${uid}-s16-10b_c`} x1="-1.34" x2="2.06" y1="14.53" y2="17.93" gradientUnits="userSpaceOnUse">
              <stop offset="0" stopColor="#86d633" />
              <stop offset="1" stopColor="#5e9624" />
            </linearGradient>
          </defs>
          <rect width="1.98" height="9.5" x="4.74" y="4.21" fill="#a67af4" transform="rotate(30 5.723 8.967)" />
          <rect width="1.98" height="9.5" x="11.21" y="4.37" fill="#a67af4" transform="rotate(-30 12.2 9.109)" />
          <rect width="1.98" height="9.5" x="7.9" y="9.97" fill="#773adc" transform="rotate(90 8.895 14.715)" />
          <circle cx="9.07" cy="3.14" r="2.41" fill={`url(#${uid}-s16-10b_a)`} />
          <circle cx="15.59" cy="14.86" r="2.41" fill={`url(#${uid}-s16-10b_b)`} />
          <circle cx="2.41" cy="14.86" r="2.41" fill={`url(#${uid}-s16-10b_c)`} />
        </symbol>
        <symbol id={`${uid}-s17`} viewBox="0 0 24 24" overflow="visible">
          <path fill="none" stroke="#919394" strokeLinecap="round" strokeLinejoin="round" strokeWidth="1.88" d="M3 15a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2zm14 2v.01M13 17v.01M15 13v-2m-3.25-2.25a4 4 0 0 1 6.5 0M8.5 6.5a8 8 0 0 1 13 0" />
        </symbol>
      </defs>
      <rect width="1323" height="1594" fill={`url(#${uid}-bg)`} />
      <rect width="1323" height="1594" fill={`url(#${uid}-grid)`} />
      <rect width="1323" height="1594" fill={`url(#${uid}-wash)`} />
      <text fontSize="18" fontWeight="700" letterSpacing="1.08" fill="#dadbdb">
        <tspan x="28" y="42.89">
          MULTI-CLOUD WITH A SHARED IDENTITY PROVIDER
        </tspan>
      </text>
      <text fontSize="11.5" fontWeight="400" fill="#9d9fa0">
        <tspan x="28" y="65.25">
          One Okta tenant signs users in to AWS, Google Cloud and Azure; private interconnects meet at a colocation router
        </tspan>
      </text>
      <g id={`${uid}-g-aws`}>
        <rect x="28" y="333" width="298" height="494" rx="3.01" fill="#ffffff" fillOpacity="0.03" stroke="#ffffff" strokeOpacity="0.16" strokeWidth="1.5" />
        <g opacity="0">
          <rect x="28" y="333" width="298" height="494" rx="3.01" fill="#60a5fa" fillOpacity="0.03" stroke="#60a5fa" strokeOpacity="0.6" strokeWidth="1.5" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.1013;0.1535;0.8879;0.94;1" dur="3.454s" repeatCount="indefinite" />
        </g>
      </g>
      <g id={`${uid}-g-gcloud`}>
        <rect x="366" y="333" width="338" height="535" rx="3.01" fill="#ffffff" fillOpacity="0.03" stroke="#ffffff" strokeOpacity="0.16" strokeWidth="1.5" />
        <g opacity="0">
          <rect x="366" y="333" width="338" height="535" rx="3.01" fill="#60a5fa" fillOpacity="0.03" stroke="#60a5fa" strokeOpacity="0.6" strokeWidth="1.5" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.1013;0.1535;0.8879;0.94;1" dur="3.454s" repeatCount="indefinite" />
        </g>
      </g>
      <g id={`${uid}-g-tenant`}>
        <rect x="757" y="333" width="538" height="776" rx="3.01" fill="#ffffff" fillOpacity="0.03" stroke="#ffffff" strokeOpacity="0.16" strokeWidth="1.5" />
        <g opacity="0">
          <rect x="757" y="333" width="538" height="776" rx="3.01" fill="#60a5fa" fillOpacity="0.03" stroke="#60a5fa" strokeOpacity="0.6" strokeWidth="1.5" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.1013;0.1535;0.8879;0.94;1" dur="3.454s" repeatCount="indefinite" />
        </g>
      </g>
      <g id={`${uid}-g-aws-region`}>
        <rect x="48" y="391" width="258" height="416" fill="none" stroke="#ffffff" strokeOpacity="0.16" strokeWidth="1.5" strokeDasharray="4.51 4.51" />
        <g opacity="0">
          <rect x="48" y="391" width="258" height="416" fill="none" stroke="#60a5fa" strokeOpacity="0.5" strokeWidth="1.5" strokeDasharray="4.51 4.51" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.1013;0.1535;0.8879;0.94;1" dur="3.454s" repeatCount="indefinite" />
        </g>
      </g>
      <g id={`${uid}-g-gcp-project`}>
        <rect x="386" y="391" width="298" height="457" rx="3.01" fill="#ffffff" fillOpacity="0.03" stroke="#ffffff" strokeOpacity="0.16" strokeWidth="1.5" />
        <g opacity="0">
          <rect x="386" y="391" width="298" height="457" rx="3.01" fill="none" stroke="#60a5fa" strokeOpacity="0.6" strokeWidth="1.5" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.1013;0.1535;0.8879;0.94;1" dur="3.454s" repeatCount="indefinite" />
        </g>
      </g>
      <g id={`${uid}-g-azure`}>
        <rect x="777" y="391" width="498" height="698" rx="3.01" fill="#ffffff" fillOpacity="0.03" stroke="#ffffff" strokeOpacity="0.16" strokeWidth="1.5" />
        <g opacity="0">
          <rect x="777" y="391" width="498" height="698" rx="3.01" fill="none" stroke="#60a5fa" strokeOpacity="0.6" strokeWidth="1.5" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.1013;0.1535;0.8879;0.94;1" dur="3.454s" repeatCount="indefinite" />
        </g>
      </g>
      <g id={`${uid}-g-aws-vpc`}>
        <rect x="68" y="449" width="218" height="181" rx="3.01" fill="none" stroke="#ffffff" strokeOpacity="0.16" strokeWidth="1.5" />
        <g opacity="0">
          <rect x="68" y="449" width="218" height="181" rx="3.01" fill="none" stroke="#60a5fa" strokeOpacity="0.6" strokeWidth="1.5" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.1013;0.1535;0.8879;0.94;1" dur="3.454s" repeatCount="indefinite" />
        </g>
      </g>
      <g id={`${uid}-g-gcp-vpc`}>
        <rect x="406" y="685" width="258" height="143" fill="none" stroke="#ffffff" strokeOpacity="0.16" strokeWidth="1.5" strokeDasharray="4.51 4.51" />
        <g opacity="0">
          <rect x="406" y="685" width="258" height="143" fill="none" stroke="#60a5fa" strokeOpacity="0.5" strokeWidth="1.5" strokeDasharray="4.51 4.51" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.1013;0.1535;0.8879;0.94;1" dur="3.454s" repeatCount="indefinite" />
        </g>
      </g>
      <g id={`${uid}-g-azure-rg`}>
        <rect x="797" y="443" width="458" height="626" fill="none" stroke="#ffffff" strokeOpacity="0.16" strokeWidth="1.5" strokeDasharray="4.51 4.51" />
        <g opacity="0">
          <rect x="797" y="443" width="458" height="626" fill="none" stroke="#60a5fa" strokeOpacity="0.5" strokeWidth="1.5" strokeDasharray="4.51 4.51" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.1013;0.1535;0.8879;0.94;1" dur="3.454s" repeatCount="indefinite" />
        </g>
      </g>
      <g id={`${uid}-g-azure-vnet`}>
        <rect x="817" y="737" width="418" height="312" rx="3.01" fill="none" stroke="#ffffff" strokeOpacity="0.16" strokeWidth="1.5" />
        <g opacity="0">
          <rect x="817" y="737" width="418" height="312" rx="3.01" fill="none" stroke="#60a5fa" strokeOpacity="0.6" strokeWidth="1.5" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.1013;0.1535;0.8879;0.94;1" dur="3.454s" repeatCount="indefinite" />
        </g>
      </g>
      <g id={`${uid}-e-e1`}>
        <path d="M360 184 L360 196 Q360 204 352 204 L56 204 Q48 204 48 212 L48 332.25" fill="none" stroke="#ffffff" strokeOpacity="0.25" strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round" strokeDasharray="6.01 4.51" />
        <path d="M41.99 323.98 L48 333 L54.01 323.98" fill="none" stroke="#ffffff" strokeOpacity="0.4" strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round" />
        <g mask={`url(#${uid}-m-e1)`} opacity="0">
          <path d="M360 184 L360 196 Q360 204 352 204 L56 204 Q48 204 48 212 L48 332.25" fill="none" stroke="#60a5fa" strokeOpacity="0.5" strokeWidth="1.8" strokeLinecap="round" strokeLinejoin="round" strokeDasharray="6.01 4.51" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.3619;0.4141;0.9;0.9521;1" dur="3.454s" repeatCount="indefinite" />
        </g>
        <g opacity="0">
          <path d="M41.99 323.98 L48 333 L54.01 323.98" fill="none" stroke="#60a5fa" strokeOpacity="0.7" strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.6394;0.6915;0.9;0.9521;1" dur="3.454s" repeatCount="indefinite" />
        </g>
      </g>
      <g id={`${uid}-e-e2`}>
        <path d="M386 184 L386 332.25" fill="none" stroke="#ffffff" strokeOpacity="0.25" strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round" strokeDasharray="6.01 4.51" />
        <path d="M379.99 323.98 L386 333 L392.01 323.98" fill="none" stroke="#ffffff" strokeOpacity="0.4" strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round" />
      </g>
      <g id={`${uid}-e-e3`}>
        <path d="M411 184 L411 196 Q411 204 419 204 L769 204 Q777 204 777 212 L777 332.25" fill="none" stroke="#ffffff" strokeOpacity="0.25" strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round" strokeDasharray="6.01 4.51" />
        <path d="M770.99 323.98 L777 333 L783.01 323.98" fill="none" stroke="#ffffff" strokeOpacity="0.4" strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round" />
      </g>
      <g id={`${uid}-e-e4`}>
        <path d="M177.5 610 L177.5 699" fill="none" stroke="#ffffff" strokeOpacity="0.25" strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round" />
      </g>
      <g id={`${uid}-e-e5`}>
        <path d="M178 787 L178 1193" fill="none" stroke="#ffffff" strokeOpacity="0.25" strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round" />
      </g>
      <g id={`${uid}-e-e6`}>
        <path d="M536 531 L536 737" fill="none" stroke="#ffffff" strokeOpacity="0.25" strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round" />
      </g>
      <g id={`${uid}-e-e7`}>
        <path d="M535.5 808 L535.5 1193" fill="none" stroke="#ffffff" strokeOpacity="0.25" strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round" />
      </g>
      <g id={`${uid}-e-e8`}>
        <path d="M1027 583 L1027 789" fill="none" stroke="#ffffff" strokeOpacity="0.25" strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round" />
      </g>
      <g id={`${uid}-e-e9`}>
        <path d="M1026.5 877 L1026.5 941" fill="none" stroke="#ffffff" strokeOpacity="0.25" strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round" />
      </g>
      <g id={`${uid}-e-e10`}>
        <path d="M1026.5 1029 L1026.5 1193" fill="none" stroke="#ffffff" strokeOpacity="0.25" strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round" />
      </g>
      <g id={`${uid}-e-e11`}>
        <path d="M178 1264 L178 1361 Q178 1369 186 1369 L501 1369 Q509 1369 509 1377 L509 1413" fill="none" stroke="#ffffff" strokeOpacity="0.25" strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round" />
      </g>
      <g id={`${uid}-e-e12`}>
        <path d="M536 1264 L536 1413" fill="none" stroke="#ffffff" strokeOpacity="0.25" strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round" />
      </g>
      <g id={`${uid}-e-e13`}>
        <path d="M1027 1264 L1027 1361 Q1027 1369 1019 1369 L570 1369 Q562 1369 562 1377 L562 1413" fill="none" stroke="#ffffff" strokeOpacity="0.25" strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round" />
      </g>
      <g id={`${uid}-el-e1`}>
        <rect x="53" y="248" width="45" height="21" rx="3" fill="#0b1012" stroke="#ffffff" strokeOpacity="0.1" strokeWidth="1.5" />
        <text fontSize="8.75" fontWeight="700" letterSpacing="0.53" fill="#979899" textAnchor="middle">
          <tspan x="75.76" y="261.61">
            SAML
          </tspan>
        </text>
        <g opacity="0">
          <rect x="53" y="248" width="45" height="21" rx="3" fill="#0b1012" stroke="#60a5fa" strokeOpacity="0.5" strokeWidth="1.5" />
          <text fontSize="8.75" fontWeight="700" letterSpacing="0.53" fill="#60a5fa" textAnchor="middle">
            <tspan x="75.76" y="261.61">
              SAML
            </tspan>
          </text>
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.3619;0.4141;0.9;0.9521;1" dur="3.454s" repeatCount="indefinite" />
        </g>
      </g>
      <g id={`${uid}-el-e2`}>
        <rect x="391" y="248" width="41" height="21" rx="3" fill="#0b1012" stroke="#ffffff" strokeOpacity="0.1" strokeWidth="1.5" />
        <text fontSize="8.75" fontWeight="700" letterSpacing="0.53" fill="#979899" textAnchor="middle">
          <tspan x="411.76" y="261.61">
            OIDC
          </tspan>
        </text>
      </g>
      <g id={`${uid}-el-e3`}>
        <rect x="782" y="248" width="45" height="21" rx="3" fill="#0b1012" stroke="#ffffff" strokeOpacity="0.1" strokeWidth="1.5" />
        <text fontSize="8.75" fontWeight="700" letterSpacing="0.53" fill="#979899" textAnchor="middle">
          <tspan x="804.76" y="261.61">
            SAML
          </tspan>
        </text>
      </g>
      <g id={`${uid}-el-e6`}>
        <rect x="541" y="595" width="136" height="21" rx="3" fill="#0b1012" stroke="#ffffff" strokeOpacity="0.1" strokeWidth="1.5" />
        <text fontSize="8.75" fontWeight="700" letterSpacing="0.53" fill="#979899" textAnchor="middle">
          <tspan x="609.26" y="608.61">
            PRIVATE GOOGLE ACCESS
          </tspan>
        </text>
      </g>
      <g id={`${uid}-el-e8`}>
        <rect x="1032" y="647" width="76" height="21" rx="3" fill="#0b1012" stroke="#ffffff" strokeOpacity="0.1" strokeWidth="1.5" />
        <text fontSize="8.5" fontWeight="700" letterSpacing="0.51" fill="#979899" textAnchor="middle">
          <tspan x="1070.26" y="660.52">
            PRIVATE LINK
          </tspan>
        </text>
      </g>
      <g id={`${uid}-el-e11`}>
        <rect x="183" y="1328" width="71" height="21" rx="3" fill="#0b1012" stroke="#ffffff" strokeOpacity="0.1" strokeWidth="1.5" />
        <text fontSize="8.75" fontWeight="700" letterSpacing="0.53" fill="#979899" textAnchor="middle">
          <tspan x="218.76" y="1341.61">
            PRIVATE VIF
          </tspan>
        </text>
      </g>
      <g id={`${uid}-el-e12`}>
        <rect x="541" y="1328" width="108" height="21" rx="3" fill="#0b1012" stroke="#ffffff" strokeOpacity="0.1" strokeWidth="1.5" />
        <text fontSize="8.75" fontWeight="700" letterSpacing="0.53" fill="#979899" textAnchor="middle">
          <tspan x="595.26" y="1341.61">
            VLAN ATTACHMENT
          </tspan>
        </text>
      </g>
      <g id={`${uid}-el-e13`}>
        <rect x="1032" y="1328" width="95" height="21" rx="3" fill="#0b1012" stroke="#ffffff" strokeOpacity="0.1" strokeWidth="1.5" />
        <text fontSize="8.75" fontWeight="700" letterSpacing="0.53" fill="#979899" textAnchor="middle">
          <tspan x="1079.76" y="1341.61">
            PRIVATE PEERING
          </tspan>
        </text>
      </g>
      <g id={`${uid}-gh-aws`}>
        <rect x="28" y="333" width="40" height="40" fill="#ffffff" fillOpacity="0.16" />
        <use href={`#${uid}-s1`} x="33.38" y="338.38" width="29.24" height="29.24" filter={`url(#${uid}-f1)`} />
        <g opacity="0">
          <rect x="28" y="333" width="40" height="40" fill="#60a5fa" />
          <use href={`#${uid}-s1`} x="33.38" y="338.38" width="29.24" height="29.24" filter={`url(#${uid}-f2)`} />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.1013;0.1535;0.8879;0.94;1" dur="3.454s" repeatCount="indefinite" />
        </g>
        <text fontSize="11" fontWeight="700" letterSpacing="1.1" fill="#649adb">
          <tspan x="76" y="356.91">
            AWS CLOUD
          </tspan>
        </text>
      </g>
      <g id={`${uid}-gh-gcloud`}>
        <text fontSize="11" fontWeight="700" letterSpacing="1.1" fill="#649adb">
          <tspan x="378" y="355.35">
            GOOGLE CLOUD
          </tspan>
        </text>
      </g>
      <g id={`${uid}-gh-tenant`}>
        <text fontSize="11" fontWeight="700" letterSpacing="1.1" fill="#649adb">
          <tspan x="769" y="355.35">
            MICROSOFT ENTRA TENANT
          </tspan>
        </text>
      </g>
      <g id={`${uid}-gh-aws-region`}>
        <rect x="48" y="391" width="40" height="40" fill="#ffffff" fillOpacity="0.16" />
        <use href={`#${uid}-s2`} x="53.38" y="396.38" width="29.24" height="29.24" filter={`url(#${uid}-f3)`} />
        <g opacity="0">
          <rect x="48" y="391" width="40" height="40" fill="#60a5fa" />
          <use href={`#${uid}-s2`} x="53.38" y="396.38" width="29.24" height="29.24" filter={`url(#${uid}-f4)`} />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.1013;0.1535;0.8879;0.94;1" dur="3.454s" repeatCount="indefinite" />
        </g>
        <text fontSize="11" fontWeight="700" letterSpacing="1.1" fill="#9d9fa0">
          <tspan x="96" y="414.91">
            US-EAST-1
          </tspan>
        </text>
      </g>
      <g id={`${uid}-gh-gcp-project`}>
        <text fontSize="11" fontWeight="700" letterSpacing="1.1" fill="#9d9fa0">
          <tspan x="398" y="413.35">
            PROJECT ANALYTICS
          </tspan>
        </text>
      </g>
      <g id={`${uid}-gh-azure`}>
        <use href={`#${uid}-s3`} x="790.3" y="401.3" width="17.4" height="17.4" filter={`url(#${uid}-f5)`} />
        <g opacity="0">
          <use href={`#${uid}-s3`} x="790.3" y="401.3" width="17.4" height="17.4" filter={`url(#${uid}-f6)`} />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.1013;0.1535;0.8879;0.94;1" dur="3.454s" repeatCount="indefinite" />
        </g>
        <text fontSize="11" fontWeight="700" letterSpacing="1.1" fill="#9d9fa0">
          <tspan x="817" y="413.35">
            AZURE SUBSCRIPTION
          </tspan>
        </text>
      </g>
      <g id={`${uid}-gh-aws-vpc`}>
        <rect x="68" y="449" width="40" height="40" fill="#ffffff" fillOpacity="0.16" />
        <use href={`#${uid}-s4`} x="73.38" y="454.38" width="29.24" height="29.24" filter={`url(#${uid}-f3)`} />
        <g opacity="0">
          <rect x="68" y="449" width="40" height="40" fill="#60a5fa" />
          <use href={`#${uid}-s4`} x="73.38" y="454.38" width="29.24" height="29.24" filter={`url(#${uid}-f4)`} />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.1013;0.1535;0.8879;0.94;1" dur="3.454s" repeatCount="indefinite" />
        </g>
        <text fontSize="9.5" fontWeight="700" letterSpacing="0.95" fill="#9d9fa0">
          <tspan x="116" y="472.37">
            ORDERS VPC 10.10.0.0/16
          </tspan>
        </text>
      </g>
      <g id={`${uid}-gh-gcp-vpc`}>
        <use href={`#${uid}-s5`} x="419.3" y="695.3" width="17.4" height="17.4" filter={`url(#${uid}-f5)`} />
        <g opacity="0">
          <use href={`#${uid}-s5`} x="419.3" y="695.3" width="17.4" height="17.4" filter={`url(#${uid}-f6)`} />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.1013;0.1535;0.8879;0.94;1" dur="3.454s" repeatCount="indefinite" />
        </g>
        <text fontSize="11" fontWeight="700" letterSpacing="1.1" fill="#9d9fa0">
          <tspan x="446" y="707.36">
            VPC NETWORK
          </tspan>
        </text>
      </g>
      <g id={`${uid}-gh-azure-rg`}>
        <use href={`#${uid}-s6`} x="810.3" y="453.3" width="17.4" height="17.4" filter={`url(#${uid}-f5)`} />
        <g opacity="0">
          <use href={`#${uid}-s6`} x="810.3" y="453.3" width="17.4" height="17.4" filter={`url(#${uid}-f6)`} />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.1013;0.1535;0.8879;0.94;1" dur="3.454s" repeatCount="indefinite" />
        </g>
        <text fontSize="11" fontWeight="700" letterSpacing="1.1" fill="#9d9fa0">
          <tspan x="837" y="465.35">
            RG-PARTNER-PORTAL
          </tspan>
        </text>
      </g>
      <g id={`${uid}-gh-azure-vnet`}>
        <use href={`#${uid}-s7`} x="830.3" y="747.3" width="17.4" height="17.4" filter={`url(#${uid}-f5)`} />
        <g opacity="0">
          <use href={`#${uid}-s7`} x="830.3" y="747.3" width="17.4" height="17.4" filter={`url(#${uid}-f6)`} />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.1013;0.1535;0.8879;0.94;1" dur="3.454s" repeatCount="indefinite" />
        </g>
        <rect x="853" y="746" width="199.4" height="18.9" rx="3" fill="#0b1012" />
        <text fontSize="11" fontWeight="700" letterSpacing="1.1" fill="#9d9fa0">
          <tspan x="857" y="759.36">
            VNET-PARTNER 10.20.0.0/16
          </tspan>
        </text>
      </g>
      <g id={`${uid}-n-idp`}>
        <rect x="361.5" y="96" width="48" height="48" rx="8.16" fill="#0b1012" stroke="#ffffff" strokeOpacity="0.16" strokeWidth="1.5" />
        <g opacity="0">
          <rect x="361.5" y="96" width="48" height="48" rx="8.16" fill="#60a5fa" fillOpacity="0.15" stroke="#60a5fa" strokeOpacity="0.65" strokeWidth="1.5" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.2027;0.2548;0.8879;0.94;1" dur="3.454s" repeatCount="indefinite" />
        </g>
        <use href={`#${uid}-s8`} x="371.1" y="105.6" width="28.8" height="28.8" />
        <text fontSize="10.5" fontWeight="700" letterSpacing="0.84" fill="#9d9fa0" textAnchor="middle">
          <tspan x="385.93" y="162.18">
            OKTA
          </tspan>
        </text>
        <text fontSize="10" fontWeight="400" fill="#979a9b" textAnchor="middle">
          <tspan x="385.51" y="179.7">
            Workforce identity
          </tspan>
        </text>
      </g>
      <g id={`${uid}-n-orders`}>
        <rect x="153" y="507" width="48" height="48" rx="8.16" fill="#0b1012" stroke="#ffffff" strokeOpacity="0.16" strokeWidth="1.5" />
        <g opacity="0">
          <rect x="153" y="507" width="48" height="48" rx="8.16" fill="#60a5fa" fillOpacity="0.15" stroke="#60a5fa" strokeOpacity="0.65" strokeWidth="1.5" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.2027;0.2548;0.8879;0.94;1" dur="3.454s" repeatCount="indefinite" />
        </g>
        <use href={`#${uid}-s9`} x="156.36" y="510.36" width="41.28" height="41.28" filter={`url(#${uid}-f7)`} />
        <text fontSize="10.5" fontWeight="700" letterSpacing="0.84" fill="#9d9fa0" textAnchor="middle">
          <tspan x="177.42" y="573.18">
            AMAZON EKS
          </tspan>
        </text>
        <text fontSize="10" fontWeight="400" fill="#979a9b" textAnchor="middle">
          <tspan x="177" y="590.7">
            Amazon Elastic
          </tspan>
          <tspan x="177" y="605.7">
            Kubernetes Service
          </tspan>
        </text>
      </g>
      <g id={`${uid}-n-dxgw`}>
        <rect x="153.5" y="699" width="48" height="48" rx="8.16" fill="#0b1012" stroke="#ffffff" strokeOpacity="0.16" strokeWidth="1.5" />
        <g opacity="0">
          <rect x="153.5" y="699" width="48" height="48" rx="8.16" fill="#60a5fa" fillOpacity="0.15" stroke="#60a5fa" strokeOpacity="0.65" strokeWidth="1.5" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.2027;0.2548;0.8879;0.94;1" dur="3.454s" repeatCount="indefinite" />
        </g>
        <use href={`#${uid}-s10`} x="163.58" y="709.08" width="27.84" height="27.84" filter={`url(#${uid}-f5)`} />
        <text fontSize="10.5" fontWeight="700" letterSpacing="0.84" fill="#9d9fa0" textAnchor="middle">
          <tspan x="177.92" y="765.18">
            DIRECT CONNECT
          </tspan>
          <tspan x="177.92" y="782.08">
            GATEWAY
          </tspan>
        </text>
      </g>
      <g id={`${uid}-n-analytics`}>
        <rect x="512" y="443" width="48" height="48" rx="8.16" fill="#0b1012" stroke="#ffffff" strokeOpacity="0.16" strokeWidth="1.5" />
        <g opacity="0">
          <rect x="512" y="443" width="48" height="48" rx="8.16" fill="#60a5fa" fillOpacity="0.15" stroke="#60a5fa" strokeOpacity="0.65" strokeWidth="1.5" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.2027;0.2548;0.8879;0.94;1" dur="3.454s" repeatCount="indefinite" />
        </g>
        <use href={`#${uid}-s11`} x="522.08" y="453.08" width="27.84" height="27.84" filter={`url(#${uid}-f5)`} />
        <text fontSize="10.5" fontWeight="700" letterSpacing="0.84" fill="#9d9fa0" textAnchor="middle">
          <tspan x="536.42" y="509.18">
            BIGQUERY
          </tspan>
        </text>
        <text fontSize="10" fontWeight="400" fill="#979a9b" textAnchor="middle">
          <tspan x="536" y="526.7">
            Analytics
          </tspan>
        </text>
      </g>
      <g id={`${uid}-n-cloud-router`}>
        <rect x="511" y="737" width="48" height="48" rx="8.16" fill="#0b1012" stroke="#ffffff" strokeOpacity="0.16" strokeWidth="1.5" />
        <g opacity="0">
          <rect x="511" y="737" width="48" height="48" rx="8.16" fill="#60a5fa" fillOpacity="0.15" stroke="#60a5fa" strokeOpacity="0.65" strokeWidth="1.5" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.2027;0.2548;0.8879;0.94;1" dur="3.454s" repeatCount="indefinite" />
        </g>
        <use href={`#${uid}-s5`} x="521.08" y="747.08" width="27.84" height="27.84" filter={`url(#${uid}-f5)`} />
        <text fontSize="10.5" fontWeight="700" letterSpacing="0.84" fill="#9d9fa0" textAnchor="middle">
          <tspan x="535.42" y="803.18">
            CLOUD ROUTER
          </tspan>
        </text>
      </g>
      <g id={`${uid}-n-portal`}>
        <rect x="1002.5" y="495" width="48" height="48" rx="8.16" fill="#0b1012" stroke="#ffffff" strokeOpacity="0.16" strokeWidth="1.5" />
        <g opacity="0">
          <rect x="1002.5" y="495" width="48" height="48" rx="8.16" fill="#60a5fa" fillOpacity="0.15" stroke="#60a5fa" strokeOpacity="0.65" strokeWidth="1.5" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.2027;0.2548;0.8879;0.94;1" dur="3.454s" repeatCount="indefinite" />
        </g>
        <use href={`#${uid}-s12`} x="1011.62" y="504.12" width="29.76" height="29.76" filter={`url(#${uid}-f8)`} />
        <text fontSize="10.5" fontWeight="700" letterSpacing="0.84" fill="#9d9fa0" textAnchor="middle">
          <tspan x="1026.92" y="561.18">
            AZURE APP SERVICE
          </tspan>
        </text>
        <text fontSize="10" fontWeight="400" fill="#979a9b" textAnchor="middle">
          <tspan x="1026.5" y="578.7">
            Partner portal
          </tspan>
        </text>
      </g>
      <g id={`${uid}-n-pe`}>
        <rect x="1002" y="789" width="48" height="48" rx="8.16" fill="#0b1012" stroke="#ffffff" strokeOpacity="0.16" strokeWidth="1.5" />
        <g opacity="0">
          <rect x="1002" y="789" width="48" height="48" rx="8.16" fill="#60a5fa" fillOpacity="0.15" stroke="#60a5fa" strokeOpacity="0.65" strokeWidth="1.5" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.2027;0.2548;0.8879;0.94;1" dur="3.454s" repeatCount="indefinite" />
        </g>
        <use href={`#${uid}-s13`} x="1012.08" y="799.08" width="27.84" height="27.84" filter={`url(#${uid}-f5)`} />
        <text fontSize="10.5" fontWeight="700" letterSpacing="0.84" fill="#9d9fa0" textAnchor="middle">
          <tspan x="1026.42" y="855.18">
            PRIVATE ENDPOINT
          </tspan>
        </text>
        <text fontSize="10" fontWeight="400" fill="#979a9b" textAnchor="middle">
          <tspan x="1025.99" y="872.7">
            App Service
          </tspan>
        </text>
      </g>
      <g id={`${uid}-n-er-gw`}>
        <rect x="1002" y="941" width="48" height="48" rx="8.16" fill="#0b1012" stroke="#ffffff" strokeOpacity="0.16" strokeWidth="1.5" />
        <g opacity="0">
          <rect x="1002" y="941" width="48" height="48" rx="8.16" fill="#60a5fa" fillOpacity="0.15" stroke="#60a5fa" strokeOpacity="0.65" strokeWidth="1.5" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.2027;0.2548;0.8879;0.94;1" dur="3.454s" repeatCount="indefinite" />
        </g>
        <use href={`#${uid}-s14`} x="1011.12" y="950.12" width="29.76" height="29.76" filter={`url(#${uid}-f8)`} />
        <text fontSize="10.5" fontWeight="700" letterSpacing="0.84" fill="#9d9fa0" textAnchor="middle">
          <tspan x="1026.43" y="1007.18">
            EXPRESSROUTE
          </tspan>
          <tspan x="1026.43" y="1024.08">
            GATEWAY
          </tspan>
        </text>
      </g>
      <g id={`${uid}-n-dx`}>
        <rect x="153.5" y="1193" width="48" height="48" rx="8.16" fill="#0b1012" stroke="#ffffff" strokeOpacity="0.16" strokeWidth="1.5" />
        <g opacity="0">
          <rect x="153.5" y="1193" width="48" height="48" rx="8.16" fill="#60a5fa" fillOpacity="0.15" stroke="#60a5fa" strokeOpacity="0.65" strokeWidth="1.5" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.2027;0.2548;0.8879;0.94;1" dur="3.454s" repeatCount="indefinite" />
        </g>
        <use href={`#${uid}-s15`} x="156.86" y="1196.36" width="41.28" height="41.28" filter={`url(#${uid}-f7)`} />
        <text fontSize="10.5" fontWeight="700" letterSpacing="0.84" fill="#9d9fa0" textAnchor="middle">
          <tspan x="177.93" y="1259.18">
            AWS DIRECT CONNECT
          </tspan>
        </text>
      </g>
      <g id={`${uid}-n-interconnect`}>
        <rect x="511.5" y="1193" width="48" height="48" rx="8.16" fill="#0b1012" stroke="#ffffff" strokeOpacity="0.16" strokeWidth="1.5" />
        <g opacity="0">
          <rect x="511.5" y="1193" width="48" height="48" rx="8.16" fill="#60a5fa" fillOpacity="0.15" stroke="#60a5fa" strokeOpacity="0.65" strokeWidth="1.5" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.2027;0.2548;0.8879;0.94;1" dur="3.454s" repeatCount="indefinite" />
        </g>
        <use href={`#${uid}-s5`} x="521.58" y="1203.08" width="27.84" height="27.84" filter={`url(#${uid}-f5)`} />
        <text fontSize="10.25" fontWeight="700" letterSpacing="0.82" fill="#9d9fa0" textAnchor="middle">
          <tspan x="535.91" y="1259.09">
            PARTNER INTERCONNECT
          </tspan>
        </text>
      </g>
      <g id={`${uid}-n-er`}>
        <rect x="1002.5" y="1193" width="48" height="48" rx="8.16" fill="#0b1012" stroke="#ffffff" strokeOpacity="0.16" strokeWidth="1.5" />
        <g opacity="0">
          <rect x="1002.5" y="1193" width="48" height="48" rx="8.16" fill="#60a5fa" fillOpacity="0.15" stroke="#60a5fa" strokeOpacity="0.65" strokeWidth="1.5" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.2027;0.2548;0.8879;0.94;1" dur="3.454s" repeatCount="indefinite" />
        </g>
        <use href={`#${uid}-s16`} x="1012.58" y="1203.08" width="27.84" height="27.84" filter={`url(#${uid}-f5)`} />
        <text fontSize="10.5" fontWeight="700" letterSpacing="0.84" fill="#9d9fa0" textAnchor="middle">
          <tspan x="1026.92" y="1259.18">
            AZURE EXPRESSROUTE
          </tspan>
        </text>
      </g>
      <g id={`${uid}-n-router`}>
        <rect x="511.5" y="1413" width="48" height="48" rx="8.16" fill="#0b1012" stroke="#ffffff" strokeOpacity="0.16" strokeWidth="1.5" />
        <g opacity="0">
          <rect x="511.5" y="1413" width="48" height="48" rx="8.16" fill="#60a5fa" fillOpacity="0.15" stroke="#60a5fa" strokeOpacity="0.65" strokeWidth="1.5" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.2027;0.2548;0.8879;0.94;1" dur="3.454s" repeatCount="indefinite" />
        </g>
        <use href={`#${uid}-s17`} x="521.1" y="1422.6" width="28.8" height="28.8" />
        <text fontSize="10.5" fontWeight="700" letterSpacing="0.84" fill="#9d9fa0" textAnchor="middle">
          <tspan x="535.92" y="1479.18">
            COLOCATION ROUTER
          </tspan>
        </text>
        <text fontSize="10" fontWeight="400" fill="#979a9b" textAnchor="middle">
          <tspan x="535.5" y="1496.7">
            BGP to every cloud
          </tspan>
        </text>
      </g>
      <g id={`${uid}-story`}>
        <path d="M360 184 L360 196 Q360 204 352 204 L56 204 Q48 204 48 212 L48 332.25" fill="none" stroke="#60a5fa" strokeOpacity="0.6" strokeWidth="3.61" 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.3619;0.6394;0.663;1" calcMode="spline" keySplines="0 0 1 1;0.65 0 0.35 1;0 0 1 1;0 0 1 1" dur="3.454s" repeatCount="indefinite" />
          <animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.3619;0.3648;0.663;0.6659;1" dur="3.454s" repeatCount="indefinite" />
        </path>
        <circle r="3.76" fill="#60a5fa" opacity="0">
          <animateMotion path="M360 184 L360 196 Q360 204 352 204 L56 204 Q48 204 48 212 L48 332.25" dur="3.454s" repeatCount="indefinite" calcMode="spline" keyPoints="0;0;1;1" keyTimes="0;0.3619;0.6394;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.3185;0.3619;0.6394;0.6828;1" dur="3.454s" repeatCount="indefinite" />
        </circle>
        <circle r="3.01" fill="#60a5fa" opacity="0">
          <animateMotion path="M386 184 L386 332.25" dur="3.454s" repeatCount="indefinite" calcMode="spline" keyPoints="0;0;1;1" keyTimes="0;0.4868;0.6026;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.4434;0.4868;0.6026;0.6461;1" dur="3.454s" repeatCount="indefinite" />
        </circle>
        <circle r="3.01" fill="#60a5fa" opacity="0">
          <animateMotion path="M411 184 L411 196 Q411 204 419 204 L769 204 Q777 204 777 212 L777 332.25" dur="3.454s" repeatCount="indefinite" calcMode="spline" keyPoints="0;0;1;1" keyTimes="0;0.5525;0.8421;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.5091;0.5525;0.8421;0.8855;1" dur="3.454s" repeatCount="indefinite" />
        </circle>
      </g>
      <g id={`${uid}-legend`}>
        <rect x="1072" y="1513" width="223" height="53" rx="6" fill="#0b1012" stroke="#ffffff" strokeOpacity="0.1" strokeWidth="1.5" />
        <path d="M1082 1530.5 H1110" fill="none" stroke="#ffffff" strokeOpacity="0.4" strokeWidth="1.5" strokeLinecap="round" />
        <text fontSize="8" fontWeight="700" letterSpacing="0.48" fill="#9d9fa0">
          <tspan x="1118" y="1533.34">
            NETWORK LINK, TRAFFIC BOTH WAYS
          </tspan>
        </text>
        <path d="M1082 1548.5 H1110" fill="none" stroke="#ffffff" strokeOpacity="0.4" strokeWidth="1.5" strokeLinecap="round" strokeDasharray="6.01 4.51" />
        <text fontSize="9.5" fontWeight="700" letterSpacing="0.57" fill="#9d9fa0">
          <tspan x="1118" y="1551.87">
            FEDERATED SIGN-IN
          </tspan>
        </text>
      </g>
    </svg>
  );
}
