/* Zählwiese Kuschel-Labyrinth V93 – warm illustrated responsive children's game */
#app .zw93.main-content{
 position:absolute!important;inset:0!important;width:100%!important;height:100%!important;
 overflow:hidden!important;isolation:isolate!important;
 background:#acd49f url('/storybook-games-v91/world-maze-portrait.webp') center/100% 100% no-repeat!important;
 font-family:'Segoe Print','Comic Sans MS',sans-serif!important;
}
.zw93,.zw93 *{box-sizing:border-box}
.zw93 button{appearance:none!important;-webkit-appearance:none!important;background:none!important;border:0!important;
 margin:0!important;padding:0!important;box-shadow:none!important;outline:none;cursor:pointer;
 touch-action:manipulation!important;-webkit-tap-highlight-color:transparent}
.zw93 img{display:block;pointer-events:none;user-select:none;-webkit-user-drag:none;object-fit:contain;max-width:100%}
.zw93 .zw93-title{position:absolute;left:20%;top:1%;width:73%;height:10%;z-index:5;pointer-events:none}
.zw93 .zw93-title img{width:100%;height:100%;filter:drop-shadow(0 3px 2px #7a614944)}
.zw93 .zw93-progress{
 position:absolute;z-index:8;left:19%;top:11.5%;width:68%;height:7%;
 display:flex;align-items:center;justify-content:space-around;gap:5px;
 background:url('/storybook-games-v91/choice-board.webp') center/100% 100% no-repeat;
 filter:drop-shadow(0 2px 2px #5e4c3925);
}
.zw93 .zw93-progress-char{width:12%;height:89%;max-width:42px}
.zw93 .zw93-progress-petals{flex:1;display:flex;align-items:center;justify-content:center;gap:3px}
.zw93 .zw93-progress-petal{height:clamp(10px,3vw,16px);width:clamp(10px,3vw,16px);border-radius:45% 55% 50% 45%;
 display:block;background:#e7bea3;box-shadow:inset 1px 1px #b68f7b,0 1px 1px #fff9db;
 transform:rotate(-20deg);opacity:.75;transition:background .38s,transform .38s}
.zw93 .zw93-progress-petal:nth-child(even){transform:rotate(19deg)}
.zw93 .zw93-progress-petal.is-filled{background:#e39caa;opacity:1;transform:rotate(35deg) scale(1.11);box-shadow:0 1px 3px #bd7f85}
.zw93 .zw93-board{
 position:absolute;left:5%;top:19.5%;width:90%;height:58%;
 border-radius:25px;overflow:hidden;z-index:9;
 filter:drop-shadow(0 5px 3px rgba(88,68,46,.28));
 touch-action:none!important;overscroll-behavior:none!important;
}
.zw93 .zw93-paper{position:absolute;inset:0;width:100%;height:100%;object-fit:fill!important}
.zw93 .zw93-flecks{position:absolute;inset:0;width:100%;height:100%;opacity:.7;object-fit:fill!important}
.zw93 #zw93Canvas{position:absolute;inset:0;pointer-events:none;width:100%;height:100%;z-index:2;object-fit:fill}
.zw93 .zw93-friend{
 position:absolute!important;z-index:5;transform:translate(-50%,-50%);
 border-radius:50%!important;touch-action:none!important;
 transition:left .16s cubic-bezier(.22,.73,.4,1),top .16s cubic-bezier(.22,.73,.4,1),filter .18s ease;
 filter:drop-shadow(0 2px 2px #5a463c70);
}
.zw93 .zw93-friend img{width:100%;height:100%;animation:zw93-breathe 3.7s ease-in-out infinite}
.zw93 .zw93-friend.zw93-igor img{animation-delay:-1.2s}
.zw93 .zw93-friend.selected{
 filter:drop-shadow(0 0 6px #fff4ba) drop-shadow(0 2px 2px #694d3677)
}
.zw93 .zw93-friend.zw93-wiggle{animation:zw93-wiggle .4s ease-out}
.zw93 .zw93-friend.is-hugging{opacity:0!important;transition:opacity .5s}
.zw93 .zw93-hug{
 position:absolute;z-index:9;width:min(260px,65%);height:min(235px,56%);
 transform:translate(-50%,-50%) scale(.3);opacity:0;pointer-events:none;
 filter:drop-shadow(0 5px 3px #624c3d50);
}
.zw93 .zw93-hug img{width:100%;height:100%;object-fit:contain}
.zw93 .zw93-hug.is-visible{
 opacity:1;transform:translate(-50%,-50%) scale(1.15);
 transition:transform 1.1s cubic-bezier(.18,.75,.2,1),opacity .42s;
 animation:zw93-cuddle-pulse 1.4s ease-in-out 1.1s infinite;
}
.zw93 .zw93-effects{position:absolute;inset:0;z-index:25;pointer-events:none;overflow:hidden}
.zw93 .zw93-confetti{
 position:absolute;width:22px;height:26px;opacity:0;pointer-events:none;will-change:transform,opacity;
 animation:zw93-sparkle 3.5s cubic-bezier(.2,.44,.3,.94) forwards;
}
.zw93 .zw93-confetti.is-heart{width:30px;height:31px}
.zw93 .zw93-confetti.is-balloon{width:48px;height:99px;animation:zw93-float-up 4.5s ease-out forwards}
.zw93 .zw93-controls{
 position:absolute;z-index:15;left:3%;top:79%;width:94%;height:19.5%;
 display:grid;grid-template-columns:28% 39% 33%;
 gap:0;align-items:center;justify-items:center;
}
.zw93 .zw93-actors{width:100%;display:flex;justify-content:space-evenly;align-items:center;gap:1px}
.zw93 .zw93-pick{position:relative!important;flex:none!important;width:clamp(59px,18vw,76px)!important;
 height:clamp(59px,18vw,76px)!important;border-radius:50%!important;filter:drop-shadow(0 3px 2px #65493644)}
.zw93 .zw93-coin-bg{position:absolute;inset:0;width:100%;height:100%}
.zw93 .zw93-pick-img{position:absolute;inset:4%;width:92%;height:92%}
.zw93 .zw93-pick.is-selected{transform:scale(1.1);filter:drop-shadow(0 0 6px #fff4bd)}
.zw93 .zw93-directions{
 display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);
 justify-content:center;place-items:center;gap:1px;width:min(158px,100%);aspect-ratio:1;
}
.zw93 .zw93-direction,.zw93 .zw93-level,.zw93 .zw93-reset{
 position:relative!important;display:grid!important;place-items:center!important;
 border-radius:50%!important;filter:drop-shadow(0 2px 1px #6c563c45)
}
.zw93 .zw93-direction{width:clamp(44px,12vw,54px)!important;height:clamp(44px,12vw,54px)!important}
.zw93 .zw93-direction img,.zw93 .zw93-level img,.zw93 .zw93-reset img{width:100%;height:100%}
.zw93 .zw93-direction.zw93-n{grid-column:2;grid-row:1}
.zw93 .zw93-direction.zw93-w{grid-column:1;grid-row:2}
.zw93 .zw93-direction.zw93-e{grid-column:3;grid-row:2}
.zw93 .zw93-direction.zw93-s{grid-column:2;grid-row:3}
.zw93 .zw93-settings{width:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px}
.zw93 .zw93-levels{display:flex;width:100%;justify-content:center;align-items:center;gap:0}
.zw93 .zw93-level{width:clamp(38px,10vw,53px)!important;height:clamp(38px,10vw,53px)!important}
.zw93 .zw93-level.is-selected{transform:scale(1.14);filter:drop-shadow(0 0 5px #fffaac)}
.zw93 .zw93-reset{width:clamp(47px,13vw,61px)!important;height:clamp(47px,13vw,61px)!important}
.zw93 button:active:not(.zw93-friend){transform:scale(.9)}
.zw93 button:focus-visible{outline:4px solid #fff4c7!important;outline-offset:2px!important}
.zw93 .zw93-live{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}
@keyframes zw93-breathe{0%,100%{transform:translateY(0) rotate(-1.4deg)}47%{transform:translateY(-3px) rotate(1.5deg)}}
@keyframes zw93-wiggle{0%,100%{transform:translate(-50%,-50%) rotate(0)}30%{transform:translate(-50%,-50%) rotate(-7deg)}65%{transform:translate(-50%,-50%) rotate(6deg)}}
@keyframes zw93-cuddle-pulse{0%,100%{transform:translate(-50%,-50%) scale(1.13) rotate(-2deg)}50%{transform:translate(-50%,-50%) scale(1.19) rotate(2deg)}}
@keyframes zw93-sparkle{0%{opacity:0;transform:translate(0,0) scale(.3)}17%{opacity:1}72%{opacity:1}100%{opacity:0;transform:translate(var(--dx),var(--dy)) rotate(var(--turn)) scale(.85)}}
@keyframes zw93-float-up{0%{opacity:0;transform:translate(0,10px) scale(.55)}16%{opacity:1}78%{opacity:1}100%{opacity:0;transform:translate(var(--dx),calc(var(--dy) - 70px)) rotate(8deg) scale(1.04)}}
@media(orientation:landscape) and (max-height:650px){
 #app .zw93.main-content{background-image:url('/storybook-games-v91/world-maze-landscape.webp')!important}
 .zw93 .zw93-title{left:65%;top:1%;width:32%;height:17%}
 .zw93 .zw93-progress{left:64%;top:19%;width:34%;height:15%}
 .zw93 .zw93-progress-petal{width:clamp(7px,1.8vw,12px);height:clamp(7px,1.8vw,12px)}
 .zw93 .zw93-board{left:2%;top:10%;width:60%;height:86%}
 .zw93 .zw93-controls{left:64%;top:35%;width:34%;height:63%;
   display:grid;grid-template-columns:1fr;grid-template-rows:30% 35% 35%;gap:0}
 .zw93 .zw93-actors{width:85%;max-width:250px;gap:22px}
 .zw93 .zw93-pick{width:clamp(49px,15vh,70px)!important;height:clamp(49px,15vh,70px)!important}
 .zw93 .zw93-directions{width:100%;height:100%;max-width:280px;aspect-ratio:auto;
   display:flex;align-items:center;justify-content:center;gap:1px}
 .zw93 .zw93-direction{width:clamp(45px,15vh,61px)!important;height:clamp(45px,15vh,61px)!important}
 .zw93 .zw93-settings{flex-direction:row;gap:3px}
 .zw93 .zw93-level{width:clamp(43px,14vh,56px)!important;height:clamp(43px,14vh,56px)!important}
 .zw93 .zw93-reset{width:clamp(43px,14vh,56px)!important;height:clamp(43px,14vh,56px)!important}
 .zw93 .zw93-hug{width:min(245px,55%);height:min(218px,67%)}
}
@media(max-width:355px) and (orientation:portrait){
 .zw93 .zw93-board{left:2%;width:96%;top:20%;height:57%}
 .zw93 .zw93-controls{left:1%;width:98%;grid-template-columns:30% 37% 33%}
 .zw93 .zw93-directions{width:min(143px,100%)}
 .zw93 .zw93-direction{width:42px!important;height:42px!important}
 .zw93 .zw93-level{width:34px!important;height:34px!important}
 .zw93 .zw93-pick{width:54px!important;height:54px!important}
}
@media(prefers-reduced-motion:reduce){
 .zw93 .zw93-friend img{animation-duration:8s}
 .zw93 .zw93-confetti{animation-duration:5s}
 .zw93 .zw93-confetti.is-balloon{animation-duration:6s}
}

/* V93 touch target fixes: no actor-selection/directional-pad overlap on mobile. */
@media(orientation:portrait){
 .zw93 .zw93-actors{flex-direction:column;justify-content:center;align-items:center;height:100%;gap:5px}
 .zw93 .zw93-pick{width:clamp(52px,16vw,69px)!important;height:clamp(52px,16vw,69px)!important}
 .zw93 .zw93-directions{margin-left:7px}
}
@media(orientation:landscape) and (max-height:650px){
 .zw93 .zw93-actors{flex-direction:row;height:100%}
}
@media(max-width:355px) and (orientation:portrait){
 .zw93 .zw93-controls{grid-template-columns:25% 40% 35%}
 .zw93 .zw93-actors{gap:3px}
 .zw93 .zw93-pick{width:49px!important;height:49px!important}
 .zw93 .zw93-directions{
  width:100%;height:100%;margin:0;aspect-ratio:auto;
  grid-template-columns:repeat(2,1fr);grid-template-rows:repeat(2,1fr);gap:2px;
 }
 .zw93 .zw93-direction{width:46px!important;height:46px!important}
 .zw93 .zw93-direction.zw93-n{grid-column:1;grid-row:1}
 .zw93 .zw93-direction.zw93-e{grid-column:2;grid-row:1}
 .zw93 .zw93-direction.zw93-w{grid-column:1;grid-row:2}
 .zw93 .zw93-direction.zw93-s{grid-column:2;grid-row:2}
 .zw93 .zw93-level{width:38px!important;height:38px!important;margin-left:-3px!important}
 .zw93 .zw93-settings{gap:4px}
 .zw93 .zw93-reset{width:47px!important;height:47px!important}
}
