/* Backstube 2.42. All moving pictures are actual multi-frame WebP images
   made from the original hand-colored pencil art (no Canvas, no SVG). */

/* True 22-frame light switch. Unlike the old opacity-only switch, each
   intermediate physical oven painting is rendered, and remains pixel-aligned. */
#app .zw170-launch.zw222-bakery-entry #zw222OvenLight > img.zw242-preview-switch{
 display:block!important;position:absolute!important;inset:0!important;
 width:100%!important;height:100%!important;
 max-width:none!important;max-height:none!important;
 object-fit:contain!important;object-position:center!important;
 margin:0!important;padding:0!important;
 opacity:1!important;visibility:visible!important;
 z-index:18!important;pointer-events:none!important;
 filter:none!important;transform:none!important;
 animation:none!important;transition:none!important;
}
#app .zw170-launch.zw222-bakery-entry #zw222OvenLight.zw242-light-changing .zw222-sunburst{
 opacity:0!important;animation:none!important;
}
#app .zw170-launch.zw222-bakery-entry .zw226-friend-button.zw226-celebrating > img.zw226-friend-cheer{
 animation:zw242-joy-bob 1.65s ease-in-out 1!important;
}
@keyframes zw242-joy-bob{
 0%,100%{transform:translate3d(0,0,0) rotate(0)}
 16%{transform:translate3d(-3px,-6px,0) rotate(-3deg)}
 30%{transform:translate3d(0,-12px,0) rotate(3deg)}
 50%{transform:translate3d(3px,-4px,0) rotate(2deg)}
 75%{transform:translate3d(0,-9px,0) rotate(-2deg)}
}
/* The oven genuinely cools after baking; smoke stops BEFORE the food leaves. */
#app .zw209-bake .zw209-oven-work.zw242-cooling{
 filter:drop-shadow(0 5px 3px rgba(89,58,33,.23))!important;
}
#app .zw209-bake .zw209-oven-work.zw242-cooling .zw209-oven{
 animation:none!important;
}
#app .zw209-bake .zw209-oven-work.zw242-cooling .zw209-oven-smoke{
 opacity:0!important;box-shadow:none!important;animation:none!important;
 transition:opacity .3s linear!important;
}
#app .zw209-bake .zw209-oven-work > img.zw242-bake-oven-off{
 position:absolute!important;inset:0!important;
 display:block!important;
 width:100%!important;height:100%!important;
 max-width:none!important;max-height:none!important;
 z-index:4!important;opacity:1!important;
 object-fit:contain!important;object-position:center!important;
 pointer-events:none!important;
 margin:0!important;padding:0!important;filter:none!important;
 animation:none!important;transform:none!important;
}
#app .zw209-bake .zw209-oven-work.zw242-food-leaving .zw209-oven-food{
 opacity:0!important;transition:opacity .12s ease-out!important;
}
img.zw242-food-exit{
 position:fixed!important;z-index:99996!important;
 width:clamp(88px,25vw,130px)!important;height:clamp(88px,25vw,130px)!important;
 object-fit:contain!important;
 pointer-events:none!important;touch-action:none!important;
 filter:drop-shadow(0 5px 4px rgba(83,54,29,.33))!important;
 transform:translate(-50%,-50%);will-change:transform,opacity!important;
}
/* Hand-painted 24-frame eating animation, visible above the default static
   character. Character sprite and food each have their own 24-frame cycle. */
#app .zw209 .zw209-friend > img.zw242-chew-frames{
 display:block!important;position:absolute!important;
 width:122%!important;height:122%!important;
 max-width:none!important;max-height:none!important;
 left:-11%!important;top:-8%!important;
 object-fit:contain!important;object-position:center center!important;
 opacity:0!important;visibility:hidden!important;
 pointer-events:none!important;z-index:12!important;
 filter:drop-shadow(0 2px 2px rgba(86,49,29,.16))!important;
 animation:none!important;transform:none!important;
}
#app .zw209 .zw209-friend.zw212-chewing > img.zw242-chew-frames{
 opacity:1!important;visibility:visible!important;
}
#app .zw209 .zw209-friend.zw212-chewing > img.zw212-base,
#app .zw209 .zw209-friend.zw212-chewing > img.zw212-cheer{
 opacity:0!important;
}
#app .zw209 .zw209-friend.zw212-delighted:not(.zw212-chewing) > img.zw242-chew-frames{
 opacity:0!important;visibility:hidden!important;
}
#app .zw209 .zw209-friend.zw212-delighted:not(.zw212-chewing) > img.zw212-cheer{
 opacity:1!important;
}
@media(prefers-reduced-motion:reduce){
 #app .zw209 .zw209-friend > img.zw242-chew-frames{
  display:none!important;
 }
 #app .zw209 .zw209-friend.zw212-chewing > img.zw212-base{
  opacity:1!important;
 }
 #app .zw170-launch.zw222-bakery-entry .zw226-friend-button.zw226-celebrating > img.zw226-friend-cheer{
  animation:none!important;
 }
}