body{--building-width:112px;--calculated-width:calc(2 * var(--building-width));max-height:100vh;overflow:hidden}#train-container{position:absolute;left:0}#tracks{width:100vw;height:128px;background:url(/images/buildings/track.png) repeat-x;background-size:128px}#buildings{width:100%;display:grid;grid-template-columns:repeat(auto-fill,var(--calculated-width));gap:0;scroll-snap-type:y mandatory;justify-content:center;align-content:center;align-items:end;padding-bottom:280px;translate:0 -80px;max-height:720px;overflow-y:auto}#buildings::-webkit-scrollbar,#buildings::-webkit-scrollbar-thumb,#buildings::-webkit-scrollbar-track{display:none}.building{position:relative;display:flex;align-items:end;height:220px;opacity:0;animation-name:building-in;animation-timeline:view();animation-fill-mode:forwards;transform-origin:bottom;scroll-snap-align:center;scroll-snap-stop:always}.building div,.building img{width:var(--calculated-width);height:auto;image-rendering:pixelated}.building:first-child{margin-top:1200px}@keyframes building-in{0%,30%{opacity:0;scale:1}40%,65%{opacity:1;scale:1}90%,to{opacity:0;scale:0}}.building-asset{position:absolute}#selected-building-modal{--content-width:400px;position:absolute;inset:0;z-index:10;display:grid;grid-template-columns:repeat(auto-fit,minmax(var(--content-width),1fr));grid-template-rows:repeat(auto-fit,minmax(50%,1fr));margin:-4px;background:rgba(0,0,0,.8);backdrop-filter:blur(6px)}#selected-building-modal #building-content-container,#selected-building-modal #selected-building{display:flex;flex-direction:column;align-items:center;justify-content:center}#building-content-container,#selected-building,#selected-building-modal{scale:1 -1}#selected-building{gap:24px}#selected-building img{width:clamp(var(--building-width),20vw,var(--calculated-width));height:auto}#building-content-container{background-color:var(--color-bubble);border:4px solid var(--color-bg);outline:4px solid var(--color-bubble);padding-inline:24px}#building-content-container #building-content-box{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;margin-top:24px;width:100%;min-width:240px;height:100%}#building-content-container #building-content{width:100%;height:100%;margin-bottom:24px;overflow-y:auto}#building-content-container .description{max-width:480px}@media(max-width:780px){#buildings{translate:0 -120px}}