/* The 3D landscape gets the full canvas; plot tools open only when needed. */
body[data-angle=tilt][data-mode=map] .map-panel{display:none}
body.village-filters-open[data-angle=tilt][data-mode=map] .map-panel{display:block;top:190px;z-index:6;max-height:calc(100vh - 290px);overflow:auto}
body.village-filters-open[data-angle=tilt] .map-panel h1,body.village-filters-open[data-angle=tilt] .map-panel .plan-stats{display:none}
body[data-angle=tilt][data-mode=map] .shade{background:linear-gradient(180deg,#15372d1c,transparent 35%),linear-gradient(0deg,#132e303b,transparent 22%)}
.village-presentation{position:fixed;inset:0;pointer-events:none;z-index:3;color:#18382f}
.village-presentation[hidden]{display:none}
.village-story{position:absolute;left:3.5%;top:132px;text-shadow:0 1px 12px #f4f5e9b3}
.village-story>span{font-size:8px;letter-spacing:2px}
.village-story h1{font-family:Georgia,serif;font-weight:400;line-height:1.02;font-size:clamp(37px,4.4vw,66px);letter-spacing:-2px;margin:19px 0 15px}
.village-story em{font-weight:400;color:#49624c}
.village-story p{font-size:10px;letter-spacing:.3px;margin:0;color:#53694f}
#village-filters{position:absolute;top:130px;right:136px;pointer-events:auto;background:#f5f5eae6;backdrop-filter:blur(14px);font-size:10px;padding:13px 17px;border-radius:4px;color:#254334;border:1px solid #fff8}
.village-views{position:absolute;bottom:112px;left:50%;transform:translateX(-50%);display:flex;gap:3px;padding:5px;background:#16382dda;backdrop-filter:blur(16px);border:1px solid #ffffff52;border-radius:5px;pointer-events:auto}
.village-views button{padding:13px 19px;background:transparent;color:#e0e8d6;border-radius:3px;font-size:11px;white-space:nowrap}
.village-views small{font-size:8px;margin-right:9px;opacity:.55}
.village-views button.active{background:#f0f0df;color:#233e2e}
body[data-angle=tilt][data-mode=map] .spatial-note{display:none!important}
body[data-angle=tilt][data-mode=map] .minimap{bottom:190px;width:125px;height:57px}
body[data-angle=tilt][data-mode=map] footer #hint{display:none}
body[data-angle=tilt][data-mode=map] .demo-note{background:#eef0e3cc;border-radius:3px;padding:3px 6px;color:#52624d;font-size:6px;max-width:90%}
body[data-angle=tilt][data-mode=map] .parcel-label:not(.chosen){font-size:9px;padding:5px 7px;background:#f7f5e8e6;border-color:#ffffff66;color:#304d39}
body.village-filters-open[data-angle=tilt][data-mode=map] .village-story{display:none}
@media(max-width:900px){.village-story h1{font-size:40px}.village-views button{padding:12px 14px;font-size:10px}.village-views small{margin-right:6px}#village-filters{top:172px;right:3.5%}}
@media(max-width:700px){
 .village-story{left:18px;top:110px}.village-story>span{font-size:6px;letter-spacing:1.5px}.village-story h1{font-size:35px;letter-spacing:-1px;margin:13px 0 12px}.village-story p{font-size:8px}
 #village-filters{right:14px;top:109px;padding:10px 11px;font-size:8px;max-width:125px}
 body[data-angle=tilt][data-mode=map] .top-right{top:155px!important;bottom:auto!important;right:14px!important}
 .village-views{bottom:112px;left:14px;right:14px;transform:none;gap:1px;justify-content:stretch}
 .village-views button{flex:1;padding:12px 7px;white-space:normal;font-size:9px;line-height:1.5}.village-views small{display:block;margin:0 0 3px}
 body.village-filters-open[data-angle=tilt][data-mode=map] .map-panel{top:156px;left:14px;right:14px;max-height:calc(100vh - 330px)}
 body.village-filters-open[data-angle=tilt][data-mode=map] .top-right{top:109px!important}
 body[data-angle=tilt][data-mode=map] .map-tools{top:43%;right:14px}
}

body[data-angle=tilt][data-mode=map] .village-story{color:#f6f4e7;text-shadow:0 2px 20px #152c36a6}
body[data-angle=tilt][data-mode=map] .village-story em{color:#e2e6ca}
body[data-angle=tilt][data-mode=map] .village-story p{color:#e1e5d7}

@media(max-width:700px){.village-story{top:122px}#village-filters{top:122px}body[data-angle=tilt][data-mode=map] .top-right{top:166px!important}}

@media(max-width:700px){body[data-angle=tilt] .view-switch{display:grid;grid-template-columns:1fr 1fr 1.25fr;width:100%}body[data-angle=tilt] .view-switch button{font-size:9px;padding:12px 5px}body[data-angle=tilt] .view-switch button span{font-size:12px;margin-right:3px}}

/* Status controls stay visible on the 3D map, including vacant and sold plots. */
.village-statuses{display:flex;gap:4px;margin-top:19px;padding:5px;width:max-content;max-width:calc(100vw - 40px);background:#f5f4eaeF;border:1px solid #ffffff9c;border-radius:5px;pointer-events:auto;text-shadow:none;backdrop-filter:blur(14px)}
.village-statuses button{display:flex;align-items:center;gap:6px;padding:10px 11px;font-size:10px;background:none;color:#244035;border-radius:3px;white-space:nowrap}
.village-statuses button.active{background:#244638;color:#fff}.village-statuses b{font-weight:500;opacity:.65;font-size:9px}
.status-dot{display:inline-block;width:9px;height:9px;border-radius:2px;border:1px solid #29403525}.status-dot.free{background:#9bc978}.status-dot.reserved{background:#e9b75b}.status-dot.sold{background:#aab5b5}
.village-status-note{font-size:9px;color:#f0f1e8;margin-top:8px;letter-spacing:.2px;text-shadow:0 1px 6px #193b33}
body[data-angle=tilt][data-mode=map] .village-story h1{font-size:clamp(32px,3.2vw,46px);margin:14px 0 12px}
body[data-angle=tilt][data-mode=map] .parcel-label.free:not(.chosen){background:#365c3d;color:#fff;border-color:#ebf5db;padding:4px 5px}
body[data-angle=tilt][data-mode=map] .parcel-label.reserved:not(.chosen){background:#e7b15d;color:#44351c;border-color:#ffedc7;padding:4px 5px}
body[data-angle=tilt][data-mode=map] .parcel-label.sold:not(.chosen){background:#d7dedae8;color:#53615c;border-color:#f3f4ec;font-size:8px;padding:3px 4px}
body[data-angle=tilt][data-mode=map] .parcel-label.sold:not(.chosen)::before{content:'× ';opacity:.7}
@media(max-width:700px){.village-statuses{gap:1px;padding:3px;margin-top:13px;max-width:calc(100vw - 36px)}.village-statuses button{font-size:8px;padding:9px 6px;gap:4px}.village-statuses b{font-size:8px}.status-dot{width:7px;height:7px}.village-status-note{font-size:7px}body[data-angle=tilt][data-mode=map] .village-story h1{font-size:30px;line-height:1.04}.village-story{pointer-events:none}}

@media(max-width:700px){.village-statuses button{font-size:10px;padding:9px 7px}.village-statuses b{font-size:9px}.village-status-note{font-size:8px}}
