Hand puppet blockquote

<blockquote class="handpuppet">
  <p>
    We know things are bad - worse than bad. They're crazy. It's like everything
    everywhere is going crazy, so we don't go out anymore. We sit in the house,
    and slowly the world we are living in is getting smaller, and all we say is:
    'Please, at least leave us alone in our living rooms. Let me have my toaster
    and my TV and my steel-belted radials and I won't say anything. Just leave
    us alone.'
  </p>
  <p>
    Well, I'm not gonna leave you alone. I want you to get MAD! I don't want you
    to protest. I don't want you to riot - I don't want you to write to your
    congressman, because I wouldn't know what to tell you to write. I don't know
    what to do about the depression and the inflation and the Russians and the
    crime in the street. All I know is that first you've got to get mad.
    (shouting) You've got to say: 'I'm a human being, god-dammit! My life has
    value!'
  </p>
</blockquote>

@font-face {
  font-family: "Indie Flower";
  src: url("fonts/IndieFlower-Regular.ttf");
  font-display: swap;
}

body {
  height: 100dvh;
  margin: 0;

  display: grid;
  place-items: center;

  background-color: #d9e7f9;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='36' height='72' viewBox='0 0 36 72'%3E%3Cg fill-rule='evenodd'%3E%3Cg fill='%23203ad5' fill-opacity='0.03'%3E%3Cpath d='M2 6h12L8 18 2 6zm18 36h12l-6 12-6-12z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
}

.handpuppet {
  max-width: 600px;

  font-family: "Indie Flower", serif;
  line-height: 1.5;
  font-size: 1.35rem;
}

/* image source: https://thenounproject.com/search/?q=hand+puppet&i=3749419 */
.handpuppet::before {
  content: "";
  float: left;
  width: 10rem;
  height: 10rem;
  display: block;
  background-image: url(img/handpuppet.svg);
  background-position: 100% 0;
  background-size: 10rem 10rem;
  background-repeat: no-repeat;

  /* chrome doesn't create a shape with url() for this image, so 
	use polygon instead */
  shape-outside: url(img/handpuppet.svg);

  -webkit-shape-outside: polygon(
    87.78% 10px,
    87.23% 28.33%,
    88.71% 60.59%,
    52.26% 64.44%,
    53.89% 98.89%,
    0px 100%,
    0px 0px
  );

  shape-margin: 0.6rem;
}