.online-presence{position:relative;flex-shrink:0;margin-left:auto;line-height:1.4;z-index:30}.online-presence>summary{list-style:none;display:flex;align-items:center;gap:7px;cursor:pointer;color:var(--muted);padding:8px 10px;border:1px solid var(--line);border-radius:6px;font-size:11px;white-space:nowrap}.online-presence>summary::-webkit-details-marker{display:none}.online-presence[open]>summary{color:var(--mint);border-color:#58e0f266}.online-panel{position:absolute;right:0;top:calc(100% + 10px);width:255px;max-width:calc(100vw - 30px);padding:18px;background:#192320;border:1px solid #3d5550;border-radius:8px;box-shadow:0 10px 30px #0005}.online-panel h3{font-size:14px;margin:0 0 12px}.online-panel ul{list-style:none;padding:0;margin:0;max-height:320px;overflow:auto}.online-panel li{display:flex;align-items:center;gap:10px;padding:8px 0;font-size:12px}.online-panel .avatar{width:31px;height:31px;font-size:10px}.online-panel li>.status-dot{margin-left:auto;flex-shrink:0}.online-panel small{font-size:10px;color:var(--muted);margin-left:8px}.online-error{font-size:11px;color:#efcc73;margin:10px 0 0}.topbar{gap:15px}.topbar>span:first-child{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media(max-width:800px){.topbar{gap:8px}.online-presence>summary{padding:6px;font-size:9px;gap:5px}.online-panel{right:-100px}.mobile-account{gap:8px}.topbar>span:first-child{flex:1}.online-panel .avatar{width:30px;height:30px}}
@media(prefers-reduced-motion:no-preference){.online-presence[open] .online-panel{animation:kda-reveal .15s ease-out}}