.speechBubble{--background-color:#fff;--border-color:#d8d8d8;align-items:flex-start;column-gap:15px;display:flex;margin-bottom:30px}.speechBubble.blue{--border-color:#27a1ca}.speechBubble.red{--border-color:#f80000}.speechBubble.orange{--border-color:#ea6c10}.speechBubble.green{--border-color:#029658}.speechBubble.background{--background-color:#f6f6f6}.speechBubble.blue.background{--background-color:#ebf8fc}.speechBubble.red.background{--background-color:#ffebeb}.speechBubble.orange.background{--background-color:#fef2e9}.speechBubble.green.background{--background-color:#e8f9f0}.speechBubble .person{flex-shrink:0;margin:0;width:90px}.speechBubble.left .person{order:1}.speechBubble.right .person{order:3}.speechBubble .person .img-wrap{border:2px solid var(--border-color);border-radius:50%;margin-left:auto;margin-right:auto;overflow:hidden;width:70px}.speechBubble .person .img-wrap img{aspect-ratio:1/1;display:block;height:auto;object-fit:cover;object-position:center;width:100%}.speechBubble .person figcaption{font-size:14px;margin:4px auto 0;width:fit-content}.speechBubble .content{background-color:var(--background-color);border:2px solid var(--border-color);border-radius:8px;flex-grow:1;min-height:100px;order:2;position:relative}.speechBubble .content:after,.speechBubble .content:before{content:"";display:block;height:20px;position:absolute;top:20px;width:12px}.speechBubble.left .content:after,.speechBubble.left .content:before{clip-path:polygon(0 50%,100% 0,100% 100%)}.speechBubble.right .content:after,.speechBubble.right .content:before{clip-path:polygon(0 0,100% 50%,0 100%)}.speechBubble .content:before{background-color:var(--border-color)}.speechBubble.left .content:before{right:100%}.speechBubble.right .content:before{left:100%}.speechBubble .content:after{background-color:var(--background-color)}.speechBubble.left .content:after{right:calc(100% - 3px)}.speechBubble.right .content:after{left:calc(100% - 3px)}.speechBubble .content .inner{padding:10px 18px 12px}.speechBubble .content .inner>:last-child{margin-bottom:0}@media (max-width:819px){.speechBubble .person{width:80px}.speechBubble .person .img-wrap{width:60px}}