/* Zählwiese v82 – the same hand-painted stage, hero and game medallions
   in portrait and landscape. Original game references and all IDs unchanged. */
@media (orientation: portrait) {
 #app:has(>.zw80-home){
  background:#a0ca82!important;
  overflow:hidden!important;
 }
 #app>.zw80-home{
  width:100%!important;height:100%!important;
  max-width:none!important;max-height:100%!important;
  background-color:#8ec077!important;
  background-image:url('/home-v82/portrait-stage.webp')!important;
  background-position:center center!important;
  background-size:100% 100%!important;
  background-repeat:no-repeat!important;
  padding:max(3px,env(safe-area-inset-top,0px)) max(5px,env(safe-area-inset-right,0px))
          max(3px,env(safe-area-inset-bottom,0px)) max(5px,env(safe-area-inset-left,0px))!important;
 }
 .zw80-home .zw80-scene{
  position:relative!important;
  width:100%!important;height:100%!important;
  min-width:0!important;min-height:0!important;
  max-width:min(100%,680px)!important;max-height:none!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr)!important;
  grid-template-rows:minmax(0,31%) minmax(0,63%) minmax(0,6%)!important;
  align-items:center!important;justify-items:center!important;
  gap:0!important;padding:0!important;margin:0 auto!important;
  overflow:hidden!important;
  isolation:isolate;
 }
 .zw80-home .zw80-original-portrait{
  display:none!important;visibility:hidden!important;
 }
 .zw80-home .zw80-hero{
  position:relative!important;
  grid-column:1!important;grid-row:1!important;
  display:block!important;
  width:min(100%,52dvh)!important;
  height:auto!important;min-width:0!important;min-height:0!important;
  max-width:100%!important;max-height:100%!important;
  aspect-ratio:1024/614!important;
  align-self:center!important;justify-self:center!important;
  margin:0!important;padding:0!important;
  border:0!important;box-shadow:none!important;border-radius:0!important;
  overflow:visible!important;transform:none!important;
  background:transparent url('/home-v81/hero-seamless.webp') center/contain no-repeat!important;
 }
 .zw80-home .zw80-hero-img{
  display:block!important;
  visibility:hidden!important;
  width:100%!important;height:100%!important;
  pointer-events:none!important;
 }
 .zw80-home .zw80-settings{
  display:block!important;position:absolute!important;
  left:1.8%!important;top:2.3%!important;
  width:13%!important;height:23%!important;
  padding:0!important;margin:0!important;
  background:transparent url('/home-v81/settings-exact.webp') center/contain no-repeat!important;
  border:0!important;border-radius:50%!important;
  z-index:10!important;
  filter:drop-shadow(0 2px 2px #644d3b55)!important;
 }
 .zw80-home .zw80-wippe{
  position:absolute!important;
  left:21%!important;top:54%!important;
  width:56%!important;height:46%!important;
  padding:0!important;margin:0!important;
  z-index:10!important;
  border:0!important;background:transparent!important;
 }
 .zw80-home .zw80-grid{
  position:relative!important;
  grid-column:1!important;grid-row:2!important;
  display:grid!important;
  width:100%!important;height:100%!important;
  min-height:0!important;max-height:100%!important;
  min-width:0!important;max-width:none!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  grid-template-rows:repeat(3,minmax(0,1fr))!important;
  gap:clamp(1px,.5dvh,8px) clamp(1px,1.1vw,10px)!important;
  padding:clamp(9px,1.6dvh,18px) clamp(5px,1.5vw,15px)!important;
  margin:0!important;
  border:clamp(3px,.85vw,5px) solid #785b36!important;
  border-radius:clamp(18px,6vw,34px)!important;
  background:linear-gradient(165deg,rgba(250,240,202,.97),rgba(236,219,163,.97))!important;
  box-shadow:inset 0 0 0 4px #fff6d5b0,0 5px 0 #5f70383a,0 10px 15px #405d3330!important;
  pointer-events:auto!important;
  overflow:hidden!important;
 }
 .zw80-home .zw80-grid::before{
  content:"";position:absolute;inset:9px;
  border:2px dashed #be9c6e55;
  border-radius:clamp(12px,4vw,24px);
  z-index:0;pointer-events:none;
 }
 .zw80-home .zw80-tile{
  all:unset;box-sizing:border-box!important;
  position:relative!important;
  display:flex!important;align-items:center!important;justify-content:center!important;
  grid-column:auto!important;grid-row:auto!important;
  width:100%!important;height:100%!important;
  min-width:0!important;min-height:0!important;
  border-radius:18px!important;
  padding:0!important;margin:0!important;
  background:transparent!important;border:0!important;box-shadow:none!important;
  pointer-events:auto!important;cursor:pointer!important;
  touch-action:manipulation!important;
  transition:transform .18s ease!important;
 }
 .zw80-home .zw80-tile img{
  display:block!important;
  width:100%!important;height:100%!important;
  min-height:0!important;min-width:0!important;
  max-width:100%!important;max-height:100%!important;
  object-fit:contain!important;
  pointer-events:none!important;
  filter:drop-shadow(0 2px 1px #85614444)!important;
 }
 .zw80-home .zw80-tile:active{transform:scale(.95)!important}
 .zw80-home .zw80-tile:focus-visible{
  outline:3px solid #fff0a5!important;
  outline-offset:1px!important;
 }
 .zw80-home .zw80-footer{
  grid-column:1!important;grid-row:3!important;
  position:relative!important;
  display:flex!important;align-items:center!important;justify-content:center!important;
  width:min(73%,420px)!important;height:100%!important;
  max-width:100%!important;max-height:100%!important;
  padding:0!important;margin:0!important;
  border:0!important;box-shadow:none!important;background:transparent!important;
 }
 .zw80-home .zw80-footer img{
  display:block!important;width:100%!important;height:100%!important;
  object-fit:contain!important;pointer-events:none!important;
 }
}
@media (orientation:portrait) and (max-width:359px){
 .zw80-home .zw80-grid{padding:6px 3px!important;gap:0!important;border-width:3px!important}
 .zw80-home .zw80-hero{width:min(100%,53dvh)!important}
 .zw80-home .zw80-footer{width:min(80%,320px)!important}
}
@media (prefers-reduced-motion:reduce){
 .zw80-home .zw80-tile{transition:none!important}
}

/* Override legacy positional :nth-child hotspot rules from portrait v80. */
@media(orientation:portrait){
 .zw80-home .zw80-grid > .zw80-tile:nth-child(n){
  position:relative!important;
  left:auto!important;top:auto!important;right:auto!important;bottom:auto!important;
  width:100%!important;height:100%!important;
  min-width:0!important;min-height:0!important;
  transform:none;
 }
 .zw80-home .zw80-grid > .zw80-tile:nth-child(n):active{
  transform:scale(.95)!important;
 }
}