/* Picknick v118: complete illustrated icons and the storybook reward */
#app .zw107 .zw107-controls{
 top:max(9px,2.1%)!important;right:1.4%!important;gap:clamp(4px,1vw,9px)!important;
 overflow:visible!important;z-index:70!important;
}
#app .zw107 .zw107-controls .zw107-help,
#app .zw107 .zw107-controls .zw107-restart{
 width:clamp(53px,9vw,79px)!important;
 height:clamp(53px,9vw,79px)!important;
 min-width:53px!important;min-height:53px!important;
 background-size:100% 100%!important;background-position:center!important;
 background-repeat:no-repeat!important;overflow:visible!important;
 filter:drop-shadow(0 3px 2px #614c3580)!important;
 border:none!important;border-radius:50%!important;padding:0!important;
}
#app .zw107 .zw107-help{background-image:url('/picnic-v118/btn-hint.webp')!important}
#app .zw107 .zw107-restart{background-image:url('/picnic-v118/btn-restart.webp')!important}
#app .zw107 .zw107-food-button img.zw118-fullfood{
 position:absolute!important;
 inset:5%!important;
 width:90%!important;height:90%!important;
 max-width:90%!important;max-height:90%!important;
 object-fit:contain!important;
 display:block!important;
 overflow:visible!important;
 pointer-events:none!important;
 user-select:none!important;-webkit-user-select:none!important;
 filter:drop-shadow(0 2px 1px #73553a7e)!important;
}
#app .zw107 .zw107-goal-piece img.zw118-fullfood,
#app .zw107 .zw107-collected img.zw118-fullfood,
#app .zw107 .zw117-reward-food img.zw118-fullfood,
#app .zw107 .zw109-feast-food img.zw118-fullfood {
 position:static!important;
 inset:auto!important;
 width:100%!important;height:100%!important;
 max-width:100%!important;max-height:100%!important;
 object-fit:contain!important;overflow:visible!important;
}
#app .zw107 .zw107-food-button{
 overflow:visible!important;
 padding:0!important;
 -webkit-user-select:none!important;
 user-select:none!important;
 touch-action:none!important;
}
#app .zw107 .zw107-tray,
#app .zw107 .zw107-food-grid{overflow:visible!important}
#app .zw107 .zw107-tray{clip-path:inset(-3px round 34px)!important}
.zw107 .zw118-celebration{
 position:absolute;inset:0;z-index:65;pointer-events:none!important;
 overflow:hidden!important;isolation:isolate;
}
.zw107 .zw118-celebration>*{position:absolute;pointer-events:none!important;display:block}
.zw107 .zw118-confetti{
 left:var(--x);top:var(--y);
 width:clamp(8px,1.2vw,14px);height:clamp(13px,2vw,20px);
 background:var(--color);
 opacity:0;
 border-radius:2px 5px 1px 4px;
 box-shadow:inset 1px 1px 1px #fff9df99;
 animation:zw118-confetti-fall var(--duration) var(--delay) ease-out both;
}
@keyframes zw118-confetti-fall{
 0%{opacity:0;transform:translate3d(0,-115px,0) rotate(0) scale(.7)}
 14%{opacity:1}
 85%{opacity:1}
 100%{opacity:0;transform:translate3d(var(--dx),var(--fall),0) rotate(var(--rot)) scale(.75)}
}
.zw107 .zw118-heart{
 width:clamp(25px,6vw,49px);height:auto;
 left:var(--x);bottom:18%;
 opacity:0;
 filter:drop-shadow(0 2px 1px #744e5566);
 animation:zw118-heart-float var(--duration) var(--delay) ease-out both;
}
@keyframes zw118-heart-float{
 0%{opacity:0;transform:translate3d(0,30px,0) scale(.35) rotate(-12deg)}
 17%{opacity:1}
 70%{opacity:.97}
 100%{opacity:0;transform:translate3d(var(--sway),-295px,0) scale(var(--scale)) rotate(11deg)}
}
.zw107 .zw118-balloon{
 width:clamp(37px,8vw,67px);height:auto;object-fit:contain;
 left:var(--x);bottom:2%;
 opacity:0;
 filter:hue-rotate(var(--hue)) drop-shadow(0 2px 2px #65514944);
 animation:zw118-balloon-rise var(--duration) var(--delay) ease-in-out both;
}
@keyframes zw118-balloon-rise{
 0%{opacity:0;transform:translate3d(0,90px,0) rotate(-8deg)}
 12%{opacity:1}
 85%{opacity:1}
 100%{opacity:0;transform:translate3d(var(--sway),-460px,0) rotate(8deg)}
}
@media(min-aspect-ratio:6/5){
 .zw107 .zw118-heart{bottom:9%!important}
 .zw107 .zw118-balloon{bottom:-9%!important;width:clamp(30px,5vw,49px)!important}
 @keyframes zw118-balloon-rise{
 0%{opacity:0;transform:translate3d(0,75px,0)}
 13%{opacity:1}82%{opacity:1}
 100%{opacity:0;transform:translate3d(var(--sway),-320px,0)}
 }
}
@media(prefers-reduced-motion:reduce){
 .zw107 .zw118-celebration>*{animation:none!important;opacity:1!important}
 .zw107 .zw118-confetti{opacity:.95!important}
 .zw107 .zw118-heart{bottom:34%!important}
 .zw107 .zw118-balloon{bottom:44%!important}
}

/* v118.1: celebration graphics start above the picnic blanket, not below viewport. */
.zw107 .zw118-balloon{bottom:20%!important;width:clamp(42px,10vw,73px)!important}
.zw107 .zw118-heart{bottom:30%!important;width:clamp(30px,7.5vw,60px)!important}
.zw107 .zw118-confetti{width:clamp(10px,1.6vw,16px)!important;height:clamp(15px,2.3vw,24px)!important}
@keyframes zw118-confetti-fall{
 0%{opacity:0;transform:translate3d(0,-45px,0) rotate(0deg) scale(.8)}
 12%{opacity:1}
 78%{opacity:1}
 100%{opacity:0;transform:translate3d(var(--dx),var(--fall),0) rotate(var(--rot)) scale(.75)}
}
@keyframes zw118-heart-float{
 0%{opacity:0;transform:translate3d(0,18px,0) scale(.5) rotate(-8deg)}
 10%{opacity:1}
 76%{opacity:1}
 100%{opacity:0;transform:translate3d(var(--sway),-290px,0) scale(var(--scale)) rotate(12deg)}
}
@keyframes zw118-balloon-rise{
 0%{opacity:0;transform:translate3d(0,35px,0) rotate(-7deg)}
 11%{opacity:1}
 84%{opacity:1}
 100%{opacity:0;transform:translate3d(var(--sway),-420px,0) rotate(8deg)}
}
@media(min-aspect-ratio:6/5){
 .zw107 .zw118-balloon{bottom:13%!important;width:clamp(31px,6vw,54px)!important}
 .zw107 .zw118-heart{bottom:20%!important;width:clamp(24px,5vw,45px)!important}
 @keyframes zw118-balloon-rise{
 0%{opacity:0;transform:translate3d(0,28px,0)}
 11%{opacity:1}84%{opacity:1}
 100%{opacity:0;transform:translate3d(var(--sway),-300px,0)}
 }
}