/* Zählwiese v76 – redesigned picnic artwork matching Finger zählen / Tiere zählen.
   Performance: static illustrated scenery, only isolated small elements animate. */
#app .zw-picnic-world.main-content{
 background:#91c777!important;
 contain:layout style!important;
 backface-visibility:hidden!important;
}
.zw-picnic-world .zw-pic-background{
 background-image:url('/baby-meadow-portrait-v67.webp')!important;
 background-size:100% 100%!important;
 background-position:center!important;
 background-repeat:no-repeat!important;
 opacity:1!important;animation:none!important;
}
.zw-picnic-world .zw-pic-new-sun{display:none!important}
.zw-picnic-world .zw-pic-new-sun{
 position:absolute!important;right:6%!important;top:3%!important;
 width:clamp(50px,13vw,85px)!important;height:auto!important;
 z-index:1!important;opacity:.98!important;pointer-events:none!important;
}
.zw-picnic-world .zw-pic-butterfly{
 z-index:3!important;top:37%!important;left:70%!important;
 animation:zw-v76-butterfly 8s ease-in-out infinite!important;
 transform:translate3d(0,0,0)!important;
}
@keyframes zw-v76-butterfly{
 0%,100%{transform:translate3d(0,0,0) rotate(-4deg)}
 48%{transform:translate3d(-19px,-11px,0) rotate(6deg)}
}
.zw-picnic-world .zw-pic-modes{
 top:10.0%!important;left:20%!important;width:60%!important;
 height:7.5%!important;gap:clamp(8px,3vw,18px)!important;
 z-index:35!important;
}
.zw-picnic-world .zw-pic-mode{
 flex:0 0 auto!important;
 width:clamp(49px,13vw,64px)!important;
 height:clamp(49px,13vw,64px)!important;
 border:4px solid #96724c!important;
 background:radial-gradient(circle at 30% 19%,#fff4d7,#eacb95 75%,#a98159)!important;
 border-radius:48% 52% 47% 54%!important;
 box-shadow:inset 0 0 0 3px #fff9dd,0 3px 0 #694d3991!important;
 transition:transform .22s ease!important;
 filter:none!important;
}
.zw-picnic-world .zw-pic-mode.is-current{
 transform:translate3d(0,-3px,0) scale(1.08)!important;
 border-color:#8c6a49!important;
 box-shadow:inset 0 0 0 3px #fff9dd,0 0 0 3px #f6d87a,0 3px 0 #694d3991!important;
}
.zw-picnic-world .zw-pic-wishes{
 top:19.4%!important;left:6%!important;width:88%!important;height:17.0%!important;
 gap:clamp(5px,2vw,11px)!important;
 z-index:12!important;
}
.zw-picnic-world .zw-pic-wish{
 min-width:0!important;
 border:0!important;border-radius:17px!important;
 background:url('/picnic-art-v76/wish.svg') center/100% 100% no-repeat!important;
 padding:clamp(8px,1.7vh,14px)!important;
 box-shadow:0 4px 2px #715c3a38!important;
 filter:none!important;
 transition:transform .22s ease!important;
}
.zw-picnic-world .zw-pic-wish.is-current{
 transform:translate3d(0,-3px,0) rotate(-.8deg)!important;
 outline:3px solid #f5d67e!important;outline-offset:0!important;
 box-shadow:0 3px 2px #856b4e5e!important;
}
.zw-picnic-world .zw-pic-wish.is-complete{
 outline:3px solid #91b47d!important;
}
.zw-picnic-world .zw-pic-qty{
 color:#77513a!important;
 font-family:'Trebuchet MS',system-ui,sans-serif!important;
 font-weight:900!important;text-shadow:0 1px #fff9dc!important;
 font-size:clamp(19px,5.8vw,35px)!important;
}
.zw-picnic-world .zw-pic-wish .zw-pic-small-face{
 display:block!important;
 width:clamp(27px,7vw,42px)!important;
 height:clamp(30px,7.2vw,45px)!important;
 object-fit:contain!important;
 -webkit-mask-image:linear-gradient(#000 0 74%,transparent 100%)!important;
 mask-image:linear-gradient(#000 0 74%,transparent 100%)!important;
}
.zw-picnic-world .zw-pic-picture{
 display:flex!important;align-content:center!important;align-items:center!important;
 justify-content:center!important;flex-wrap:wrap!important;
 gap:1px 2px!important;overflow:visible!important;
}
.zw-picnic-world .zw-pic-mini{
 width:clamp(15px,4.4vw,25px)!important;
 height:clamp(15px,4.4vw,25px)!important;
 filter:none!important;
}
.zw-picnic-world .zw-pic-wish.zw-pic-many .zw-pic-mini{
 width:clamp(13px,3.5vw,19px)!important;
 height:clamp(13px,3.5vw,19px)!important;
}
.zw-picnic-world .zw-pic-wishes:has(.zw-pic-wish:nth-child(3)) .zw-pic-mini{
 width:clamp(12px,3.1vw,17px)!important;
 height:clamp(12px,3.1vw,17px)!important;
}
.zw-picnic-world .zw-pic-characters{
 top:36.5%!important;left:0!important;width:100%!important;height:27%!important;
 z-index:10!important;animation:none!important;translate:none!important;
 overflow:visible!important;
}
.zw-picnic-world .zw-pic-friend{
 width:34%!important;height:100%!important;bottom:0!important;
 filter:none!important;
 transform:translate3d(0,0,0);
 animation:zw-v76-idle 5.2s ease-in-out infinite!important;
 will-change:transform!important;
}
.zw-picnic-world .zw-pic-moritz{left:1%!important;animation-delay:-1s!important}
.zw-picnic-world .zw-pic-igor{right:1%!important;animation-delay:-3.1s!important}
.zw-picnic-world .zw-pic-friend img{
 width:100%!important;height:100%!important;object-fit:contain!important;
 /* Fade only the original lower-body cut; keep eyes, smile and clothing crisp. */
 -webkit-mask-image:linear-gradient(to bottom,#000 0%,#000 60%,rgba(0,0,0,.93) 64%,rgba(0,0,0,.58) 70%,transparent 83%)!important;
 mask-image:linear-gradient(to bottom,#000 0%,#000 60%,rgba(0,0,0,.93) 64%,rgba(0,0,0,.58) 70%,transparent 83%)!important;
 filter:none!important;
}
@keyframes zw-v76-idle{0%,60%,100%{transform:translate3d(0,0,0) rotate(-1deg)}
 77%{transform:translate3d(0,-4px,0) rotate(1.6deg)}}
.zw-picnic-world .zw-pic-character-grass{
 position:absolute;z-index:11;pointer-events:none;
 left:0;top:50%;width:100%;height:12%;
 background:url('/picnic-art-v76/foreground-grass.svg') center/100% 100% no-repeat!important;
 opacity:.8;
}
.zw-picnic-world .zw-pic-cloth{
 top:57.5%!important;left:11%!important;width:78%!important;height:23%!important;
 border:0!important;box-shadow:none!important;
 border-radius:15%!important;
 background:url('/picnic-art-v76/blanket.svg') center/100% 100% no-repeat!important;
 transform:translate3d(0,0,0)!important;
 z-index:14!important;
 animation:none!important;
}
.zw-picnic-world .zw-pic-seam{display:none!important}
.zw-picnic-world .zw-pic-plates{
 top:61.1%!important;left:19%!important;width:67%!important;height:17.3%!important;
 z-index:18!important;gap:clamp(3px,1.2vw,8px)!important;
 animation:none!important;translate:none!important;
}
.zw-picnic-world .zw-pic-plate{
 border:0!important;box-shadow:none!important;
 border-radius:50%!important;
 background:url('/picnic-art-v76/plate.svg') center/contain no-repeat!important;
 height:100%!important;max-width:145px!important;
 transform:translate3d(0,0,0)!important;
 transition:transform .21s ease!important;filter:none!important;
}
.zw-picnic-world .zw-pic-plate.is-target{
 transform:scale(1.04)!important;
 filter:drop-shadow(0 0 3px #ffe5a2)!important;
}
.zw-picnic-world .zw-pic-plate.is-complete{
 filter:drop-shadow(0 0 3px #c4dda2)!important;
}
.zw-picnic-world .zw-pic-plate.is-hover{
 transform:scale(1.095)!important;
}
.zw-picnic-world .zw-pic-placed{
 will-change:transform;transform:rotate(calc((var(--k) - 2)*6deg)) translateZ(0);
}
.zw-picnic-world .zw-pic-placed-new{
 animation:none!important;
}
.zw-picnic-world .zw-pic-plate-dots{
 bottom:8%!important;
}
.zw-picnic-world .zw-pic-basket{
 top:61.0%!important;left:1%!important;width:24%!important;height:20%!important;
 background:url('/picnic-art-v76/basket.svg') center/contain no-repeat!important;
 border:0!important;filter:none!important;
 transform:rotate(-5deg)!important;animation:none!important;
 z-index:20!important;pointer-events:none!important;
}
.zw-picnic-world .zw-pic-basket>*{visibility:hidden!important}
.zw-picnic-world .zw-pic-foods{
 left:3%!important;top:83%!important;width:94%!important;height:12.3%!important;
 gap:clamp(4px,1.5vw,12px)!important;z-index:35!important;
 animation:none!important;translate:none!important;
}
.zw-picnic-world .zw-pic-food{
 width:clamp(58px,19vw,83px)!important;height:clamp(58px,19vw,83px)!important;
 flex:0 1 clamp(58px,19vw,83px)!important;
 max-width:24%!important;
 border:4px solid #9c754b!important;
 background:radial-gradient(circle at 35% 24%,#fff8e3,#ecd4aa 70%,#c19a66)!important;
 box-shadow:inset 0 0 0 3px #fffae9,0 4px 0 #7a583b9f!important;
 border-radius:49% 51% 50% 48%!important;
 filter:none!important;
 touch-action:none!important;
 will-change:transform;
 transition:transform .17s ease!important;
}
.zw-picnic-world .zw-pic-food:nth-child(even){background:radial-gradient(circle at 35% 24%,#f8f7df,#e1e6bf 70%,#b1bc87)!important}
.zw-picnic-world .zw-pic-food:nth-child(3n){background:radial-gradient(circle at 35% 24%,#fff5eb,#eacecb 70%,#c69b8c)!important}
.zw-picnic-world .zw-pic-food svg{max-width:91%!important;max-height:91%!important}
.zw-picnic-world .zw-pic-ghost{
 left:0!important;top:0!important;width:78px;height:78px;
 transform:translate3d(-150px,-150px,0);
 will-change:transform!important;
 filter:none!important;
}
.zw-picnic-world .zw-pic-wishes,
.zw-picnic-world .zw-pic-plates,
.zw-picnic-world .zw-pic-foods,
.zw-picnic-world .zw-pic-characters{
 animation:none!important;translate:none!important;
}
.zw-picnic-world.zw-pic-leaving .zw-pic-wishes,
.zw-picnic-world.zw-pic-leaving .zw-pic-plates,
.zw-picnic-world.zw-pic-leaving .zw-pic-foods,
.zw-picnic-world.zw-pic-leaving .zw-pic-characters{
 animation:none!important;opacity:1!important;translate:none!important;
}
.zw-picnic-world.zw-pic-leaving::after{
 content:"";position:absolute;inset:0;z-index:45;pointer-events:none;
 background:#fbf0ca;
 animation:zw-v76-next .38s ease-in both;
}
@keyframes zw-v76-next{from{opacity:0}to{opacity:1}}
.zw-picnic-world .zw-pic-party .zw-pic-cloth,
.zw-picnic-world.zw-pic-party .zw-pic-cloth{animation:none!important}
.zw-picnic-world.zw-pic-dance .zw-pic-friend{animation:zw-v76-dance 1.15s ease-in-out 2!important}
.zw-picnic-world.zw-pic-eating .zw-pic-friend{animation:zw-v76-eat .6s ease-in-out 3!important}
@keyframes zw-v76-dance{0%,100%{transform:translate3d(0,0,0) rotate(0)}35%{transform:translate3d(0,-14px,0) rotate(-5deg)}68%{transform:translate3d(0,-7px,0) rotate(5deg)}}
@keyframes zw-v76-eat{0%,100%{transform:translate3d(0,0,0) scale(1)}50%{transform:translate3d(0,2px,0) scale(1.03,.97)}}
.zw-picnic-world .zw-pic-result-actions{z-index:38!important}
@media(max-width:360px) and (orientation:portrait){
 .zw-picnic-world .zw-pic-food{width:clamp(51px,18.5vw,63px)!important;height:clamp(51px,18.5vw,63px)!important;flex-basis:clamp(51px,18.5vw,63px)!important}
 .zw-picnic-world .zw-pic-wishes{top:20.3%!important;height:16%!important}
 .zw-picnic-world .zw-pic-characters{top:36%!important;height:28%!important}
 .zw-picnic-world .zw-pic-wish{padding:4px!important}
}
@media(orientation:landscape) and (max-height:620px){
 .zw-picnic-world .zw-pic-background{background-image:url('/animal-meadow-land-v64.webp')!important}
 .zw-picnic-world .zw-pic-new-sun{top:2%!important;right:2%!important;width:45px!important}
 .zw-picnic-world .zw-pic-modes{top:5%!important;left:30%!important;width:42%!important;height:15%!important}
 .zw-picnic-world .zw-pic-wishes{top:20%!important;left:28%!important;width:46%!important;height:19%!important}
 .zw-picnic-world .zw-pic-characters{top:28%!important;height:41%!important}
 .zw-picnic-world .zw-pic-friend{width:20%!important;height:92%!important}
 .zw-picnic-world .zw-pic-moritz{left:2%!important}
 .zw-picnic-world .zw-pic-igor{right:2%!important}
 .zw-picnic-world .zw-pic-character-grass{top:48%!important;height:17%!important}
 .zw-picnic-world .zw-pic-cloth{top:56%!important;left:23%!important;width:54%!important;height:34%!important}
 .zw-picnic-world .zw-pic-plates{top:59%!important;left:29%!important;width:46%!important;height:26%!important}
 .zw-picnic-world .zw-pic-basket{top:57%!important;left:17%!important;width:14%!important;height:30%!important}
 .zw-picnic-world .zw-pic-foods{top:84%!important;left:25%!important;width:50%!important;height:14%!important}
 .zw-picnic-world .zw-pic-food{width:clamp(44px,12vh,54px)!important;height:clamp(44px,12vh,54px)!important;flex-basis:clamp(44px,12vh,54px)!important}
 .zw-picnic-world .zw-pic-wish .zw-pic-mini{width:clamp(11px,2vh,18px)!important;height:clamp(11px,2vh,18px)!important}
}
@media(prefers-reduced-motion:reduce){
 .zw-picnic-world .zw-pic-friend,.zw-picnic-world .zw-pic-butterfly{animation:none!important}
 .zw-picnic-world.zw-pic-dance .zw-pic-friend,.zw-picnic-world.zw-pic-eating .zw-pic-friend{animation:none!important}
}

/* Bigger picture-only wishes; food pictures, not a sentence, are the main task. */
.zw-picnic-world .zw-pic-wish.is-current{outline:none!important;filter:none!important}
.zw-picnic-world .zw-pic-wish:only-child{
 flex:0 1 min(84%,300px)!important;max-width:300px!important;
 height:96%!important;
}
.zw-picnic-world .zw-pic-wish:only-child .zw-pic-small-face{
 flex:0 0 19%!important;width:19%!important;height:45%!important;
}
.zw-picnic-world .zw-pic-wish:only-child .zw-pic-picture{
 flex:1 1 68%!important;min-width:0!important;
 max-height:86%!important;align-content:center!important;
}
.zw-picnic-world .zw-pic-wish:only-child:not(.zw-pic-many) .zw-pic-mini{
 width:clamp(26px,8.2vw,41px)!important;
 height:clamp(26px,8.2vw,41px)!important;
}
.zw-picnic-world .zw-pic-wish:only-child.zw-pic-many .zw-pic-mini{
 width:clamp(17px,5vw,25px)!important;
 height:clamp(17px,5vw,25px)!important;
}
.zw-picnic-world .zw-pic-food{padding:6px!important;place-items:center!important}
.zw-picnic-world .zw-pic-food svg{
 width:80%!important;height:80%!important;min-width:38px!important;min-height:38px!important;
 max-width:66px!important;max-height:66px!important;
 display:block!important;
}
@media(orientation:landscape) and (max-height:620px){
 .zw-picnic-world .zw-pic-wish:only-child{
  flex-basis:76%!important;height:98%!important;
 }
 .zw-picnic-world .zw-pic-food{padding:3px!important}
 .zw-picnic-world .zw-pic-food svg{min-width:32px!important;min-height:32px!important}
}

