/* Tier-Picknick V85 – pure illustrated, image-led preschool play.
   No UI card gradients, emoji, text instructions or digital looking control shapes. */
#app .zw85.main-content{
 position:absolute!important;inset:0!important;isolation:isolate!important;
 display:block!important;width:100%!important;height:100%!important;
 overflow:hidden!important;box-sizing:border-box!important;margin:0!important;padding:0!important;
 background:#88b57c url('/animal-feeding-v85/meadow-portrait.webp') center / 100% 100% no-repeat!important;
 font-family:'Segoe Print','Chalkboard SE',system-ui,sans-serif!important;
 transform:none!important;touch-action:pan-x pan-y!important;
}
.zw85 *, .zw85 *::before,.zw85 *::after{box-sizing:border-box}
.zw85 .zw85-head{
 position:absolute;z-index:13;left:22%;top:1%;width:74%;height:11%;
 background:url('/animal-feeding-v85/title.webp') center / contain no-repeat;
 pointer-events:none;filter:drop-shadow(0 3px 2px #5c473947);
}
.zw85 .zw85-request{
 position:absolute;z-index:15;left:7%;top:12.6%;width:86%;height:16.9%;
 min-height:75px;display:grid!important;place-items:center!important;
 filter:drop-shadow(0 5px 3px #74583b4a);
}
.zw85 .zw85-paper{
 position:absolute;inset:0;pointer-events:none;
 background:url('/animal-feeding-v85/wish-board.webp') center/100% 100% no-repeat;
}
.zw85 .zw85-request-inner{
 position:relative;z-index:1;width:85%;height:84%;
 display:flex;align-items:center;justify-content:center;gap:clamp(3px,2vw,12px);
 overflow:hidden;
}
.zw85 .zw85-number{
 display:block;flex:0 0 auto;width:clamp(36px,12vw,60px);height:75%;
 object-fit:contain;filter:drop-shadow(1px 2px 0 #d9b38d80);
}
.zw85 .zw85-request-items{
 min-width:0;flex:1;max-width:78%;height:96%;
 display:flex;align-items:center;justify-content:center;gap:clamp(2px,1.5vw,10px);
}
.zw85 .zw85-request-item{
 display:grid;place-items:center;flex:0 1 92px;min-width:0;
 height:94%;transition:transform .35s,opacity .35s,filter .35s;
}
.zw85 .zw85-request-item img{width:100%;height:100%;max-width:94px;object-fit:contain;filter:drop-shadow(0 3px 1px #886a4939)}
.zw85 .zw85-request-item.is-given{
 opacity:.24;transform:rotate(-9deg) scale(.75);filter:grayscale(.45);
}
.zw85 .zw85-animal-zone{
 position:absolute;z-index:12;left:7%;top:31%;width:86%;height:43%;
 touch-action:manipulation;pointer-events:auto;
}
.zw85 .zw85-animal-wrap{
 position:absolute;left:9%;top:-3%;width:82%;height:99%;
 transform-origin:50% 86%;
 animation:zw85-breathe 5.2s ease-in-out infinite;
 filter:drop-shadow(0 7px 3px #64574242);
 transition:filter .23s ease;
}
.zw85 .zw85-animal{
 display:block;width:100%;height:100%;
 object-fit:contain;user-select:none;-webkit-user-drag:none;pointer-events:none;
}
.zw85 .zw85-animal-wrap.is-chewing{animation:zw85-chew .63s cubic-bezier(.2,.1,.34,1) 1 both!important}
.zw85.is-happy .zw85-animal-wrap{animation:zw85-happy 1.5s ease-in-out infinite!important}
.zw85 .zw85-animal-wrap.is-receiving{filter:drop-shadow(0 0 14px #fff5cf) drop-shadow(0 6px 3px #64574255)}
.zw85 .zw85-bowl{
 position:absolute;z-index:-1;left:23%;width:54%;height:27%;bottom:-9%;
 background:url('/animal-feeding-v85/bowl.webp') center / 100% 100% no-repeat;
 pointer-events:none;filter:drop-shadow(0 3px 2px #8061494a);
}
.zw85 .zw85-options{
 position:absolute;z-index:45;left:4%;top:79%;width:92%;height:16.5%;
 display:flex!important;align-items:center!important;justify-content:space-between!important;
 flex-wrap:nowrap!important;gap:clamp(4px,1.4vw,12px)!important;
 padding:0!important;margin:0!important;
}
.zw85 button.zw85-option{
 appearance:none!important;-webkit-appearance:none!important;
 position:relative!important;display:grid!important;place-items:center!important;
 flex:0 0 auto!important;min-width:0!important;min-height:72px!important;
 width:min(28vw,120px)!important;height:min(28vw,120px)!important;max-width:120px!important;
 padding:0!important;margin:0!important;
 border:0!important;outline:0!important;box-shadow:none!important;
 border-radius:50%!important;background:transparent!important;
 color:inherit!important;touch-action:none!important;
 transform:none!important;transition:transform .22s ease,filter .22s ease!important;
 filter:drop-shadow(0 4px 2px #594b3866);
}
.zw85 button.zw85-option .zw85-coin{
 position:absolute;inset:0;
 background:url('/animal-feeding-v85/food-button.webp') center / 100% 100% no-repeat;
 pointer-events:none;
}
.zw85 button.zw85-option img{
 position:relative;z-index:1;display:block;
 width:83%!important;height:83%!important;max-width:85%!important;max-height:85%!important;
 padding:0!important;margin:0!important;object-fit:contain!important;
 user-select:none;-webkit-user-drag:none;pointer-events:none!important;
 filter:drop-shadow(0 2px 1px #7f634248);
}
.zw85 button.zw85-option:active{transform:scale(.94)!important}
.zw85 button.zw85-option.is-dragging{filter:brightness(1.18) drop-shadow(0 0 7px #fff0c9);transform:scale(.94)!important}
.zw85 button.zw85-option.is-wrong{animation:zw85-wrong .51s ease-out 1}
.zw85 button.zw85-option:focus-visible{outline:4px solid #fff7d1!important;outline-offset:1px!important}
.zw85 button.zw85-option:disabled{opacity:.78!important;pointer-events:none!important}
.zw85 .zw85-effects{position:absolute;inset:0;z-index:75;overflow:hidden;pointer-events:none;contain:layout style}
.zw85 .zw85-fly{
 position:absolute;z-index:73;width:clamp(82px,24vw,116px);height:clamp(82px,24vw,116px);
 object-fit:contain;pointer-events:none;filter:drop-shadow(0 3px 2px #755e4e66);
 will-change:transform,opacity;
}
.zw85 .zw85-particle{
 position:absolute;width:var(--size);height:var(--size);object-fit:contain;
 opacity:0;pointer-events:none;will-change:transform,opacity;
 animation:zw85-burst 1.75s ease-out var(--delay) both;
}
.zw85 .zw85-status{
 position:absolute!important;width:1px!important;height:1px!important;
 overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;
}
.zw85-drag{
 display:block!important;position:fixed!important;left:0!important;top:0!important;
 width:102px!important;height:102px!important;object-fit:contain!important;
 z-index:99999!important;pointer-events:none!important;filter:drop-shadow(0 9px 5px #45392455);
 will-change:transform;
}
@keyframes zw85-breathe{0%,100%{transform:translateY(0) rotate(-1.3deg)}50%{transform:translateY(-5px) rotate(1.1deg)}}
@keyframes zw85-chew{0%{transform:translateY(0) scale(1)}24%{transform:translateY(-13px) rotate(-4deg) scale(1.045,.955)}48%{transform:translateY(0) rotate(3deg) scale(.97,1.035)}72%{transform:translateY(-9px) rotate(-2deg) scale(1.04,.96)}100%{transform:translateY(0) scale(1)}}
@keyframes zw85-happy{0%,100%{transform:translateY(0) rotate(-3deg) scale(1)}28%{transform:translateY(-19px) rotate(8deg) scale(1.055,.98)}57%{transform:translateY(0) rotate(-7deg) scale(.965,1.025)}76%{transform:translateY(-13px) rotate(5deg) scale(1.045,.985)}}
@keyframes zw85-wrong{0%,100%{transform:translateX(0) rotate(0deg)}21%{transform:translateX(-7px) rotate(-5deg)}44%{transform:translateX(7px) rotate(5deg)}68%{transform:translateX(-4px) rotate(-3deg)}}
@keyframes zw85-burst{
 0%{opacity:0;transform:translate3d(-50%,-50%,0) scale(.25) rotate(-20deg)}
 16%{opacity:1;transform:translate3d(-50%,-66%,0) scale(1.12) rotate(12deg)}
 77%{opacity:1;transform:translate3d(calc(-50% + var(--dx)),calc(-50% + var(--dy)),0) scale(1) rotate(var(--rot))}
 100%{opacity:0;transform:translate3d(calc(-50% + var(--dx)),calc(-50% + var(--dy) + 15px),0) scale(.64) rotate(var(--rot))}
}
@media (orientation:landscape) and (max-height:650px){
 #app .zw85.main-content{background-image:url('/animal-feeding-v85/meadow-landscape.webp')!important}
 .zw85 .zw85-head{left:12%;top:1%;width:30%;height:17%}
 .zw85 .zw85-request{left:49%;top:18%;width:47%;height:33%}
 .zw85 .zw85-request-inner{width:88%}
 .zw85 .zw85-number{width:clamp(37px,7vh,55px)}
 .zw85 .zw85-animal-zone{left:-1%;top:20%;width:47%;height:78%}
 .zw85 .zw85-animal-wrap{left:12%;width:76%;height:100%}
 .zw85 .zw85-bowl{left:23%;width:54%;height:21%;bottom:0%}
 .zw85 .zw85-options{left:49%;top:60%;width:47%;height:32%;gap:clamp(4px,1vw,12px)!important}
 .zw85 button.zw85-option{width:clamp(76px,24vh,104px)!important;height:clamp(76px,24vh,104px)!important;min-width:76px!important;min-height:76px!important}
 .zw85 .zw85-fly{width:82px;height:82px}
}
@media (max-width:354px) and (orientation:portrait){
 .zw85 .zw85-head{left:22%;width:76%;top:1%}
 .zw85 .zw85-request{left:5%;width:90%}
 .zw85 .zw85-number{width:33px}
 .zw85 .zw85-request-inner{width:89%;gap:2px}
 .zw85 .zw85-options{left:3%;width:94%;gap:3px!important}
 .zw85 button.zw85-option{width:28.5vw!important;height:28.5vw!important;min-height:72px!important}
}
@media (prefers-reduced-motion:reduce){
 .zw85 .zw85-animal-wrap{animation:none!important}
 .zw85 .zw85-particle{animation-duration:.4s!important}
 .zw85 button.zw85-option{transition:none!important}
}

/* v85: articulated pencil animal meshes in the picture-led picnic. */
.zw85 .zw85-animal-wrap svg.zw85-animal{width:100%;height:100%;display:block;overflow:visible}
