/* Memory 219 — responsive to the REAL narrow play surface, not the outer desktop window.
   No additional launch screen; these are actual painted and clickable game buttons. */
#app .memory127-page.memory218-select{
 background-repeat:no-repeat!important;
}
/* Refine three drawn mode buttons, retaining proper round proportions and labels. */
#app .memory218-select .memory218-choices{
 left:1.5%!important;width:97%!important;
 top:54.2%!important;height:28.5%!important;
 gap:clamp(1px,.6vw,8px)!important;
}
#app .memory218-select .memory218-choice{
 min-width:0!important;min-height:0!important;
 overflow:visible!important;border:0!important;
 outline-offset:1px!important;
}
#app .memory218-select .memory218-choice img{
 width:100%!important;height:100%!important;
 object-fit:contain!important;
 object-position:50% 50%!important;
 filter:drop-shadow(0 4px 2px #61442c70)!important;
 transform:translateZ(0) scale(1)!important;
 transition:transform .19s cubic-bezier(.2,.8,.3,1.25),filter .19s ease!important;
}
#app .memory218-select .memory218-choice:active img{
 transform:translateY(2px) scale(.92)!important;
 filter:drop-shadow(0 1px 1px #61442c65) brightness(1.06)!important;
}
#app .memory218-select .memory218-choice:focus-visible{
 outline:4px solid #fff1a3!important;outline-offset:2px!important;
 border-radius:28px!important;
}
@media(hover:hover) and (pointer:fine){
 #app .memory218-select .memory218-choice:hover img{
  transform:translateY(-5px) scale(1.045)!important;
  filter:drop-shadow(0 7px 4px #61442c70) brightness(1.035)!important;
 }
 #app .memory218-select .memory218-choice:active img{
  transform:translateY(1px) scale(.94)!important;
 }
}
/* A browser on desktop can be landscape outside while the actual game stays
   414px-wide portrait inside. Treat that narrow app as portrait. */
@media(orientation:landscape) and (min-height:540px){
 #app .memory127-page.memory218-select{
   background-image:url('/home-v126/background-portrait.webp')!important;
   background-size:100% 100%!important;
 }
 #app .memory218-select .memory218-title{
   left:17%!important;top:3%!important;width:65%!important;height:9.2%!important;
   font-size:clamp(28px,7vw,42px)!important;
 }
 #app .memory218-select .memory218-heroes{
   left:2%!important;top:17%!important;width:96%!important;height:31%!important;
   display:flex!important;justify-content:space-between!important;
 }
 #app .memory218-select .memory218-hero{
   width:50%!important;height:100%!important;flex:0 0 50%!important;
 }
 #app .memory218-select .memory218-choices{
   display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;
   flex-direction:row!important;align-items:center!important;
   left:1.5%!important;top:54.2%!important;
   width:97%!important;height:28.5%!important;gap:2px!important;
 }
 #app .memory218-select .memory218-choice{
   display:grid!important;place-items:center!important;
   width:100%!important;height:100%!important;min-width:0!important;min-height:0!important;
 }
 #app .memory218-select .memory218-hint{
   left:50%!important;bottom:6.8%!important;top:auto!important;
   font-size:clamp(13px,3.4vw,20px)!important;
   padding:9px 13px!important;
 }
}
/* True phone landscape: use the wider three-button row, not the desktop portrait override. */
@media(orientation:landscape) and (max-height:539px){
 #app .memory218-select .memory218-choices{
  left:40%!important;top:21%!important;width:58%!important;height:62%!important;
  display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:2px!important;
 }
}
@media(orientation:portrait) and (max-height:650px){
 #app .memory218-select .memory218-choices{
  top:52.5%!important;height:30%!important;
 }
}
@media(prefers-reduced-motion:reduce){
 #app .memory218-select .memory218-choice img{transition:none!important}
}

/* Home button belongs to the centered app, never the outer desktop viewport. */
#app:has(.memory218-select) #homeBtn{
 position:absolute!important;top:6px!important;right:8px!important;left:auto!important;
 z-index:60!important;
}

/* Do not stretch the tall phone illustration across a wide phone in landscape. */
@media (min-width:650px) and (max-height:539px){
 #app .memory127-page.memory218-select.memory127-select{
  background-image:url('/home-v126/background-landscape.webp')!important;
  background-size:cover!important;background-position:center center!important;
 }
}