/* Alternate artwork and framing for narrow screens only. Desktop stays as v14. */
@media (max-width:900px) and (max-aspect-ratio:1/1){
 .on-cover .cover.cover-pearl{min-height:560px;background:linear-gradient(#6eb5f8,#e5d6da 46%,#f2d6be 72%)}
 .on-cover .cover-pearl .cover-backdrop{display:none}
 .on-cover .cover-pearl .cover-art-wrap{
  inset:0 0 auto;width:100%;height:min(calc(100% - var(--controls-height) - 104px),150vw);
  transform:none;mask-image:linear-gradient(#000 98%,transparent);mask-composite:add;
 }
 .on-cover .cover-pearl .cover-art{
  position:absolute;inset:auto auto 0 50%;
  width:min(100%,calc((max(100svh,560px) - var(--controls-height) - 104px) * .78));
  height:auto;object-fit:contain;transform:translateX(-50%);
 }
}
@media (max-width:900px){
 .on-village main{background-image:url('assets/hub-mapa-mobile-v15.webp')}
 .village-map{aspect-ratio:4/7}
 .village-heading{top:8.5%;left:18%;right:18%;height:15%;padding-top:0}
 .village-heading h1{height:calc(100% - 27px)}
 .village-back{top:12px;left:10px}
 .house-entry{height:22%;--label-top:70%}
 .house-1,.house-3,.house-5{--mobile-x:26%}
 .house-2,.house-4,.house-6{--mobile-x:74%}
 .house-1,.house-2{--mobile-top:26%}
 .house-3,.house-4{--mobile-top:47.8%}
 .house-5,.house-6{--mobile-top:70.8%}
 .village-landscape{mask-image:linear-gradient(#000 94%,transparent)}
}