/* MasaLobi Social V1 — standalone Friends & Chat pages. */
.ml-social-app{
  margin:14px 0;
  border:1px solid #4e687b;
  border-radius:12px;
  padding:16px;
  background:linear-gradient(145deg,#102c3d,#081d2d 70%);
  color:#e4edf3;
  min-height:210px;
  box-shadow:0 12px 35px rgba(0,0,0,.18);
}
.ml-social-heading{display:flex;align-items:center;justify-content:space-between;
 gap:12px;padding:0 0 10px;border-bottom:1px solid #8b723c6b;}
.ml-social-heading h2{margin:0;color:#f2d297;font:750 20px Georgia,serif;}
.ml-social-tools button,.ml-social-person-actions button,.ml-social-chat-person{
  border:1px solid #648091;background:#173648;color:#e3d5ad;
  border-radius:7px;min-height:32px;padding:6px 10px;cursor:pointer;font-size:11px;
}
.ml-social-tools button:hover,.ml-social-person-actions button:hover,.ml-social-chat-person:hover{
  background:#254b5e;
}
.ml-social-status{margin:9px 0;color:#a9bcc7;font-size:11px;min-height:16px;}
.ml-social-status[data-kind="error"]{color:#ffa08a;}
.ml-social-status[data-kind="success"]{color:#c0efcb;}
.ml-social-content{display:flex;flex-direction:column;gap:15px;}
.ml-social-group{border:1px solid #35546a;border-radius:9px;background:#0e2b3c;padding:12px;}
.ml-social-group h3{margin:0 0 11px;color:#ebc88b;font:700 15px Georgia,serif;}
.ml-social-none{color:#aec2ca;margin:7px 0;font-size:12px;}
.ml-social-person{display:flex;align-items:center;gap:11px;
 padding:9px;border:1px solid #36586d;border-radius:8px;
 background:#ffffff05;margin:7px 0;min-width:0;}
.ml-social-person-icon{display:grid;place-items:center;flex:0 0 34px;height:34px;
 color:#f4d08e;border:1px solid #927143;border-radius:50%;background:#173c4a;}
.ml-social-person-info{display:flex;flex-direction:column;gap:3px;min-width:0;flex:1;}
.ml-social-person-info strong{font-size:12px;color:#e9eff2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.ml-social-person-info small{color:#a6c4d0;font-size:10px;}
.ml-social-person-actions{display:flex;flex-wrap:wrap;gap:5px;}
.ml-social-chat-layout{display:grid;grid-template-columns:minmax(170px,220px) minmax(0,1fr);gap:12px;}
.ml-social-chat-list{display:flex;flex-direction:column;gap:7px;border:1px solid #35546a;
 padding:12px;border-radius:9px;min-width:0;}
.ml-social-chat-person{text-align:left;font-size:12px;min-height:39px;}
.ml-social-chat-person.is-selected{border-color:#d2a354;color:#f8d792;background:#4c3a26;}
.ml-social-thread{border:1px solid #35546a;border-radius:9px;padding:12px;min-width:0;}
.ml-social-thread h3{font:700 17px Georgia,serif;color:#f2d198;margin:0 0 11px;}
.ml-social-history{min-height:170px;max-height:320px;overflow:auto;
 display:flex;flex-direction:column;gap:8px;border-radius:9px;
 background:#071927;padding:12px;}
.ml-social-bubble{align-self:flex-start;max-width:80%;padding:8px 10px;
 border:1px solid #436171;background:#164054;color:#e9f0f4;border-radius:9px;
 font:12px/1.5 system-ui;overflow-wrap:anywhere;}
.ml-social-bubble.is-mine{align-self:flex-end;border-color:#988052;background:#49402c;color:#f6e7c9;}
.ml-social-message-form{display:flex;flex-wrap:wrap;gap:8px;align-items:flex-end;margin-top:10px;}
.ml-social-message-form textarea{flex:1 1 220px;min-width:0;background:#091f30;color:#edf3f6;
 border:1px solid #557386;border-radius:7px;padding:9px;font:12px/1.5 system-ui;resize:vertical;}
.ml-social-message-form button,.ml-social-primary{
 display:inline-block;align-self:flex-end;padding:9px 14px;
 min-height:35px;border:1px solid #e4b66d;border-radius:7px;
 background:linear-gradient(180deg,#ebc77e,#b5833e);color:#102b3a;
 font-weight:800;text-decoration:none;cursor:pointer;font-size:12px;
}
.ml-social-message-form button:disabled{opacity:.5;cursor:not-allowed;}
.ml-social-chat-list .ml-social-primary{align-self:flex-start;}
@media(max-width:640px){
 .ml-social-app{padding:11px;}
 .ml-social-chat-layout{grid-template-columns:1fr;}
 .ml-social-person{align-items:flex-start;flex-wrap:wrap;}
 .ml-social-person-actions{margin-left:auto;}
 .ml-social-chat-list{max-height:230px;overflow:auto;}
}