/* Keep the desktop flow unchanged; compact only the friends workspace on phones. */
.friends-heading,.friends-list-heading,.friends-requests{display:contents}
.friend-mobile-more{display:none}
.friend-more-actions{display:grid;gap:12px}
.friend-more-actions button{min-height:44px}

@media(max-width:760px){
 .friends-page{padding:14px 12px calc(20px + env(safe-area-inset-bottom))}
 .friends-page .friends-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}
 .friends-page .section-head{min-width:0;margin:0}
 .friends-page .section-head h2{font-size:24px;letter-spacing:2px;white-space:nowrap}
 .friends-page .section-head .eyebrow,.friends-page .section-head p,.friends-page .friends-query-detail{display:none}
 .friends-page .friends-query{flex-shrink:0;min-height:44px;padding:6px 0;white-space:nowrap}
 .friends-page .friends-search{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:0 8px;align-items:start}
 .friends-page .friends-search>label{grid-column:1;grid-row:1;min-width:0;margin:0;gap:0}
 .friends-page .friends-search-label{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
 .friends-page .friends-search input{height:44px;min-width:0;padding:10px 12px;font-size:16px}
 .friends-page .friends-search>button{grid-column:2;grid-row:1;width:auto;min-height:44px;padding:8px 16px}
 .friends-page .friends-search>.form-error{grid-column:1/-1;grid-row:2;min-height:0;margin-top:8px;overflow-wrap:anywhere}
 .friends-page .friends-search>.form-error:empty{display:none}
 .friends-page .friends-requests.is-empty{display:none}
 .friends-page .friends-requests .subheading{font-size:17px;margin:20px 0 8px}
 .friends-page .friends-list-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:18px 0 6px}
 .friends-page .friends-list-heading .subheading{font-size:17px;margin:0}
 .friends-page .friends-list-heading button{min-height:40px;flex-shrink:0}
 .friends-page .person-card{flex-wrap:nowrap;gap:6px;padding:10px;margin:8px 0;min-width:0}
 .friends-page .person-card>.avatar{width:36px;height:36px;flex:0 0 36px;border-radius:10px}
 .friends-page .person-card .person-info{flex:1 1 0;min-width:0;overflow:hidden}
 .friends-page .person-info b,.friends-page .person-info p{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
 .friends-page .person-info b{font-size:13px}
 .friends-page .person-info p{margin-top:2px;font-size:10px;color:var(--muted)}
 .friends-page .person-card>button,.friends-page .person-card>.small{flex-shrink:0;white-space:nowrap}
 .friends-page .friend-card>button{flex:0 0 44px;width:44px;min-height:44px;padding:6px 0;font-size:12px}
 .friends-page .friend-desktop-action{display:none}
 .friends-page .friend-mobile-more{display:block}
}
