/* Shared controls float over the scenery, with room reserved for the last action. */
.topbar,.on-cover .topbar,.on-village .topbar{background:transparent;border:0;box-shadow:none;backdrop-filter:none;pointer-events:none}
.topbar .tool{pointer-events:auto}
.village-below:empty{display:none}

@media(max-width:900px){
 :root{--credits-height:calc(44px + env(safe-area-inset-bottom,0px));--controls-height:calc(136px + env(safe-area-inset-bottom,0px))}
 body,body.on-cover,body.on-village,body.on-memory,body.on-quiz,body.on-prato,body.on-escova,body.on-amigos,body.on-pintura{padding-bottom:0}
 main,.on-village main,.on-memory main{min-height:100svh;padding-bottom:var(--controls-height)}
 .on-village main{background-image:url('assets/hub-mapa-mobile.webp');background-size:330% auto;background-position:center bottom}
 .village-hub{background:transparent}
 .village-landscape{mask-image:linear-gradient(#000 88%,transparent 100%)}
 .topbar,.on-cover .topbar{bottom:var(--credits-height);min-height:0;padding:6px 8px 10px;gap:0}
 .topbar .tools,.on-cover .tools{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));width:100%;max-width:530px;gap:6px}
 .topbar .tool,.on-cover .tool,.on-village .topbar .tool{min-height:70px;min-width:0;flex-direction:column;justify-content:center;gap:4px;padding:5px 2px;background:#fffaf1f5;border:2px solid #fff9ed;box-shadow:0 3px 0 #9faeb752;border-radius:20px;font-size:.875rem;line-height:1.15}
 .topbar .tool[aria-pressed=true],.on-cover .tool[aria-pressed=true],.on-village .topbar .tool[aria-pressed=true]{background:#e6dcef;border-color:#7754a4}
 body .game-credits{display:flex;flex-direction:row;flex-wrap:nowrap;justify-content:center;gap:4px;padding:0 4px env(safe-area-inset-bottom,0px);min-height:var(--credits-height);background:#fff9eed9;font:clamp(9px,calc(2.5vw + 1px),12px)/1.2 Arial,Helvetica,sans-serif;white-space:nowrap}
 .game-credits span{flex:0 1 auto;min-width:0}
 .game-credits button{flex:0 0 44px;min-width:44px;min-height:44px;font:inherit;padding:0;text-underline-offset:3px}
 .on-cover main{padding-bottom:0}
 .on-cover .cover{height:100svh;min-height:max(130vw,600px)}
 .on-cover .cover-art-wrap{height:100%;max-height:none}
 .on-cover .cover-play{bottom:calc(var(--controls-height) + 18px)}
}

@media(max-width:900px){
 .village-map{width:100%;min-width:0;margin:0;aspect-ratio:2/3}
 .village-heading{top:0;left:20%;right:20%;height:16%;padding-top:3px}
 .village-heading h1{height:calc(100% - 24px)}
 .village-back{top:10px;left:8px;padding:5px 10px;min-height:44px;font-size:.875rem;gap:4px}
 .house-number{display:none}
 .house-entry{left:var(--mobile-x);top:var(--mobile-top);width:44%;height:26.5%;transform:translateX(-50%);--label-top:64.15%}
 .house-1,.house-3,.house-5{--mobile-x:25%}
 .house-2,.house-4,.house-6{--mobile-x:75%}
 .house-1,.house-2{--mobile-top:10.5%}
 .house-3,.house-4{--mobile-top:37.5%}
 .house-5,.house-6{--mobile-top:64.5%}
 .house-label{width:100%;max-width:none;min-width:0;min-height:44px;padding:4px 6px;gap:0;border-width:2px;box-shadow:0 4px 0 var(--house-color),0 6px 0 #7e8c9d33}
 .house-name{font-size:clamp(14px,3.9vw,18px);line-height:1.12;max-width:none}
 /* The completion text stays available to assistive technology; the check remains visible. */
 .house-playable{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
 .house-entry[data-visited=true] .house-label::after{content:'✓';position:absolute;right:0;top:-10px;display:grid;place-items:center;width:22px;height:22px;background:#eff5df;border:2px solid #fffaf0;border-radius:50%;color:#36533c;font:700 14px/1 Arial,sans-serif;box-shadow:0 2px 0 #afbf9d}
 .house-entry:hover .house-label{transform:translateX(-50%)}
 .house-entry:active .house-label{transform:translate(-50%,1px)}
}

@media(max-height:500px) and (max-width:900px) and (min-aspect-ratio:1/1){
 .on-cover .cover{min-height:480px}
}