正在尝试创建活动的按下按钮效果。我如何让我的两个插框阴影混合成一个？

<style>
    .box1 {
        position: absolute;
        top: 50px;
        left: 50px;
        width: 200px;
        height: 200px;
        background-color: #fff;
        box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
        z-index: 1;
    }

    .box2 {
        position: absolute;
        top: 50px;
        left: 50px;
        width: 200px;
        height: 200px;
        background-color: #fff;
        box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
        z-index: 2;
    }
</style>

<div class="box1"></div>
<div class="box2"></div>