/* Four-sided architectural diorama. Each supported cell has a ledge on the
   side that becomes the floor after its wall rotates downward. */
.stage{background:radial-gradient(circle at 50% 45%,#385767,#112637 54%,#07111d 100%);box-shadow:inset 0 0 0 1px #bad5e222,inset 0 0 80px #030b17,0 35px 90px #050d18a0}
.stage:after{content:'';position:absolute;inset:0;z-index:6;pointer-events:none;border-radius:inherit;box-shadow:inset 0 0 34px 12px #050d19,inset 0 0 0 2px #b6c8cf24}
.world{background:#1b3040;box-shadow:0 10px 50px #0009,inset 0 0 45px #07141f}
.scene{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.95;pointer-events:none}
.world-pattern{opacity:.18;pointer-events:none}
.world-pattern:after,.cell.shaded:before{display:none}
.cell.block{z-index:2;background:linear-gradient(145deg,#aab7ad 0,#6b8490 14%,#344f5b 15%,#263e4c 75%,#152b39 100%);border:2px solid #c6d7cb88;box-shadow:inset -7px -8px 0 #0b1b2d8a,0 5px 14px #0009}
.ledge{position:absolute;z-index:1;display:block;background:linear-gradient(155deg,#bfc9b7 0,#879d9d 15%,#4b6976 22%,#253f50 60%,#162b3c 100%);border:1px solid #cfe0d2ad;box-shadow:0 6px 9px #071424ab,inset 0 4px 0 #d9e2c9b8}
.ledge-south,.ledge-north{left:-7%;right:-7%;height:27%}
.ledge-south{bottom:0;border-top:5px solid #e7ead6;transform:skewX(-18deg)}
.ledge-north{top:0;border-bottom:5px solid #e7ead6;transform:skewX(18deg)}
.ledge-east,.ledge-west{top:-7%;bottom:-7%;width:27%}
.ledge-east{right:0;border-left:5px solid #e7ead6;transform:skewY(-18deg)}
.ledge-west{left:0;border-right:5px solid #e7ead6;transform:skewY(18deg)}
.runner{filter:drop-shadow(0 4px 3px #06121cbf) drop-shadow(0 0 7px #ffe0b066)}
.socket:not(.filled){background:#c8e4e315;backdrop-filter:blur(2px)}
.stage[data-down=north]{--vista:#7fc8e8}.stage[data-down=east]{--vista:#f2ae82}.stage[data-down=south]{--vista:#a8d99d}.stage[data-down=west]{--vista:#c1a9e9}
.stage[data-down] .world{outline:2px solid color-mix(in srgb,var(--vista) 35%,transparent)}
.wall span{display:none}
@media(max-width:620px){.ledge-south{border-top-width:3px}.ledge-north{border-bottom-width:3px}.ledge-east{border-left-width:3px}.ledge-west{border-right-width:3px}.cell.block{border-width:1px}}
