Re-implementing the happo.io logo in HTML (with email-client safe properties)

happo-logo.html

<div
  style="
    width: 42px;
    height: 42px;
    box-sizing: border-box;
    border-radius: 50%;
    overflow: hidden;
    background-color: white;
    padding: 6px 0 5px 0;
  "
>
  <div
    style="
      position: relative;
      width: 35px;
      height: 25px;
      overflow: hidden;
      display: flex;
      margin-left: 5px;
      margin-bottom: 3px;
    "
  >
    <div style="height: 0; width: 0">
      <div style="padding-top: 7.5px">
        <div
          style="
            background-color: #15aa8e;
            height: 20px;
            width: 20px;
            border-radius: 50%;
          "
        >
          <div style="padding-top: 15px; padding-left: 7.5px">
            <div
              style="
                background-color: white;
                height: 5px;
                width: 5px;
                border-radius: 50%;
              "
            ></div>
          </div>
        </div>
      </div>
    </div>
    <div style="height: 0; width: 0">
      <div style="padding-top: 4px">
        <div style="margin-left: 12px; margin-top: 0px">
          <div
            style="
              background-color: #15aa8e;
              height: 3.5px;
              width: 3.5px;
              border-radius: 50%;
            "
          ></div>
        </div>
      </div>
    </div>
    <div style="height: 0; width: 0">
      <div style="margin-top: 1.5px; margin-left: 12.5px">
        <div
          style="
            background-color: #15aa8e;
            height: 15px;
            width: 18px;
            border-radius: 70% 40% 60%;
          "
        ></div>
      </div>
    </div>
    <div style="height: 0; width: 0">
      <div style="margin-top: 7.5px; margin-left: 17px">
        <div
          style="
            background-color: white;
            height: 2.5px;
            width: 2.5px;
            border-radius: 50%;
          "
        ></div>
      </div>
    </div>
    <div style="height: 0; width: 0">
      <div style="margin-top: 0px; margin-left: 21px">
        <div
          style="
            height: 0px;
            width: 0px;
            border-left: 15px solid white;
            border-top: 2.5px solid transparent;
            border-right: 15px solid transparent;
            border-bottom: 2.5px solid transparent;
          "
        ></div>
      </div>
    </div>
    <div style="height: 0; width: 0">
      <div style="margin-top: 13.5px; margin-left: 22.5px">
        <div
          style="
            height: 0px;
            width: 0px;
            border-top: 5px solid white;
            border-left: 5px solid transparent;
            border-right: 5px solid transparent;
          "
        ></div>
      </div>
    </div>
  </div>
</div>