/* 已选照片留言卡；保持 960×540 的游戏内坐标与原有等比横屏。 */
dialog[data-view=friend-board] #modal-body{left:84px;top:13px;width:792px;height:514px;background:#fff8ea}
dialog[data-view=friend-board] .modal-header{height:64px;min-height:64px;padding:1px 18px;border:0;background:transparent;gap:12px}
dialog[data-view=friend-board] h2{font-size:27px;color:#536550;letter-spacing:.5px;flex:1}
dialog[data-view=friend-board] h2 small{display:block;margin-top:3px;font-size:15px;font-weight:450;letter-spacing:0;color:#81906c}
.friend-header-actions{display:flex;gap:8px;align-items:center}
.friend-header-actions .tool-button{display:flex;align-items:center;gap:7px;background:#e9eadc;font-size:16px;min-height:62px;border-radius:28px;padding:9px 15px;white-space:nowrap}
.friend-header-actions .text-button{font-size:14px;min-height:62px;padding:5px}
dialog[data-view=friend-board] .modal-content{padding:3px 18px 9px;overflow:hidden;display:flex;flex-direction:column;gap:6px}
.friend-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px;flex:1;min-height:0;padding:0 2px;touch-action:pan-y;user-select:none}
.polaroid-card{background:url('/assets/residents-v7/polaroid-paper.png') center/cover no-repeat;display:flex;flex-direction:column;gap:3px;min-width:0;min-height:0;padding:26px 16px 9px;transform:rotate(-.8deg)}
.polaroid-card:nth-child(2){transform:rotate(.6deg)}
.polaroid-card:nth-child(3){transform:rotate(-.3deg)}
.resident-photo-button{position:relative;width:100%;padding:0;display:block;flex-shrink:0;aspect-ratio:4/3;background:none;border-radius:2px;overflow:hidden;touch-action:pan-y}
.resident-photo{width:100%;height:100%;display:block;object-fit:contain;pointer-events:none}
.resident-photo-button>span{position:absolute;right:5px;bottom:5px;display:flex;align-items:center;gap:3px;background:#4b594bc7;border:1px solid #fffbec;border-radius:18px;padding:4px 7px;color:#fffdf3;font-size:11px;pointer-events:none}
.resident-photo-button>span .ui-icon{width:13px;height:13px;filter:brightness(0) invert(1)}
.resident-name{display:flex;gap:9px;align-items:center;white-space:nowrap}
.resident-name strong{font-size:23px;line-height:28px;color:#52644f;font-weight:650}
.resident-name small{display:flex;align-items:center;gap:3px;font-size:11px;line-height:16px;color:#727a67}
.resident-name small .ui-icon{width:13px;height:13px}
.modal-content .resident-bio{font-size:17px;line-height:20px;margin:0;color:#646e5f;min-height:40px}
.resident-tags{display:flex;gap:7px;align-items:center;min-height:26px}
.resident-tags>span{display:flex;gap:5px;align-items:center;font-size:16px;line-height:20px;background:#e4e8d7;color:#617359;border-radius:20px;padding:3px 9px;white-space:nowrap}
.resident-tags>span.berry-tag{color:#a76177;background:#f2dce0}
.resident-tags .ui-icon{width:16px;height:16px}
.resident-tags .berry-tag .ui-icon{filter:sepia(.4) saturate(2) hue-rotate(275deg)}
.polaroid-card .resident-invite{width:100%;min-height:62px;padding:9px 4px;margin-top:auto;border-radius:30px;background:#748466;border:1px solid #a9b59a;box-shadow:inset 0 0 0 3px #e3e6ce45,0 2px 0 #63755724;color:#fffdf2;font-size:17px;font-weight:600;white-space:nowrap}
.friend-pagination{display:flex;gap:10px;align-items:center;justify-content:center;min-height:62px;flex-shrink:0;color:#596e56}
.friend-pagination .tool-button{min-height:62px;border-radius:29px;background:#e9eadc;border:1px solid #d6d9c7;display:flex;align-items:center;gap:6px;font-size:17px;padding:8px 20px}
.friend-pagination .friend-previous{width:62px;padding:16px;justify-content:center}
.friend-pagination .friend-previous .ui-icon{width:25px;height:25px}
.friend-page{font-size:17px;min-width:72px;text-align:center;font-weight:650}
.friend-remaining{font-size:13px;color:#737e68;min-width:152px}
.friend-cards:focus-visible{outline-offset:-2px}
dialog:is([data-view=resident-profile],[data-view=resident-meeting]) #modal-body{left:82px;top:39px;width:796px;height:462px}
dialog:is([data-view=resident-profile],[data-view=resident-meeting]) .modal-content{padding:10px 21px 18px;overflow:hidden}
.resident-detail{display:grid;grid-template-columns:270px 1fr;gap:22px;height:100%;align-items:center}
.resident-detail-photo{width:270px;aspect-ratio:4/3;object-fit:contain;border:8px solid #fffdf4;box-shadow:0 3px 11px #89714e23;transform:rotate(-1deg)}
.resident-detail>section{min-width:0}
.resident-detail-name{display:flex;align-items:center;gap:12px;margin-bottom:8px}
.resident-detail-name h3{font-size:27px;margin:0}
.resident-detail-name>span{font-size:13px;color:#7d886c}
.modal-content .resident-detail p{font-size:17px;line-height:1.55;margin:10px 0;color:#68725f}
.resident-detail>section>h3{margin:8px 0;font-size:25px;line-height:30px}
.resident-wish{border-left:3px solid #c6ccab;padding:2px 0 2px 12px;display:grid;gap:5px;font-size:15px;color:#6b7961}
.resident-wish strong{font-size:12px;font-weight:500;color:#8a917b}
.resident-wish small{font-size:12px;display:flex;align-items:center;gap:5px;color:#917b61}
.resident-wish .ui-icon{width:17px;height:17px}
.resident-detail-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:13px}
.resident-detail-actions .primary-button,.resident-detail-actions .tool-button,.resident-detail-actions .text-button{min-height:62px;font-size:14px;padding:9px 11px;border-radius:25px}
.resident-detail-actions .primary-button{background:#748466;border-color:#748466}
.resident-detail-actions .text-button{padding:4px;flex-basis:100%;min-height:62px;text-align:left;color:#8a917b}
.resident-conversation{display:grid;gap:8px}
.resident-conversation .tool-button,.resident-conversation .primary-button{min-height:62px;font-size:16px}
.resident-detail .tag{font-size:12px;margin-bottom:6px}
.community-actions{display:flex;gap:12px;margin-bottom:16px}
.community-actions>.primary-button,.community-actions>.tool-button{min-height:62px;font-size:16px}
.post-author-link{display:flex;align-items:center;gap:8px;font-size:18px;font-weight:650;padding:0;text-align:left}
.post-author-link .resident-author{width:35px;height:35px;object-fit:cover;border-radius:50%}
.post-author:has(.post-author-link)::before{display:none}
dialog[data-view=community] .post-tools button,dialog[data-view=community] .comment-form button{min-height:62px}
@media(prefers-reduced-motion:reduce){.polaroid-card{transform:none!important}}
