.live-dot{color:#168b88;font-weight:800}.chat-layout{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:18px;align-items:start}.chat-box{height:52vh;min-height:360px;overflow:auto;background:#eaf6f4;border:1px solid #cde5e1;border-radius:20px;padding:16px}.chat-message{display:flex;align-items:flex-start;gap:10px;max-width:82%;background:#fff;border:1px solid #dcebea;border-radius:16px 16px 16px 4px;padding:10px 14px;margin:10px 0;box-shadow:0 5px 16px #173b4310}.chat-avatar{width:38px;height:38px;flex:0 0 38px;border-radius:50%;display:grid;place-items:center;overflow:hidden;background:#d9f0eb;color:#137776;font-weight:900}.chat-avatar img{width:100%;height:100%;object-fit:cover}.chat-message strong{margin-right:10px;color:#137776}.chat-message small{color:#8aa0a0;font-size:.72rem}.chat-message p{margin:5px 0 0;white-space:pre-wrap}.chat-form{display:flex;gap:10px;margin-top:12px}.chat-form input{flex:1}.online-panel{position:sticky;top:16px}.online-head{display:flex;justify-content:space-between;align-items:center;gap:8px}.online-head h2{font-size:1.2rem;margin:2px 0 0}.online-count{min-width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:#d9f0eb;color:#137776;font-weight:900}.online-note{font-size:.78rem;margin:6px 0 14px}.online-members{display:grid;gap:10px}.online-person{display:flex;align-items:center;gap:8px;min-width:0}.online-avatar{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;overflow:hidden;background:#d9f0eb;color:#137776;font-size:.8rem;font-weight:900}.online-avatar img{width:100%;height:100%;object-fit:cover}.online-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1;font-weight:700}.status-dot{display:block;width:9px;height:9px;flex:0 0 9px;border-radius:50%;background:#27b57b}.syndic-dot{background:#c45a9d;box-shadow:0 0 0 3px #c45a9d22}.online-legend{display:flex;gap:12px;flex-wrap:wrap;margin-top:18px;padding-top:12px;border-top:1px solid #dcebea;color:#718786;font-size:.72rem}.online-legend span{display:flex;align-items:center;gap:5px}@media(max-width:760px){.chat-layout{grid-template-columns:1fr}.online-panel{position:static;order:-1}.chat-box{height:52vh}.online-members{grid-template-columns:repeat(2,minmax(0,1fr))}}