.app-nav.mobile{grid-template-columns:repeat(5,minmax(0,1fr))}
.app-nav.mobile :is(a,button){padding-inline:2px}
.friend-avatar,.friend-pin{position:relative;overflow:hidden}
.friend-avatar img,.friend-pin img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;background:#94fbec}
.friend-identity{display:flex;align-items:center;gap:8px;flex:1;min-width:0;text-align:left;padding:3px 0;background:transparent}
.friend-identity strong,.friend-identity small{display:block;overflow-wrap:anywhere}
.friend-card>div.friend-identity{display:flex}
.friend-card-controls{flex-shrink:0}
.share-modes{display:flex;flex-wrap:wrap;gap:5px;margin-top:8px}
.share-box .share-modes .social-action,.share-box [data-act=resume]{width:auto}
.share-modes .social-action{flex:1;padding-inline:7px}
.share-modes [aria-pressed=true],.place-social [aria-pressed=true]{background:#62f1e9;color:#092233}
.profile-photo,.profile-photo-controls,.place-social{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.profile-photo{margin-top:12px}
.profile-photo .friend-avatar{width:62px;height:62px;font-size:23px}
#accountBody .profile-photo label{display:inline-flex;font-size:13px;cursor:pointer}
#avatarFile{width:1px;height:1px;position:absolute;clip-path:inset(50%)}
.profile-photo-controls:focus-within label{outline:2px solid #89fbf0;outline-offset:2px}
.place-social{margin-top:10px}
.place-social [role=status]{width:100%;margin:0;font-size:12px;color:#a9bfd8}
#chatDialog{width:min(480px,100% - 24px);max-height:min(650px,calc(100dvh - 24px));border:1px solid #34516c;border-radius:18px;background:#101f34;color:#edf6ff;padding:14px;box-shadow:0 15px 36px #050c1bba}
#chatDialog[open]{display:flex;flex-direction:column;gap:9px}
#chatDialog::backdrop{background:#030a18b0}
#chatTitle{display:flex;gap:8px;align-items:center;min-width:0;overflow-wrap:anywhere}
#chatMessages{display:flex;flex-direction:column;gap:8px;overflow-y:auto;overscroll-behavior:contain;list-style:none;padding:4px 0;margin:0;min-height:0}
#chatMessages:empty{display:none}
.chat-empty{padding:10px 2px;color:#b5cee6}
.chat-bubble{align-self:flex-start;display:grid;gap:5px;width:fit-content;max-width:86%;padding:8px 10px;border-radius:12px;background:#1b324b;overflow-wrap:anywhere}
.chat-bubble.mine{align-self:flex-end;background:#184657}
.chat-bubble p{white-space:pre-wrap;margin:0}
.chat-bubble time,.chat-bubble small,#chatStatus{font-size:12px;color:#b5cee6}
#chatStatus{margin:0}
#chatStatus:empty{display:none}
#chatForm{display:flex;gap:7px;flex-wrap:wrap}
#chatForm textarea,#chatRecipient{font:inherit;font-size:16px;min-width:0;color:#edf6ff;background:#0d192a;border:1px solid #35506e;border-radius:10px;padding:7px 9px}
#chatForm textarea{flex:1;resize:vertical}
#chatForm .social-action{align-self:flex-end;min-height:40px}
#chatCard{margin:0;padding:8px 10px;border-radius:10px;background:#18314a}
#chatDialog [hidden]{display:none}
.point-share{margin-top:7px}
#inboxView{max-width:720px;margin:26px auto 0}
#inboxTitle{margin:0 0 12px;font-size:clamp(23px,4vw,32px);line-height:1.15}
.inbox-panel{background:#101f34;border:1px solid #243953;border-radius:16px;overflow:hidden}
#inboxStatus{padding:14px;color:#b5cee6}
#inboxStatus:empty{display:none}
#inboxStatus p{margin:0 0 9px}
#inboxList{padding:0;margin:0;list-style:none}
#inboxList li+li{border-top:1px solid #243953}
.inbox-row{display:flex;align-items:center;gap:11px;width:100%;min-height:62px;text-align:left;padding:9px 13px;color:#edf6ff;background:transparent}
.inbox-row:hover,.inbox-row:focus-visible{background:#18314a}
.inbox-person{flex:1;min-width:0}
.inbox-person strong,.inbox-person small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.inbox-person small,.inbox-row time{color:#b5cee6}
.inbox-row time{font-size:11px;white-space:nowrap}
.friend-result-note{margin-inline-start:auto;white-space:normal}
@media(min-width:801px) and (max-width:950px){
  .head-inner{gap:7px}
  .head-inner>.blizo-brand img{width:118px}
  .head-inner .head-actions{gap:6px}
  .app-nav.desktop{gap:2px}
  .app-nav.desktop :is(a,button){padding-inline:5px;font-size:12px}
  .app-nav.desktop svg{width:15px;height:15px}
}
@media(max-width:390px){
  .friend-card-controls{flex-direction:column}
  .app-nav.mobile{gap:2px;padding-inline:6px}
  .app-nav.mobile :is(a,button){font-size:10px}
  .share-modes .social-action{font-size:12px}
}
