/* Layout follows the actual iframe/viewport, including browser bars and safe areas. */
#viewportBounds{position:fixed;left:max(8px,env(safe-area-inset-left,0px));right:max(8px,env(safe-area-inset-right,0px));top:max(8px,env(safe-area-inset-top,0px));height:calc(100dvh - max(8px,env(safe-area-inset-top,0px)) - max(8px,env(safe-area-inset-bottom,0px)));pointer-events:none;visibility:hidden}
.app{position:fixed;left:var(--stage-center-x,50%);top:var(--stage-center-y,50%);width:var(--stage-width,720px);height:var(--stage-height,720px);transform:translate(-50%,-50%) scale(var(--stage-scale,1))}
.modal{padding:max(12px,env(safe-area-inset-top)) max(12px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left))}
.modal>.card{max-height:calc(100dvh - 28px - env(safe-area-inset-top) - env(safe-area-inset-bottom));overflow-y:auto;overscroll-behavior:contain}
.campaign-map-card,.collection-card{max-height:calc(100dvh - 28px - env(safe-area-inset-top) - env(safe-area-inset-bottom))}
.toast{bottom:max(18px,env(safe-area-inset-bottom))}
.idle-modal{z-index:2500}
.audio-settings{display:flex;gap:8px}.audio-settings>button{flex:1;min-width:0}
.master-volume{padding:8px 12px;border:2px solid #c5ab92;border-radius:12px;background:#fffaf0}.master-volume label{display:flex;justify-content:space-between;font-size:14px;font-weight:bold}.master-volume input{display:block;width:100%;height:32px;margin:3px 0 0;accent-color:#5a9f32;cursor:pointer}.master-volume input:focus-visible{outline:3px solid #75ab44;outline-offset:2px;border-radius:6px}
.audio-credits{font-size:10px;line-height:1.4;opacity:.8;margin:12px 0 0}.audio-credits a{color:inherit}

/* One square composition at every aspect ratio; only the whole-stage scale changes. */
html[data-layout="unified"] .nests>.nest-locked{visibility:hidden}
html[data-layout="unified"] .nest-locked:after{content:none}
html[data-layout="unified"] .nests{grid-template-rows:minmax(0,1fr)}
html[data-layout="unified"] .topbar{height:84px}
html[data-layout="unified"] .collection-button{left:36px;top:28px}
html[data-layout="unified"] .settings{right:36px;top:28px}
html[data-layout="unified"] .game-shell{padding-top:14px}
html[data-layout="unified"] .campaign-level{height:32px}
html[data-layout="unified"] .nests{width:348px;height:70px;margin-bottom:8px;grid-template-columns:repeat(var(--board-rows,4),1fr);gap:8px}
html[data-layout="unified"] .arena,html[data-layout="unified"] .board{width:348px}
html[data-layout="unified"] .board{height:348px}
html[data-layout="unified"] .buy-row{height:94px}
html[data-layout="unified"] .evolution{height:64px;width:490px;margin-top:18px}
html[data-layout="unified"] .incubator-dock{left:-142px;top:84px;width:100px}

html[data-layout="unified"] .basket-dock{left:calc(100% + 28px);width:142px;top:0}
html[data-layout="unified"] .app .egg-store{right:68px;top:90px}
html[data-layout="unified"] .sale-undo-list{left:62px;top:500px;width:142px;max-height:160px}