/* Every room has its own resting residents. Action/voice frames temporarily
   use the shared animation sheet; returning to pose-idle restores this art. */
.immersive-stage[data-scene=daily] .town-character.chii{--resident-idle-image:url('/static/assets/immersive/daily-chii-day.webp');--resident-idle-width:29%;--resident-idle-left:5.5%;--resident-idle-top:34.5%}
.immersive-stage[data-scene=daily] .town-character.hachi{--resident-idle-image:url('/static/assets/immersive/daily-hachi-day.webp');--resident-idle-width:31%;--resident-idle-left:37.5%;--resident-idle-top:42.4%}
.immersive-stage[data-scene=daily] .town-character.usagi{--resident-idle-image:url('/static/assets/immersive/daily-usagi-day.webp');--resident-idle-width:35%;--resident-idle-left:64%;--resident-idle-top:28%}
.immersive-stage[data-scene=mail] .town-character.chii{--resident-idle-image:url('/static/assets/immersive/mail-chii-day.webp');--resident-idle-width:29%;--resident-idle-left:3%;--resident-idle-top:38%}
.immersive-stage[data-scene=mail] .town-character.hachi{--resident-idle-image:url('/static/assets/immersive/mail-hachi-day.webp');--resident-idle-width:31%;--resident-idle-left:34%;--resident-idle-top:34%}
.immersive-stage[data-scene=mail] .town-character.usagi{--resident-idle-image:url('/static/assets/immersive/mail-usagi-day.webp');--resident-idle-width:39%;--resident-idle-left:61%;--resident-idle-top:27.5%}
.immersive-stage[data-scene=garden] .town-character.chii{--resident-idle-image:url('/static/assets/immersive/garden-chii-idle.webp');--resident-idle-width:29%;--resident-idle-left:7%;--resident-idle-top:47%}
.immersive-stage[data-scene=garden] .town-character.hachi{--resident-idle-image:url('/static/assets/immersive/garden-hachi-idle-v2.webp');--resident-idle-width:31%;--resident-idle-left:40%;--resident-idle-top:46.5%}
.immersive-stage[data-scene=garden] .town-character.usagi{--resident-idle-image:url('/static/assets/immersive/garden-usagi-idle.webp');--resident-idle-width:31%;--resident-idle-left:68%;--resident-idle-top:38%}
/* Existing night artwork and placement remain unchanged. The same garden
   poses belong to both daylight and starlight in the approved references. */
html[data-theme=night] .immersive-stage[data-scene=daily] .town-character.chii{--resident-idle-image:url('/static/assets/immersive/daily-chii-night.webp');--resident-idle-width:28%;--resident-idle-left:6%;--resident-idle-top:35%}
html[data-theme=night] .immersive-stage[data-scene=daily] .town-character.hachi{--resident-idle-image:url('/static/assets/immersive/daily-hachi-night.webp');--resident-idle-width:31%;--resident-idle-left:39%;--resident-idle-top:43%}
html[data-theme=night] .immersive-stage[data-scene=daily] .town-character.usagi{--resident-idle-image:url('/static/assets/immersive/daily-usagi-night.webp');--resident-idle-width:35%;--resident-idle-left:65%;--resident-idle-top:34%}
html[data-theme=night] .immersive-stage[data-scene=mail] .town-character.chii{--resident-idle-image:url('/static/assets/immersive/mail-chii-night.webp');--resident-idle-width:28%;--resident-idle-left:3%;--resident-idle-top:38%}
html[data-theme=night] .immersive-stage[data-scene=mail] .town-character.hachi{--resident-idle-image:url('/static/assets/immersive/mail-hachi-night.webp');--resident-idle-width:28%;--resident-idle-left:35%;--resident-idle-top:34%}
html[data-theme=night] .immersive-stage[data-scene=mail] .town-character.usagi{--resident-idle-image:url('/static/assets/immersive/mail-usagi-night.webp');--resident-idle-width:30%;--resident-idle-left:68%;--resident-idle-top:37%}
.immersive-stage[data-scene=daily]:not([data-play]):not(.is-delivering) .town-character:not(.is-pet):not(.is-feed),
.immersive-stage[data-scene=mail]:not([data-play]):not(.is-delivering) .town-character:not(.is-pet):not(.is-feed),
.immersive-stage[data-scene=garden]:not([data-play]):not(.is-delivering) .town-character:not(.is-pet):not(.is-feed){width:var(--resident-idle-width);left:var(--resident-idle-left);top:var(--resident-idle-top)}
.immersive-stage[data-scene=daily]:not([data-play]):not(.is-delivering) .town-character:not(.is-pet):not(.is-feed) .sprite.pose-idle,
.immersive-stage[data-scene=mail]:not([data-play]):not(.is-delivering) .town-character:not(.is-pet):not(.is-feed) .sprite.pose-idle,
.immersive-stage[data-scene=garden]:not([data-play]):not(.is-delivering) .town-character:not(.is-pet):not(.is-feed) .sprite.pose-idle{background-image:var(--resident-idle-image);background-size:contain;background-repeat:no-repeat;background-position:center}

/* The blink patches cover only the eye pixels on each existing pose. Insets
   and sizes are relative to the square that contains the original artwork. */
.immersive-stage[data-scene=home] .chii{
  --idle-motion:resident-idle-tilt;--idle-angle:-1.7deg;--idle-cycle:10s;--idle-delay:-1.5s;
  --idle-eye-a:52.1% auto auto 43.8%;--idle-eye-b:52.1% auto auto 63.5%;--idle-eye-w:8.6%;--idle-eye-h:9%;
}
.immersive-stage[data-scene=home] .hachi{
  --idle-motion:resident-idle-nod;--idle-cycle:12s;--idle-delay:-6s;
  --idle-eye-a:51.5% auto auto 43.5%;--idle-eye-b:51.5% auto auto 63.5%;--idle-eye-w:8.6%;--idle-eye-h:8.6%;
}
.immersive-stage[data-scene=home] .usagi{
  --idle-motion:resident-idle-perk;--idle-angle:2deg;--idle-cycle:11s;--idle-delay:-1s;--idle-fur:#fce9aa;
  --idle-eye-a:43.5% auto auto 44%;--idle-eye-b:43.5% auto auto 61.9%;--idle-eye-w:8%;--idle-eye-h:8%;
}
.immersive-stage[data-scene=daily] .chii{
  --idle-motion:resident-idle-tilt;--idle-angle:2deg;--idle-cycle:11s;--idle-delay:-2.5s;
  --idle-eye-a:40.6% auto auto 38.3%;--idle-eye-b:33.1% auto auto 57.3%;--idle-eye-w:10%;--idle-eye-h:10.3%;--idle-fur:#fbf7f3;--idle-eye-slant:-18deg;
}
.immersive-stage[data-scene=daily] .hachi{
  --idle-motion:resident-idle-nod;--idle-cycle:10s;--idle-delay:-5s;
  --idle-eye-a:56.7% auto auto 28.3%;--idle-eye-b:58.5% auto auto 50.4%;--idle-eye-w:9.2%;--idle-eye-h:9.4%;--idle-fur:#faf6f3;
}
.immersive-stage[data-scene=daily] .usagi{
  --idle-motion:resident-idle-tilt;--idle-angle:1.5deg;--idle-cycle:9s;--idle-delay:-1s;
  --idle-eye-a:46% auto auto 37.7%;--idle-eye-b:48.5% auto auto 55.2%;--idle-eye-w:7.9%;--idle-eye-h:7.9%;--idle-fur:#fce8b3;
}
.immersive-stage[data-scene=mail] .chii{
  --idle-motion:resident-idle-nod;--idle-cycle:11s;--idle-delay:-2s;
  --idle-eye-a:43.8% auto auto 44.8%;--idle-eye-b:35.4% auto auto 67.3%;--idle-eye-w:10.3%;--idle-eye-h:10.8%;--idle-fur:#fbf7f3;--idle-eye-slant:-14deg;
}
.immersive-stage[data-scene=mail] .hachi{
  --idle-motion:resident-idle-tilt;--idle-angle:-1.5deg;--idle-cycle:9s;--idle-delay:-6s;
  --idle-eye-a:46.9% auto auto 32.9%;--idle-eye-b:49.4% auto auto 57.7%;--idle-eye-w:10.3%;--idle-eye-h:10.4%;--idle-fur:#fbf7f3;
}
.immersive-stage[data-scene=mail] .usagi{
  --idle-motion:resident-idle-perk;--idle-angle:1.6deg;--idle-cycle:12s;--idle-delay:-.8s;
  --idle-eye-a:44% auto auto 44.4%;--idle-eye-b:39.2% auto auto 59.4%;--idle-eye-w:7.9%;--idle-eye-h:7.9%;--idle-fur:#fce8b5;--idle-eye-slant:-12deg;
}
.immersive-stage[data-scene=garden] .chii{
  --idle-motion:resident-idle-tilt;--idle-angle:1.8deg;--idle-cycle:11s;--idle-delay:-1.4s;
  --idle-eye-a:43.1% auto auto 44.6%;--idle-eye-b:35% auto auto 67.1%;--idle-eye-w:10.8%;--idle-eye-h:11.2%;--idle-fur:#fbf7f3;--idle-eye-slant:-14deg;
}
.immersive-stage[data-scene=garden] .hachi{
  --idle-motion:resident-idle-nod;--idle-cycle:12s;--idle-delay:-6.5s;
  --idle-eye-a:43.3% auto auto 44.2%;--idle-eye-b:46.5% auto auto 62.9%;--idle-eye-w:8.3%;--idle-eye-h:8.7%;--idle-fur:#faf7f1;
}
.immersive-stage[data-scene=garden] .usagi{
  --idle-motion:resident-idle-perk;--idle-angle:-1.4deg;--idle-cycle:10s;--idle-delay:-.9s;
  --idle-eye-a:38.5% auto auto 43.3%;--idle-eye-b:43.3% auto auto 57.3%;--idle-eye-w:7.8%;--idle-eye-h:9.5%;--idle-fur:#fce8b3;
}
html[data-theme=night] .immersive-stage[data-scene=daily] .chii{
  --idle-eye-content:none;--idle-motion:resident-idle-nod;--idle-cycle:13s;
}
html[data-theme=night] .immersive-stage[data-scene=daily] .hachi{
  --idle-eye-content:none;--idle-motion:resident-idle-breathe;--idle-cycle:5.4s;--idle-delay:-1.8s;--idle-z:'z';--idle-z-top:21%;--idle-z-left:78%;
}
html[data-theme=night] .immersive-stage[data-scene=daily] .usagi{
  --idle-eye-content:none;--idle-motion:resident-idle-breathe;--idle-cycle:6.4s;--idle-delay:-3.1s;--idle-z:'z';--idle-z-top:19%;--idle-z-left:61%;
}
html[data-theme=night] .immersive-stage[data-scene=mail] .chii{
  --idle-eye-a:47.5% auto auto 41.7%;--idle-eye-b:41% auto auto 67.9%;--idle-eye-w:11.7%;--idle-eye-h:11.6%;
}
html[data-theme=night] .immersive-stage[data-scene=mail] .hachi{
  --idle-eye-a:45.8% auto auto 33.1%;--idle-eye-b:48.3% auto auto 59.6%;--idle-eye-w:11.6%;--idle-eye-h:10.8%;
}
html[data-theme=night] .immersive-stage[data-scene=mail] .usagi{
  --idle-eye-content:none;--idle-motion:resident-idle-breathe;--idle-cycle:6s;--idle-delay:-2s;--idle-z:'z';--idle-z-top:13%;--idle-z-left:74%;
}

/* Anchor the motion layer to the character button so its size does not
   depend on the button's in-flow content. */
.immersive-stage:not([data-scene=about]) .scene-residents .town-character > .resident-motion{
  position:absolute;
  inset:0;
  width:auto;
  height:auto;
}

/* The sprite shares a role class with the button. Keep the scene's offsets
   on the button and anchor the sprite to the motion layer's origin. */
@media (prefers-reduced-motion:no-preference){
  .immersive-stage:not([data-scene=about]):not([data-play]):not([data-story-active]):not(.is-delivering)
  .scene-residents .town-character:not(.is-pet):not(.is-feed):not([data-flight]) .sprite.pose-idle{
    position:absolute;
    inset:0;
    transform-origin:50% 88%;
    animation:var(--idle-motion,none) var(--idle-cycle,10s) ease-in-out infinite var(--idle-delay,0s);
  }
  .immersive-stage:not([data-scene=about]):not([data-play]):not([data-story-active]):not(.is-delivering)
  .scene-residents .town-character:not(.is-pet):not(.is-feed):not([data-flight]) .sprite.pose-idle::before,
  .immersive-stage:not([data-scene=about]):not([data-play]):not([data-story-active]):not(.is-delivering)
  .scene-residents .town-character:not(.is-pet):not(.is-feed):not([data-flight]) .sprite.pose-idle::after{
    content:var(--idle-eye-content,'');
    position:absolute;
    inset:var(--idle-eye-a);
    width:var(--idle-eye-w);
    height:var(--idle-eye-h);
    transform:translate(-50%,-50%) rotate(var(--idle-eye-slant,0deg));
    border-radius:50%;
    border-bottom:1.5px solid #32201a;
    background:var(--idle-fur,#fcfbfc);
    opacity:0;
    pointer-events:none;
    animation:resident-idle-blink var(--idle-cycle,10s) steps(1,end) infinite var(--idle-delay,0s);
  }
  .immersive-stage:not([data-scene=about]):not([data-play]):not([data-story-active]):not(.is-delivering)
  .scene-residents .town-character:not(.is-pet):not(.is-feed):not([data-flight]) .sprite.pose-idle::after{
    inset:var(--idle-eye-b);
  }
  .immersive-stage:not([data-scene=about]):not([data-play]):not([data-story-active]):not(.is-delivering)
  .scene-residents .town-character:not(.is-pet):not(.is-feed):not([data-flight]) .resident-motion:has(.sprite.pose-idle)::after{
    content:var(--idle-z,none);
    position:absolute;
    left:var(--idle-z-left);
    top:var(--idle-z-top);
    color:#fff6de;
    text-shadow:0 1px 2px #644a36;
    font:600 clamp(10px,3.3cqw,16px) Georgia,serif;
    opacity:0;
    pointer-events:none;
    animation:resident-idle-doze var(--idle-cycle,6s) ease-out infinite var(--idle-delay,0s);
  }
}
@keyframes resident-idle-blink{
  0%,34.5%,100%{opacity:0}
  33%{opacity:1}
}
@keyframes resident-idle-tilt{
  0%,22%,48%,100%{transform:none}
  34%{transform:rotate(var(--idle-angle))}
}
@keyframes resident-idle-nod{
  0%,23%,45%,100%{transform:none}
  33%{transform:translateY(1%) scaleY(.981)}
  39%{transform:translateY(-.7%)}
}
@keyframes resident-idle-perk{
  0%,24%,47%,100%{transform:none}
  34%{transform:translateY(-2%) rotate(var(--idle-angle)) scaleY(1.012)}
  41%{transform:translateY(.4%)}
}
@keyframes resident-idle-breathe{
  0%,100%{transform:none}
  48%{transform:scale(1.01,1.025)}
}
@keyframes resident-idle-doze{
  0%,31%{transform:translate(0,0) scale(.8);opacity:0}
  45%{opacity:.8}
  71%,100%{transform:translate(5px,-12px) scale(1.1);opacity:0}
}
