#volumes{position:relative;isolation:isolate}
#volumes>.container{position:relative;z-index:1}
.future-wrap{position:relative;isolation:isolate}
.future-wrap>.chess-rain{position:fixed}
.future-wrap>.chess-rain~*{position:relative;z-index:1}
.chess-rain{position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none;user-select:none;contain:strict}
.chess-rain>span{position:absolute;top:-140px;left:var(--left);font:calc(var(--size)*2)/1 "Segoe UI Symbol","DejaVu Sans",serif;color:#d7ad66;opacity:0;animation:chess-piece-rain var(--duration) linear infinite;animation-delay:var(--delay);will-change:transform,opacity}
.chess-rain>span:nth-child(3n+1){color:#9b3347}
.chess-rain>span:nth-child(4n){color:#e9d7ae}
.chess-rain-paused .chess-rain>span{animation-play-state:paused}
@keyframes chess-piece-rain{0%{opacity:0;transform:translate3d(0,0,0) rotate(-10deg)}12%,80%{opacity:.24}100%{opacity:0;transform:translate3d(var(--drift),calc(100vh + 210px),0) rotate(var(--spin))}}
@media(max-width:700px){.chess-rain>span:nth-child(2n){display:none}.chess-rain>span{font-size:calc(var(--size)*1.6)}}
@media(prefers-reduced-motion:reduce){.chess-rain{display:none}}