/* Photographic felt, small enough to belong to the miniature rather than lead it. */
.town-visitors{position:absolute;inset:0;width:100%;height:100%;overflow:hidden;z-index:3;pointer-events:none;transition:filter 1.1s ease;--robin-period:24s;--bee-period:19s;--bee-delay:-3.8s}
.town-visitors *{pointer-events:none}
.visitor-pose{overflow:hidden}
.visitor-robin-route{animation:visitor-robin-route var(--robin-period) ease-in-out infinite;transform-origin:0 0}
.visitor-robin-rest{opacity:1;animation:visitor-robin-rest var(--robin-period) linear infinite}
.visitor-robin-glance{opacity:0;animation:visitor-robin-glance var(--robin-period) linear infinite}
.visitor-robin-flight{opacity:0;animation:visitor-robin-flight var(--robin-period) linear infinite}
.visitor-robin-shadow{opacity:.22;animation:visitor-robin-shadow var(--robin-period) ease-in-out infinite}
.visitor-bee-flower-offset{transition:transform 1s ease}
[data-garden-stage="2"] .visitor-bee-flower-offset{transform:translate(-20px,-26px)}
.visitor-bee-route{animation:visitor-bee-route var(--bee-period) var(--bee-delay) ease-in-out infinite;transform-origin:0 0}
.visitor-bee-flying{opacity:1;animation:visitor-bee-flying var(--bee-period) var(--bee-delay) linear infinite}
.visitor-bee-landed{opacity:0;animation:visitor-bee-landed var(--bee-period) var(--bee-delay) linear infinite}
.visitor-bee-shadow{opacity:.16;animation:visitor-bee-shadow var(--bee-period) var(--bee-delay) linear infinite}
.visitor-bee-wing-up{opacity:1;animation:visitor-bee-wing-up .24s linear infinite}
.visitor-bee-wing-mid{opacity:0;animation:visitor-bee-wing-mid .24s linear infinite}
.visitor-bee-wing-down{opacity:0;animation:visitor-bee-wing-down .24s linear infinite}
.object-light .town-visitors{filter:brightness(.48) saturate(.72)}

/* Most of the cycle is a still perch. The position reset happens only offscreen. */
@keyframes visitor-robin-route{
 0%,56%{transform:translate(0,0) rotate(0deg);opacity:1}
 59%{transform:translate(0,-.7px) rotate(-2deg);opacity:1}
 64%{transform:translate(7px,-9px) rotate(-12deg);opacity:1}
 72%{transform:translate(50px,-43px) rotate(-14deg);opacity:0}
 80%{transform:translate(-38px,-27px) rotate(9deg);opacity:0}
 82%{transform:translate(-34px,-25px) rotate(9deg);opacity:1}
 88%{transform:translate(-10px,-7px) rotate(3deg);opacity:1}
 91%,100%{transform:translate(0,0) rotate(0deg);opacity:1}
}
@keyframes visitor-robin-rest{0%,10%{opacity:1}12%,20%{opacity:0}22%,38%{opacity:1}40%,46%{opacity:0}48%,58%{opacity:1}60%,89%{opacity:0}91%,100%{opacity:1}}
@keyframes visitor-robin-glance{0%,10%{opacity:0}12%,20%{opacity:1}22%,38%{opacity:0}40%,46%{opacity:1}48%,100%{opacity:0}}
@keyframes visitor-robin-flight{0%,58%{opacity:0}60%,89%{opacity:1}91%,100%{opacity:0}}
@keyframes visitor-robin-shadow{0%,57%{opacity:.22}60%{opacity:.1}64%,88%{opacity:0}91%,100%{opacity:.22}}

/* The bee approaches the leaf, rests, then leaves. Its wings settle during landing. */
@keyframes visitor-bee-route{
 0%{transform:translate(27px,-18px) rotate(-7deg);opacity:.9}
 12%{transform:translate(14px,-9px) rotate(-3deg);opacity:1}
 25%,46%{transform:translate(0,0) rotate(0deg);opacity:1}
 52%{transform:translate(-8px,-6px) rotate(7deg);opacity:1}
 66%{transform:translate(-34px,-24px) rotate(8deg);opacity:0}
 80%,84%{transform:translate(39px,-24px) rotate(-8deg);opacity:0}
 86%{transform:translate(35px,-20px) rotate(-8deg);opacity:1}
 100%{transform:translate(27px,-18px) rotate(-7deg);opacity:.9}
}
@keyframes visitor-bee-flying{0%,22%{opacity:1}25%,46%{opacity:0}49%,100%{opacity:1}}
@keyframes visitor-bee-landed{0%,22%{opacity:0}25%,46%{opacity:1}49%,100%{opacity:0}}
@keyframes visitor-bee-shadow{0%,20%{opacity:0}25%,46%{opacity:.16}51%,100%{opacity:0}}
@keyframes visitor-bee-wing-up{0%,100%{opacity:1}33.333%,66.666%{opacity:0}}
@keyframes visitor-bee-wing-mid{0%,66.666%,100%{opacity:0}33.333%{opacity:1}}
@keyframes visitor-bee-wing-down{0%,33.333%,100%{opacity:0}66.666%{opacity:1}}

/* Shared town controls freeze every pose and route on the same animation clock. */
:is(.ambience-paused,.ambience-background) .town-visitors *,body:has(dialog[open]) .town-visitors *{animation-play-state:paused!important}
.reduced .town-visitors,.reduced .visitor-bee-flower-offset{transition:none}
.reduced .town-visitors *{animation:none!important}
.reduced .visitor-bee-flying{display:none}
.reduced .visitor-bee-landed{opacity:1}
@media(prefers-reduced-motion:reduce){
 .town-visitors,.visitor-bee-flower-offset{transition:none}
 .town-visitors *{animation:none!important}
 .visitor-bee-flying{display:none}
 .visitor-bee-landed{opacity:1}
}