CSS吹き出しで「長方形と三角の内側を透過し、角丸の枠線は透過しない」

前提・実現したいこと

https://teratail.com/questions/178011の記事を参考にし、
「長方形と三角の内側を透過し、枠線は透過しない」ことは実現可能だと知りました。
こちらをさらに発展させて、枠線部分を角丸にしたいと考えております。

該当のソースコード

html
1<div class="wrapper">
2    <div class="say">
3       <p>三角の部分も透過させたいです。<br>そんな吹き出し、できませんか？</p>
4    </div>
5</div>

css
1.wrapper {
2  padding: 100px 20px;
3  background-image: url(http://urx.space/9W4K);
4}
5.say {
6  position: relative;
7  display: inline-block;
8  margin: 1.5em 0 1.5em 15px;
9  padding: 7px 10px;
10  min-width: 120px;
11  max-width: 100%;
12  color: #555;
13  font-size: 16px;
14  background: transparent;
15  border: solid 3px #fff;
16  box-sizing: border-box;
17  border-left-color: transparent;
18}
19.say:before {
20  content: "";
21  position: absolute;
22  top: -3px;
23  left: -3px;
24  bottom: -3px;
25  width: 3px;
26  background: linear-gradient(to bottom, #fff calc(50% - 11px), transparent calc(50% - 11px), transparent calc(50% + 11px), #fff calc(50% + 11px));
27}
28.say:after {
29  content: "";
30  position: absolute;
31  top: 50%;
32  left: -8px;
33  height: 16px;
34  width: 16px;
35  border-bottom: 3px solid #fff;
36  border-left: 3px solid #fff;
37  transform: rotate(45deg);
38  transform-origin: top right;
39}
40.say p {
41  color: #fff;
42  margin: 0;
43  padding: 0;
44}