/* v27: independent layout for readable recruitment, with a versioned URL. */
#residentsDialog{width:min(900px,calc(100vw - 24px));max-width:calc(100vw - 24px);max-height:90vh;max-height:90dvh;padding:0;overflow:auto;border:2px solid #b79b60;border-radius:18px;background:#f4ecd9;scrollbar-color:#a28d62 #e8dcc2}
#residentsDialog .resident-dialog-head{position:sticky;top:0;z-index:2;padding:22px 24px 12px;background:#f4ecd9;border-bottom:1px solid #d6c7a5}
#residentsDialog .dialog-heading{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:18px}
#residentsDialog .dialog-heading small{font-size:10px;letter-spacing:2px;color:#66714e}
#residentsDialog h2{font:30px/1.2 Georgia,serif;margin:4px 0 0;color:#243c2d}
#residentsDialog #closeResidents{flex:0 0 44px;width:44px;height:44px;min-height:44px;padding:0;background:#e6d8b8;border-color:#bba373;font-size:22px;align-self:flex-start}
#residentsDialog #residentHousing{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;padding:0;margin:0;background:transparent}
#residentHousing>div{background:#e6e8d5;border:1px solid #c6ceb0;border-radius:10px;padding:10px 14px;display:flex;align-items:baseline;gap:9px;flex-wrap:wrap}
#residentHousing strong{font-size:27px;line-height:1;color:#304b33}#residentHousing span{font-size:12px;font-weight:500;color:#4d6048}#residentHousing .free-housing{background:#dce8ca;border-color:#a7bc88}
#residentsDialog #residentPlanned{font-size:12px;margin:10px 0 0;color:#59664e;line-height:1.5}
#residentsDialog .resident-dialog-body{padding:0 24px 20px}#residentsDialog .resident-help{font-size:13px;color:#5b634d;line-height:1.6;margin:14px 0}
#residentsDialog #residentChoices{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
#residentChoices .resident-card{display:flex;flex-direction:column;min-width:0;padding:17px;background:#fffaf0;border:1px solid #d5c5a1;border-radius:12px;box-shadow:0 2px 4px #56462608}
#residentChoices .resident-card-heading{display:flex;gap:12px;align-items:center;min-height:48px}
#residentChoices .resident-icon{display:grid;place-items:center;flex:0 0 44px;width:44px;height:44px;border-radius:12px;background:#e7e4cb;font-size:26px;color:#36543b}
#residentChoices h3{font-size:17px;line-height:1.3;margin:0 0 3px;color:#263c2a;font-weight:750}#residentChoices .resident-count{font-size:12px;color:#657058}
#residentChoices .resident-description{font-size:13px;font-weight:400;line-height:1.55;color:#515b45;margin:13px 0;min-height:40px}
#residentChoices .resident-price{display:flex;justify-content:space-between;align-items:baseline;gap:10px;flex-wrap:wrap;border-top:1px solid #e5dcc7;padding-top:10px;margin-top:auto}
#residentChoices .resident-price span{font-size:11px;color:#657058}#residentChoices .resident-price strong{font-size:13px;color:#674b20;line-height:1.5}
#residentChoices .resident-reason{font-size:12px;line-height:1.5;color:#5c6851;min-height:18px;margin:8px 0}
#residentsDialog #residentChoices button{display:block;width:100%;min-height:44px;height:auto;margin:2px 0 0;padding:10px 14px;border:1px solid #b39348;border-radius:8px;background:#efd08c;color:#253a27;font-size:14px;font-weight:750;text-align:center;line-height:1.4}
#residentsDialog #residentChoices button:hover:not(:disabled){background:#f7dda2;border-color:#7b7b43}#residentsDialog #residentChoices button:disabled{background:#e4e4d9;border-color:#bfc6b1;color:#58614e;opacity:1}
#residentChoices .resident-unavailable{background:#f0eee5;border-color:#d7d2c2}#residentChoices .resident-unavailable .resident-reason{color:#7c4f29}
#residentsDialog .resident-dialog-foot{position:sticky;bottom:0;background:#f4ecd9f5;border-top:1px solid #d6c7a5;padding:10px 24px 15px;z-index:2}
#residentsDialog #residentStatus{font-size:13px;line-height:1.5;min-height:0;margin:0 0 8px;color:#365239}#residentsDialog #residentStatus:empty{display:none}
#residentsDialog #residentBuildHut{display:block;width:100%;min-height:44px;padding:10px;background:#e3e7cd;color:#2d4932;border:1px solid #aab78d;font-weight:700;font-size:14px}
#buildings button.economy-build,.kids #buildings button.economy-build{min-width:235px;max-width:285px;flex-basis:235px;opacity:1}#buildings button.economy-build.locked{border-style:dashed;border-color:#b49f6870}#buildings .economy-build .build-price{font-size:11px;color:#c7ceb7!important}#buildings button[data-build=greatTower],.kids #buildings button[data-build=greatTower]{min-width:170px;max-width:220px;flex-basis:170px}
#armyRecruitBar{overflow-x:auto;overflow-y:hidden}#armyRecruitBar button{white-space:nowrap;flex-shrink:0}#armySummary{display:none}#towerBuilding{border:1px solid #c8b384;background:#ece3ca;padding:12px;border-radius:10px}.tower-actions{display:flex;flex-wrap:wrap;gap:6px}.tower-actions button{flex:1 1 140px;font-size:13px!important;padding:10px!important}
@media(max-width:560px){#residentsDialog{max-height:94vh;max-height:94dvh;border-radius:13px}#residentsDialog .resident-dialog-head{padding:16px 14px 10px}#residentsDialog h2{font-size:25px}#residentsDialog .dialog-heading{margin-bottom:12px}#residentsDialog #residentHousing{gap:6px}#residentHousing>div{padding:9px;gap:5px;flex-direction:column}#residentHousing strong{font-size:23px}#residentHousing span{font-size:10px}#residentsDialog .resident-dialog-body{padding:0 14px 14px}#residentsDialog #residentChoices{grid-template-columns:minmax(0,1fr);gap:10px}#residentChoices .resident-card{padding:14px}#residentChoices .resident-description{min-height:0;margin:10px 0}#residentsDialog .resident-dialog-foot{padding:9px 14px 12px}}
@media(max-height:540px){#residentsDialog .resident-dialog-head{position:static}#residentsDialog .resident-dialog-foot{position:static}}
