.social-dialog{width:min(960px,calc(100vw - 20px));height:min(800px,calc(100dvh - 20px));max-height:calc(100dvh - 20px)}
.panel-header-actions{display:flex;align-items:center;gap:.3rem}#networkVisitors svg{width:1.3rem;height:1.3rem;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}#networkVisitors:hover{background:var(--primary)}
#pane-social .sidebar-social-tabs{padding:0 0 .7rem}#pane-social .sidebar-social-tabs button{flex:1}#pane-social .social-status{padding:.5rem 0}#pane-social .friend-sidebar{padding:0;border:0;overflow:visible;max-height:none;min-height:0}#pane-social .friend-list{display:block}#pane-social .social-scroll{padding:.8rem 0 0;overflow:visible}#pane-social .social-post{padding:.8rem}#pane-social .social-compose textarea{width:100%;min-width:0}
.social-tabs{display:flex;gap:.35rem;align-items:center;padding:.6rem 1rem;border-bottom:1px solid var(--line);flex-shrink:0}.social-tabs button{font-size:.85rem;padding:.55em .8em;min-width:0}.social-tabs button[aria-pressed=true]{background:var(--primary)}#refreshSocial{margin-left:auto}
.social-status{padding:.5rem 1rem;color:#27759a;font-size:.85rem;flex-shrink:0;overflow-wrap:anywhere}.social-status:empty{display:none}.social-view{min-height:0;flex:1}.friends-view{display:grid;grid-template-columns:250px minmax(0,1fr);overflow:hidden}.friend-sidebar{overflow:auto;padding:1rem;border-right:1px solid var(--line);min-width:0}.share-tools{display:flex;flex-wrap:wrap;gap:.4rem}.share-tools button,#copyFriendLink{font-size:.8rem;padding:.5rem}.friend-sidebar .note{font-size:.75rem;margin:.7rem 0;line-height:1.5}#friendLink{width:100%;min-width:0;padding:.5rem;margin:.6rem 0;border:1px solid var(--line);border-radius:.4rem}#friendList h4{margin:.9rem 0 .5rem;font-size:.8rem;color:var(--muted)}.friend-row{display:flex;align-items:center;gap:.3rem;margin:.4rem 0}.friend-row>button:last-child:not(.friend-select){padding:.4rem;font-size:.8rem}.friend-select{flex:1;min-width:0;text-align:left;display:flex;flex-direction:column;gap:.25rem;padding:.7rem}.friend-select[aria-pressed=true]{background:#e1f4ff;border-color:#80c9ec}.friend-select strong{font-size:.9rem;overflow-wrap:anywhere}.friend-select small{font-size:.7rem;color:var(--muted)}.friend-select span{font-size:.75rem;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.friend-select b,.unread-count{font-size:.7rem;background:#197eac;color:#fff;border-radius:1rem;padding:.12rem .4rem}.unread-count{margin-left:.3rem}
.conversation{display:flex;flex-direction:column;min-width:0;min-height:0}.conversation-header{padding:1rem;border-bottom:1px solid var(--line)}.conversation-header h3{overflow-wrap:anywhere;font-size:1.1rem}.conversation-header .note{margin:.4rem 0;font-size:.78rem}.friend-actions{display:flex;gap:.4rem}.friend-actions button{font-size:.75rem;padding:.4rem .6rem}.private-scroll{flex:1;min-height:0;overflow:auto;padding:1rem;overscroll-behavior:contain}.private-messages,.social-posts,.social-interactions{list-style:none;padding:0;margin:0}.private-messages li{padding:.7rem .9rem;margin:.6rem 0;border:1px solid #d4eaf4;border-radius:.65rem;background:#f0f8fc;max-width:90%;width:fit-content;overflow-wrap:anywhere}.private-messages li.outgoing{margin-left:auto;background:#dff3ff;border-color:#b9deef}.private-messages small{display:block;font-size:.7rem;color:var(--muted);margin-bottom:.35rem}.private-messages p,.social-post p{white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.6;font-size:.9rem}.social-compose{display:flex;flex-direction:column;gap:.5rem;padding:1rem;border-top:1px solid var(--line);flex-shrink:0}.social-compose textarea{min-height:4rem;max-height:9rem;resize:vertical}.social-compose .primary{width:auto;align-self:flex-end;font-size:.85rem;margin:0;padding:.6rem 1.2rem}.social-scroll{overflow:auto;padding:1rem;overscroll-behavior:contain}.social-scroll>.social-compose{padding:0 0 1rem;border:0}.social-scroll>.note{margin:.5rem 0 1rem;font-size:.8rem}.social-post{padding:1rem;border:1px solid var(--line);border-radius:.65rem;background:#fff;margin:.8rem 0}.social-post header{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem 1rem;margin-bottom:.6rem}.social-post header strong{font-size:.9rem;overflow-wrap:anywhere}.social-post small,.social-interactions small{font-size:.72rem;color:var(--muted)}.social-post button{margin-top:.7rem;font-size:.8rem;padding:.4rem .8rem}.social-post button[aria-pressed=true]{background:#e0f3ff;color:#14749c}.social-interactions li{padding:.9rem 0;border-bottom:1px solid var(--line);overflow-wrap:anywhere}.social-interactions strong{font-size:.85rem}.social-interactions p{font-size:.85rem;margin:.4rem 0}.friend-invite{padding:.8rem 1rem;background:#e4f4fd;border-bottom:1px solid var(--line);flex-shrink:0}.friend-invite p{font-size:.85rem;line-height:1.5;margin-bottom:.4rem;overflow-wrap:anywhere}.friend-invite button{width:auto;font-size:.8rem;padding:.45rem .7rem;margin:0 .4rem 0 0}
.friend-pet-dialog{width:min(560px,calc(100vw - 20px))}.friend-pet-dialog img{display:block;max-width:100%;width:min(100%,500px);height:auto;max-height:55dvh;object-fit:contain;margin:auto}.friend-pet-dialog .touch-actions{display:flex;gap:.7rem;margin:.8rem 0}.friend-pet-dialog .touch-actions button{flex:1}.friend-pet-dialog .note{font-size:.85rem;overflow-wrap:anywhere}
@media(max-width:600px){.friends-view{display:flex;flex-direction:column;overflow:auto}.friend-sidebar{max-height:190px;min-height:130px;flex-shrink:0;border-right:0;border-bottom:1px solid var(--line);padding:.7rem}.friend-list{display:flex;flex-wrap:wrap;gap:.3rem}.friend-list h4{flex-basis:100%}.friend-row{min-width:0;max-width:100%;flex:1 1 140px;margin:.1rem 0}.friend-select{padding:.5rem}.conversation{height:max(350px,calc(100dvh - 350px));flex:none}.conversation-header{padding:.7rem}.private-scroll{padding:.7rem}.social-compose{padding:.7rem}.social-tabs{padding:.5rem;gap:.2rem}.social-tabs button{padding:.5em;font-size:.8rem}.social-scroll{padding:.7rem}.friend-invite{max-height:35dvh;overflow:auto}.social-dialog .panel-header{padding:.7rem}.social-dialog .panel-header h2{font-size:1.15rem}}
@media(max-width:360px) and (max-aspect-ratio:1/1){.dock{max-width:calc(100vw - 16px)}.dock button{flex-direction:column;padding:.5em .65em;font-size:.78rem}}