/* Zählwiese V126 — direct use of approved illustrated, raster-printed source artwork.
   Do NOT paint replacement circles or duplicate text over the nine real picture buttons. */
#app>.zw123-home.zw126-home{
 position:absolute!important;inset:0!important;width:100%!important;height:100%!important;
 display:block!important;overflow:hidden!important;margin:0!important;
 background:#86cceb url('/home-v126/background-portrait.webp') center center / 100% 100% no-repeat!important;
 touch-action:manipulation!important;
}
#app .zw126-home .zw126-scene{
 display:grid!important;
 grid-template-columns:minmax(0,1fr)!important;
 grid-template-rows:minmax(0,40%) minmax(0,54%) minmax(0,6%)!important;
 width:100%!important;max-width:820px!important;height:100%!important;
 position:relative!important;margin:auto!important;padding:0 1%!important;
 min-height:0!important;min-width:0!important;
}
#app .zw126-home .zw126-hero{
 grid-column:1!important;grid-row:1!important;
 position:relative!important;width:100%!important;height:100%!important;min-height:0!important;
 z-index:4!important;pointer-events:none!important;
}
#app .zw126-home .zw126-title{
 position:absolute!important;display:block!important;z-index:3!important;
 top:0!important;left:10%!important;width:80%!important;height:35%!important;
 object-fit:contain!important;filter:drop-shadow(0 3px 2px #604d3260)!important;
 pointer-events:none!important;
}
#app .zw126-home .zw126-settings{
 all:unset!important;box-sizing:border-box!important;position:absolute!important;display:block!important;
 top:3%!important;right:1%!important;z-index:12!important;
 width:clamp(56px,13vw,85px)!important;height:clamp(56px,13vw,85px)!important;
 border-radius:50%!important;touch-action:manipulation!important;cursor:pointer!important;
 pointer-events:auto!important;filter:drop-shadow(0 3px 2px #65482f68)!important;
}
#app .zw126-home .zw126-settings img{
 display:block!important;width:100%!important;height:100%!important;object-fit:contain!important;
}
#app .zw126-home .zw126-playground{
 position:absolute!important;z-index:5!important;left:50%!important;bottom:-6%!important;
 height:min(80%,calc(100vw * .70))!important;width:auto!important;
 aspect-ratio:1100/825!important;transform:translateX(-50%)!important;
 max-width:100%!important;isolation:isolate!important;pointer-events:none!important;
}
#app .zw126-home .zw126-foot{
 position:absolute!important;inset:0!important;z-index:3!important;
 width:100%!important;height:100%!important;object-fit:contain!important;pointer-events:none!important;
 filter:drop-shadow(0 4px 2px #72664066)!important;
}
#app .zw126-home .zw126-seesaw{
 all:unset!important;box-sizing:border-box!important;display:block!important;
 position:absolute!important;inset:0!important;width:100%!important;height:100%!important;
 cursor:pointer!important;pointer-events:auto!important;touch-action:manipulation!important;
 border:0!important;background:none!important;z-index:8!important;
}
#app .zw126-home .zw126-lever{
 position:absolute!important;display:block!important;inset:0!important;z-index:5!important;
 width:100%!important;height:100%!important;
 transform:rotate(-2deg);transform-origin:49.655% 65.285%!important;
 animation:zw126-idle 6.8s ease-in-out infinite!important;
 will-change:transform!important;pointer-events:none!important;
}
#app .zw126-home .zw126-top{
 position:absolute!important;inset:0!important;width:100%!important;height:100%!important;
 display:block!important;object-fit:contain!important;pointer-events:none!important;
 filter:drop-shadow(0 3px 2px #69553d5a)!important;
}
#app .zw126-home .zw126-seesaw.zw-seesaw-tapped .zw126-lever{
 animation:zw126-rock 2.5s cubic-bezier(.3,.67,.3,1) both!important;
}
@keyframes zw126-idle{
 0%,100%{transform:rotate(-2deg)}
 50%{transform:rotate(1.5deg)}
}
@keyframes zw126-rock{
 0%{transform:rotate(-3deg)}
 17%{transform:rotate(10deg)}
 36%{transform:rotate(-10deg)}
 57%{transform:rotate(8deg)}
 75%{transform:rotate(-6deg)}
 100%{transform:rotate(-2deg)}
}
#app .zw126-home .zw123-joy{
 position:absolute!important;z-index:16!important;inset:0!important;
 display:block!important;pointer-events:none!important;overflow:visible!important;
}
#app .zw126-home .zw126-board{
 grid-column:1!important;grid-row:2!important;position:relative!important;
 display:flex!important;align-items:center!important;justify-content:center!important;
 width:100%!important;height:100%!important;min-width:0!important;min-height:0!important;
 margin:0!important;padding:0!important;z-index:6!important;
}
#app .zw126-home .zw126-artboard{
 position:relative!important;display:block!important;
 width:min(100%,calc(100dvh * .54 * 918 / 872))!important;
 max-width:100%!important;max-height:100%!important;
 height:auto!important;aspect-ratio:918/872!important;
 margin:auto!important;
 filter:drop-shadow(0 4px 3px #62533955)!important;
}
#app .zw126-home .zw126-board-image{
 position:absolute!important;inset:0!important;width:100%!important;height:100%!important;
 display:block!important;object-fit:fill!important;
 pointer-events:none!important;
}
#app .zw126-home .zw126-grid{
 position:absolute!important;z-index:5!important;inset:0!important;
 display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;
 grid-template-rows:repeat(3,minmax(0,1fr))!important;
 width:100%!important;height:100%!important;gap:0!important;padding:3.5% 4.1% 2.7%!important;
}
#app .zw126-home .zw126-tile{
 all:unset!important;box-sizing:border-box!important;
 display:block!important;position:relative!important;
 width:100%!important;height:100%!important;
 min-width:0!important;min-height:0!important;
 margin:0!important;padding:0!important;z-index:3!important;
 background:none!important;border:0!important;border-radius:43%!important;
 box-shadow:none!important;cursor:pointer!important;touch-action:manipulation!important;
 -webkit-tap-highlight-color:transparent!important;
 transition:transform .16s ease,filter .16s ease!important;
}
#app .zw126-home .zw126-tile::before,#app .zw126-home .zw126-tile::after{
 display:none!important;content:none!important;
}
#app .zw126-home .zw126-tile:active{
 transform:scale(.93) translateY(2px)!important;
 filter:brightness(1.1)!important;
}
#app .zw126-home .zw126-tile:focus-visible,
#app .zw126-home .zw126-settings:focus-visible,
#app .zw126-home .zw126-seesaw:focus-visible{
 outline:4px solid #fff0a0!important;outline-offset:-4px!important;border-radius:34%!important;
}
#app .zw126-home .zw126-sr{
 position:absolute!important;width:1px!important;height:1px!important;margin:-1px!important;
 padding:0!important;border:0!important;white-space:nowrap!important;overflow:hidden!important;
 clip:rect(0,0,0,0)!important;
}
#app .zw126-home .zw126-footer{
 grid-column:1!important;grid-row:3!important;display:flex!important;
 align-items:center!important;justify-content:center!important;
 height:100%!important;width:100%!important;
 margin:0!important;padding:0!important;
}
#app .zw126-home .zw126-footer img{
 display:block!important;height:82%!important;width:77%!important;max-width:350px!important;
 object-fit:contain!important;filter:drop-shadow(0 2px 1px #59483055)!important;
}
/* Wider devices keep original illustrated scenery proportions and avoid stretching buttons. */
@media(orientation:landscape){
 #app>.zw123-home.zw126-home{
  background-image:url('/home-v126/background-landscape.webp')!important;
  background-size:100% 100%!important;
 }
 #app .zw126-home .zw126-scene{
  max-width:1440px!important;
  grid-template-columns:minmax(0,47%) minmax(0,53%)!important;
  grid-template-rows:minmax(0,93%) minmax(0,7%)!important;
 }
 #app .zw126-home .zw126-hero{grid-column:1!important;grid-row:1!important;}
 #app .zw126-home .zw126-title{left:11%!important;width:79%!important;top:0!important;height:30%!important;}
 #app .zw126-home .zw126-settings{
  top:2%!important;right:1%!important;
  width:clamp(48px,12vh,68px)!important;height:clamp(48px,12vh,68px)!important;
 }
 #app .zw126-home .zw126-playground{
  height:76%!important;width:auto!important;max-width:100%!important;bottom:-3%!important;
 }
 #app .zw126-home .zw126-board{grid-column:2!important;grid-row:1!important;}
 #app .zw126-home .zw126-artboard{
  width:min(100%,calc(100dvh * .93 * 918 / 872))!important;
 }
 #app .zw126-home .zw126-footer{grid-column:1 / 3!important;grid-row:2!important;}
 #app .zw126-home .zw126-footer img{width:26%!important;height:90%!important}
}
@media(orientation:portrait) and (max-width:355px){
 #app .zw126-home .zw126-scene{
  grid-template-rows:minmax(0,38%) minmax(0,56%) minmax(0,6%)!important;
 }
 #app .zw126-home .zw126-title{left:9%!important;width:82%!important;height:34%!important}
 #app .zw126-home .zw126-settings{
  top:2%!important;right:1%!important;width:51px!important;height:51px!important;
 }
 #app .zw126-home .zw126-playground{height:75%!important}
 #app .zw126-home .zw126-artboard{width:min(100%,calc(100dvh * .56 * 918 / 872))!important;}
}
@media(prefers-reduced-motion:reduce){
 #app .zw126-home .zw126-lever{animation:none!important;transform:rotate(-2deg)!important}
 #app .zw126-home .zw126-seesaw.zw-seesaw-tapped .zw126-lever{animation:zw126-rock 3s ease both!important}
 #app .zw126-home .zw126-tile{transition:none!important}
}