/* Feet stay on the measured pavement. Upper/lower legs overlap one source pixel
   at the knee, preserving the original painted sprite during small joint turns. */
.person.pedestrian,.person.pedestrian.paused{animation:none;rotate:none;translate:none;transform-origin:50% 100%;transition:filter .15s;will-change:left,bottom}
.person.pedestrian .resident-sprite,.indoor-visitor .resident-sprite{overflow:visible;transform-origin:50% 50%;scale:1 1;transition:scale .16s}
.person.pedestrian.facing-left .resident-sprite,.indoor-visitor.facing-left .resident-sprite{scale:-1 1}
.resident-sprite .limb,.resident-sprite .actor-hips,.resident-sprite .actor-body{transform-box:view-box}
.resident-sprite .leg-left{transform-origin:34px 100px}.resident-sprite .leg-right{transform-origin:51px 100px}
.resident-sprite .shin-left{transform-origin:34px 111px}.resident-sprite .shin-right{transform-origin:51px 111px}
.resident-sprite .foot-left{transform-origin:34px 118px}.resident-sprite .foot-right{transform-origin:51px 118px}
.resident-sprite .arm-left{transform-origin:28px 81px}.resident-sprite .arm-right{transform-origin:58px 81px}
.resident-sprite .actor-hips{transform-origin:43px 99px}
.walking .resident-sprite .leg-left,.walking .resident-sprite .leg-right{animation:pavement-stride var(--gait-time,.82s) ease-in-out infinite;animation-delay:var(--gait-delay,0s)}
.walking .resident-sprite .leg-right{animation-name:pavement-stride-opposite}
.walking .resident-sprite .shin-left,.walking .resident-sprite .shin-right{animation:pavement-knee var(--gait-time,.82s) ease-in-out infinite;animation-delay:var(--gait-delay,0s)}
.walking .resident-sprite .shin-right{animation-name:pavement-knee-opposite}
.walking .resident-sprite .foot-left,.walking .resident-sprite .foot-right{animation:pavement-foot var(--gait-time,.82s) ease-in-out infinite;animation-delay:var(--gait-delay,0s)}
.walking .resident-sprite .foot-right{animation-name:pavement-foot-opposite}
.walking .resident-sprite .arm-left,.walking .resident-sprite .arm-right{animation:pavement-arm var(--gait-time,.82s) ease-in-out infinite;animation-delay:var(--gait-delay,0s)}
.walking .resident-sprite .arm-right{animation-name:pavement-arm-opposite}
.walking .resident-sprite .actor-body{animation:pavement-bob calc(var(--gait-time,.82s)/2) ease-in-out infinite;animation-delay:var(--gait-delay,0s)}
.walking .resident-sprite .actor-hips{animation:pavement-hips var(--gait-time,.82s) ease-in-out infinite;animation-delay:var(--gait-delay,0s)}
.walking .resident-sprite .actor-shadow{animation:pavement-shadow calc(var(--gait-time,.82s)/2) ease-in-out infinite;animation-delay:var(--gait-delay,0s);transform-origin:43px 123px;transform-box:view-box}
.paused .resident-sprite .limb,.paused .resident-sprite .actor-body,.paused .resident-sprite .actor-hips,.paused .resident-sprite .actor-shadow{animation:none;transform:none}
.pedestrian .shopping-bubble{font-size:17px;line-height:1;top:-14px;left:23px;padding:4px}
.friend-bubble{display:none;position:absolute;bottom:100%;left:50%;translate:-50% 0;white-space:nowrap;background:#fff8df;border:1px solid #a6bdaf;color:#406575;border-radius:7px;padding:4px 6px;font-size:10px;box-shadow:0 2px 3px #173d4b35;pointer-events:none}
.chatting .friend-bubble{display:block}
.building-visitors{position:absolute;inset:0;pointer-events:none;z-index:4;overflow:visible}
.indoor-visitor{position:absolute;bottom:calc(var(--unit,var(--building-width)/260)*40);height:calc(var(--unit,var(--building-width)/260)*67);width:calc(var(--unit,var(--building-width)/260)*45);transform:translateX(-50%);pointer-events:none;--gait-time:.9s;--gait-delay:0s;filter:drop-shadow(1px 2px 1px #292f2840);animation:visitor-arrives .25s ease-out}
.indoor-visitor>svg{display:block;width:100%;height:100%}
.indoor-visitor[data-visit-kind='shopping']:after{content:'♥';position:absolute;left:85%;top:9%;font-size:12px;color:#ffde84;text-shadow:0 1px #88683d;animation:purchase-heart 1.8s ease-in-out infinite}
@keyframes pavement-stride{0%,100%{transform:translateX(-2px) rotate(-4deg)}24%{transform:translate(0,-.7px) rotate(1deg)}50%{transform:translateX(2px) rotate(5deg)}75%{transform:translate(0,-1.6px) rotate(-2deg)}}
@keyframes pavement-stride-opposite{0%,100%{transform:translateX(2px) rotate(5deg)}24%{transform:translate(0,-1.6px) rotate(-2deg)}50%{transform:translateX(-2px) rotate(-4deg)}75%{transform:translate(0,-.7px) rotate(1deg)}}
@keyframes pavement-knee{0%,45%,100%{transform:rotate(0)}64%{transform:rotate(7deg)}77%{transform:rotate(12deg)}90%{transform:rotate(4deg)}}
@keyframes pavement-knee-opposite{0%,100%{transform:rotate(0)}14%{transform:rotate(7deg)}27%{transform:rotate(12deg)}40%{transform:rotate(4deg)}50%,95%{transform:rotate(0)}}
@keyframes pavement-foot{0%,100%{transform:rotate(-4deg)}14%{transform:rotate(0)}45%{transform:rotate(5deg)}67%{transform:rotate(-7deg)}86%{transform:rotate(2deg)}}
@keyframes pavement-foot-opposite{0%,100%{transform:rotate(5deg)}17%{transform:rotate(-7deg)}36%{transform:rotate(2deg)}50%{transform:rotate(-4deg)}64%{transform:rotate(0)}95%{transform:rotate(5deg)}}
@keyframes pavement-arm{0%,100%{transform:rotate(4deg)}50%{transform:rotate(-4deg)}}
@keyframes pavement-arm-opposite{0%,100%{transform:rotate(-4deg)}50%{transform:rotate(4deg)}}
@keyframes pavement-bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-.65px)}}
@keyframes pavement-hips{0%,50%,100%{transform:translateX(0)}25%{transform:translateX(.65px)}75%{transform:translateX(-.65px)}}
@keyframes pavement-shadow{50%{transform:scaleX(.94);opacity:.84}}
@keyframes visitor-arrives{from{opacity:0}to{opacity:1}}
@keyframes purchase-heart{50%{translate:0 -3px;opacity:.7}}
@media(max-width:799px){.friend-bubble{font-size:8px;padding:3px 4px}.pedestrian .shopping-bubble{font-size:13px;left:17px;top:-11px;padding:3px}}
@media(max-height:450px) and (orientation:landscape){.friend-bubble{font-size:7px}.pedestrian .shopping-bubble{font-size:10px;left:12px;top:-7px;padding:2px}}
@media(prefers-reduced-motion:reduce){.resident-sprite .limb,.resident-sprite .actor-body,.resident-sprite .actor-hips,.resident-sprite .actor-shadow,.indoor-visitor,.indoor-visitor:after{animation:none!important}.person.pedestrian .resident-sprite,.indoor-visitor .resident-sprite{transition:none}}