.city-art{--build-reveal:0%;isolation:isolate}.city-art>div{position:absolute;inset:0;pointer-events:none}.city-build-tint{z-index:1;background:rgba(35,45,58,.2);backdrop-filter:grayscale(.82) brightness(.68) sepia(.18)}.city-complete-layer{z-index:2;background-position:center 40%;background-size:cover;background-repeat:no-repeat;clip-path:inset(calc(100% - var(--build-reveal)) 0 0);transition:clip-path 1.1s cubic-bezier(.2,.8,.2,1)}.city-construction-grid{display:none}.city-build-frontier{z-index:4;inset:auto 0 calc(var(--build-reveal) - 2px)!important;height:3px;background:linear-gradient(90deg,transparent,#ffc56e 18%,#fff2bd 50%,#ffc56e 82%,transparent);box-shadow:0 0 12px #ffc66d;transition:bottom 1.1s cubic-bezier(.2,.8,.2,1);opacity:.8}.city-build-stage{display:flex;align-items:center;gap:7px;width:max-content;margin-top:7px;padding:4px 7px;border-radius:7px;background:#0a1735a8;border:1px solid #ffffff2b;backdrop-filter:blur(5px);font-size:7px;font-weight:900;letter-spacing:.8px}.city-build-stage b{color:#ffc16d}.city-art[data-build-complete="true"] .city-construction-grid,.city-art[data-build-complete="true"] .city-build-frontier,.city-art[data-build-complete="true"] .city-build-tint{opacity:0}
@media(max-height:700px) and (orientation:portrait){.city-build-stage{margin-top:4px}}
@media(prefers-reduced-motion:reduce){.city-complete-layer,.city-construction-grid,.city-build-frontier{transition:none!important}}