.notch{background:var(--notch-color);border-radius:0 0 var(--notch-r) var(--notch-r);position:relative}.notch:before,.notch:after{content:"";width:var(--notch-r);height:var(--notch-r);background:var(--notch-color);position:absolute;top:0;-webkit-mask-size:100% 100%;mask-size:100% 100%;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}.notch:before{right:calc(100% - .5px);-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpath d='M0 0H100V100A100 100 0 0 0 0 0Z'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpath d='M0 0H100V100A100 100 0 0 0 0 0Z'/%3E%3C/svg%3E")}.notch:after{left:calc(100% - .5px);-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpath d='M100 0H0V100A100 100 0 0 1 100 0Z'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpath d='M100 0H0V100A100 100 0 0 1 100 0Z'/%3E%3C/svg%3E")}.notch-bottom{border-radius:var(--notch-r) var(--notch-r) 0 0}.notch-bottom:before,.notch-bottom:after{top:auto;bottom:0;transform:scaleY(-1)}