#friend-search{display:flex;gap:12px;align-items:end;margin:18px 0}#friend-search label{flex:1}#friend-search input{display:block;width:100%}.social-layout{display:grid;grid-template-columns:minmax(220px,1fr) 2fr;gap:24px}.social-people{display:grid;gap:10px;margin:14px 0}.social-detail{min-width:0;border-left:1px solid #b7ab8a;padding-left:24px}.social-detail h3{margin:20px 0 10px}.social-goods{display:flex;gap:12px;overflow-x:auto}.social-goods article{min-width:160px;background:#f4ecd4;padding:12px;border-radius:8px}.social-messages{height:230px;overflow:auto;background:#f5efd9;padding:12px;border-radius:8px;overscroll-behavior:contain}.social-messages p{max-width:90%;overflow-wrap:anywhere;margin:10px 0;white-space:pre-wrap}.social-messages small{display:block;color:#766c58}.social-messages span{display:inline-block;background:#e1d9bc;padding:8px 12px;border-radius:8px}.social-messages .mine{margin-left:auto;text-align:right}.social-messages .mine span{background:#d6e2cc;text-align:left}#friend-chat{display:flex;gap:10px;margin-top:12px}#friend-chat textarea{width:100%;min-height:70px;resize:vertical}.social-heading p{margin:8px 0;color:#756951}.social-people [aria-pressed=true]{background:#d3dfc5}@media(max-width:650px){.social-layout{grid-template-columns:1fr}.social-detail{border-left:0;border-top:1px solid #b7ab8a;padding:16px 0}.social-people{max-height:150px;overflow:auto}#friend-search{align-items:stretch;flex-direction:column}}