/* ZÄHLWIESE v110 – gezielter Kinder-UX-Feinschliff.
   Bewahrt die freigegebene handgezeichnete Startseite und sämtliche Spielwelten. */

/* Spiel-Auswahl: Originalillustrationen niemals verdecken oder künstlich ersetzen. */
#app .zw80-home .zw80-tile {
 -webkit-tap-highlight-color:transparent!important;
 touch-action:manipulation!important;
 -webkit-user-select:none!important;user-select:none!important;
 transform-origin:50% 65%;
}
#app .zw80-home .zw80-tile:focus-visible,
#app .zw80-home .zw80-settings:focus-visible,
#app .zw80-home .zw80-wippe:focus-visible{
 outline:4px solid #fff6b5!important;outline-offset:3px!important;
 filter:drop-shadow(0 0 5px rgba(73,116,68,.7))!important;
}
#app .zw80-home .zw80-tile:active {
 transform:translateY(2px) scale(.956)!important;
 filter:brightness(1.045)!important;
}
#app .zw80-home #choosePicnic img,
#app .zw80-home #chooseMemory img{
 object-fit:contain!important;
 filter:drop-shadow(0 3px 2px rgba(78,61,42,.24))!important;
}

/* A gentle tactile press and clear keyboard focus across storybook choice screens. */
#app button.zw106-choice,
#app button.zw91-coin,
#app button.zw91-bubble,
#app button.zw95-hunt-bubble,
#app button.zw107-food-button,
#app .memory100-page button{
 -webkit-tap-highlight-color:transparent!important;
 touch-action:manipulation!important;
 -webkit-user-select:none!important;user-select:none!important;
}
#app button.zw106-choice:focus-visible,
#app button.zw91-coin:focus-visible,
#app button.zw91-bubble:focus-visible,
#app button.zw95-hunt-bubble:focus-visible,
#app button.zw107-food-button:focus-visible,
#app .memory100-page button:focus-visible,
#app #zw95Restart:focus-visible,
#app #homeBtn:focus-visible{
 outline:4px solid #fff2a1!important;
 outline-offset:3px!important;
 border-radius:22px;
}
#app button.zw106-choice:active,
#app button.zw91-coin:active,
#app button.zw107-food-button:active{
 filter:brightness(1.085) drop-shadow(0 2px 1px rgba(72,54,32,.28))!important;
}
#app .zw91-bubble:active,
#app .zw95-hunt-bubble:active {filter:brightness(1.14)!important;}
#app #homeBtn,#app #zw95Restart{
 touch-action:manipulation!important;
 -webkit-tap-highlight-color:transparent!important;
}
#app #homeBtn:active,#app #zw95Restart:active{filter:brightness(1.1)!important;}

/* Memory gehört sichtbar zur gleichen gemalten Gartenwelt wie die übrigen Spiele. */
#app:has(.memory100-page){background:#88bd88!important;overflow:hidden!important}
#app .memory100-page.main-content{
 position:absolute!important;inset:0!important;
 width:100%!important;max-width:none!important;
 height:100%!important;min-height:0!important;
 box-sizing:border-box!important;
 overflow:hidden!important;
 padding:max(78px,calc(env(safe-area-inset-top,0px) + 66px))
         max(12px,env(safe-area-inset-right,0px))
         max(16px,env(safe-area-inset-bottom,0px))
         max(12px,env(safe-area-inset-left,0px))!important;
 background:#9acaa0 url('/garden-games-v94/garden-portrait.webp') center/100% 100% no-repeat!important;
 font-family:'Segoe Print','Chalkboard SE','Marker Felt',sans-serif!important;
 gap:clamp(7px,1.6dvh,13px)!important;
}
#app .memory100-page h1{
 text-align:center!important;
 color:#75523b!important;
 text-shadow:0 1px 0 #fff9e5!important;
 font:900 clamp(24px,6.4vw,37px)/1.1 'Segoe Print','Chalkboard SE',sans-serif!important;
}
#app .memory100-select{
 justify-content:flex-start!important;
 align-items:center!important;
}
#app .memory100-select h1{
 display:grid!important;place-items:center!important;
 width:min(100%,345px)!important;
 min-height:68px!important;
 padding:12px 16px!important;
 margin:0 auto 3px!important;
 background:url('/storybook-games-v91/choice-board.webp') center/100% 100% no-repeat!important;
 filter:drop-shadow(0 4px 2px #4f40285e);
}
#app .memory100-chooser{
 width:min(100%,450px)!important;
 margin:clamp(8px,3dvh,28px) auto 0!important;
 gap:clamp(9px,2vw,30px)!important;
}
#app .memory100-chooser>button{
 padding:7px 4px!important;
 min-width:0!important;
 width:min(47%,180px)!important;
 gap:8px!important;
 font:900 clamp(18px,4vw,24px)/1.25 'Segoe Print','Chalkboard SE',sans-serif!important;
 color:#79553b!important;
 text-shadow:0 1px 0 #fffbe9;
 border-radius:24px!important;
 transition:filter .18s ease,transform .18s ease!important;
}
#app .memory100-chooser>button:active{transform:scale(.957)!important;filter:brightness(1.06)!important;}
#app .memory100-choice-ring{
 width:clamp(118px,35vw,172px)!important;
 height:clamp(118px,35vw,172px)!important;
 border:6px solid #b48a65!important;
 background:#f4e3bf url('/storybook-games-v91/choice-board.webp') center/cover no-repeat!important;
 box-shadow:inset 0 0 0 3px #f6e9cb,0 5px 3px rgba(92,64,42,.22)!important;
 overflow:hidden!important;
}
#app .memory100-choice-ring>*{position:relative;z-index:1}
#app .memory100-choice-digits{font-size:clamp(49px,14vw,67px)!important;}
#app .memory100-choice-ring img{width:94%!important;height:94%!important;}
#app .memory100-greeting{display:none!important;}

/* Gameplay: illustrated surface, clear level counter and painted round controls. */
#app .memory100-game .memory100-header{
 width:min(100%,520px)!important;z-index:1!important;
}
#app .memory100-game .memory100-header h1{
 padding:10px 16px!important;
 min-height:46px!important;
 background:url('/storybook-games-v91/choice-board.webp') center/100% 100% no-repeat!important;
}
#app .memory100-level{
 background:#f8eccf!important;
 border:3px solid #b48c68!important;
 border-radius:22px!important;
 box-shadow:0 3px 2px rgba(81,53,29,.22)!important;
}
#app .memory100-game .memory100-grid{
 max-width:min(100%,470px)!important;
 margin:clamp(5px,2dvh,19px) auto 0!important;
}
#app .memory100-card:focus-visible{outline-offset:2px!important;border-radius:12px!important}
#app .memory100-controls{margin:clamp(6px,1.5dvh,14px) auto 0!important;gap:clamp(20px,6vw,40px)!important;}
#app .memory100-controls button{
 width:clamp(60px,15vw,76px)!important;height:clamp(60px,15vw,76px)!important;
 border:0!important;border-radius:50%!important;
 font-size:0!important;color:transparent!important;
 background:#f6dbac url('/cuddle-maze-v93/retry.webp') center/100% 100% no-repeat!important;
 box-shadow:0 3px 2px rgba(67,51,29,.28)!important;
 transition:transform .18s ease,filter .18s ease!important;
}
#app .memory100-controls button:last-child{
 background-image:url('/labyrinth-gallery-v106/zahlen-memory.webp')!important;
}
#app .memory100-controls button:active{transform:scale(.92)!important;filter:brightness(1.1)!important;}

/* Short portrait devices: fit all 20 animal cards without game scrolling. */
@media (orientation:portrait) and (max-height:700px){
 #app .memory100-page.main-content{padding-top:max(64px,calc(env(safe-area-inset-top,0px) + 56px))!important;gap:4px!important}
 #app .memory100-game .memory100-header h1{padding:5px 10px!important;min-height:40px!important}
 #app .memory100-game .memory100-grid{margin:3px auto!important;gap:4px!important}
 #app .memory100-game .memory100-card{aspect-ratio:1!important;max-height:clamp(47px,9.2dvh,65px)!important}
 #app .memory100-game .memory100-controls{margin:2px auto 0!important}
 #app .memory100-controls button{width:52px!important;height:52px!important}
}
/* Landscape: use the whole screen, never the old beige half-width column. */
@media (orientation:landscape) and (max-height:650px){
 #app .memory100-page.main-content{
  background-image:url('/garden-games-v94/garden-landscape.webp')!important;
  padding:max(27px,env(safe-area-inset-top,0px))
          max(26px,env(safe-area-inset-right,0px))
          max(10px,env(safe-area-inset-bottom,0px))
          max(82px,calc(env(safe-area-inset-left,0px) + 75px))!important;
  gap:clamp(8px,2vw,25px)!important;
 }
 #app .memory100-page.memory100-select{
  display:grid!important;
  grid-template-columns:minmax(170px,1fr) minmax(320px,1.65fr)!important;
  grid-template-rows:minmax(0,1fr)!important;
  align-items:center!important;justify-items:center!important;
 }
 #app .memory100-select h1{width:100%!important;grid-column:1!important;grid-row:1!important;
  min-height:clamp(64px,18dvh,110px)!important;font-size:clamp(22px,3vw,35px)!important}
 #app .memory100-chooser{
  grid-column:2!important;grid-row:1!important;
  margin:0!important;
  width:100%!important;gap:clamp(8px,2vw,27px)!important;
 }
 #app .memory100-choice-ring{
  width:clamp(105px,31dvh,146px)!important;height:clamp(105px,31dvh,146px)!important;
 }
 #app .memory100-choice-digits{font-size:clamp(44px,15dvh,65px)!important;}
 #app .memory100-chooser>button{width:48%!important;font-size:clamp(15px,4dvh,21px)!important;}
 #app .memory100-page.memory100-game{
  display:grid!important;
  grid-template-columns:minmax(140px,28%) minmax(0,1fr)!important;
  grid-template-rows:minmax(0,1fr) auto!important;
  align-items:center!important;justify-items:center!important;
 }
 #app .memory100-game .memory100-header{
  grid-column:1!important;grid-row:1!important;
  display:flex!important;flex-direction:column!important;
  gap:9px!important;align-items:center!important;justify-content:center!important;
  width:100%!important;align-self:center!important;
 }
 #app .memory100-game .memory100-header h1{width:100%!important;padding:10px 8px!important;font-size:clamp(22px,5dvh,31px)!important}
 #app .memory100-level{margin:auto!important;}
 #app .memory100-game .memory100-grid{
  grid-column:2!important;grid-row:1/3!important;
  width:min(100%,560px)!important;max-width:none!important;
  grid-template-columns:repeat(5,minmax(0,1fr))!important;
  gap:5px!important;align-self:center!important;justify-self:center!important;
  margin:0 auto!important;
 }
 #app .memory100-game .memory100-grid .memory100-card{
  width:100%!important;aspect-ratio:1!important;max-height:clamp(50px,17.5dvh,69px)!important;
 }
 #app .memory100-game .memory100-controls{
  grid-column:1!important;grid-row:2!important;
  justify-self:center!important;margin:0 auto!important;gap:14px!important;
 }
 #app .memory100-controls button{width:clamp(50px,14dvh,63px)!important;height:clamp(50px,14dvh,63px)!important;}
}
/* Sensory-friendly: no needless motion, but all choices remain fully usable. */
@media (prefers-reduced-motion:reduce){
 #app .zw80-home .zw80-tile,
 #app .memory100-controls button,
 #app .memory100-chooser>button{transition:none!important}
}

/* MEMORY_FACE_FIX: Safari must not show a hidden front face.
   Explicit 2D card states are more reliable than WebKit 3D backface rendering. */
#app .memory100-card .memory100-inner{
 transform:none!important;transform-style:flat!important;
 transition:none!important;perspective:none!important;
}
#app .memory100-card .memory100-back,
#app .memory100-card .memory100-front{
 transform:none!important;-webkit-backface-visibility:visible!important;
 backface-visibility:visible!important;
 transition:opacity .24s ease,visibility .24s ease!important;
}
#app .memory100-card .memory100-back{
 z-index:2!important;opacity:1!important;visibility:visible!important;
}
#app .memory100-card .memory100-front{
 z-index:1!important;opacity:0!important;visibility:hidden!important;
}
#app .memory100-card.is-flipped .memory100-back,
#app .memory100-card.is-matched .memory100-back{
 opacity:0!important;visibility:hidden!important;z-index:1!important;
}
#app .memory100-card.is-flipped .memory100-front,
#app .memory100-card.is-matched .memory100-front{
 opacity:1!important;visibility:visible!important;z-index:2!important;
}
/* Keep toddler targets separate: the game's two illustrated controls replace the
   global floating restart button, which otherwise covers the bottom-right card. */
#app:has(.memory100-page) #zw95Restart{display:none!important}
/* A legacy car-maze rule had disabled Memory's own Restart button. */
#app:has(.memory100-game) .memory100-controls #memory100Restart{display:block!important;}
@media(prefers-reduced-motion:reduce){
 #app .memory100-card .memory100-back,
 #app .memory100-card .memory100-front{transition:none!important}
}