body { margin:0; background:#08080b; color:#eee; }
.connection { position:absolute; z-index:20; bottom:12px; left:50%; transform:translateX(-50%); padding:8px 14px; border-radius:8px; background:#101015ee; border:1px solid #35353d; font:600 13px system-ui; }
.connection.live { border-color:#3e9d70; }
.connection.stale, .connection.ended { border-color:#ad6450; }
.hdot .initials { width:100%; height:100%; display:grid; place-items:center; background:#333746; color:#fff; font:bold 13px system-ui; border-radius:50%; }
.ab.unknown { opacity:.4; }
.empty-stream { position:absolute; z-index:10; left:50%; top:50%; transform:translate(-50%,-50%); background:#111119e8; border:1px solid #34343d; padding:18px 24px; border-radius:12px; font:600 16px system-ui; text-align:center; }
.radar.hide-players .hdot,.radar.hide-players .cards,.radar.hide-hp .hp,.radar.hide-souls .souls,.radar.hide-abilities .abils,.radar.hide-items .items { display:none; }
.show-hero-names .hdot::after { content:attr(data-name); position:absolute; left:50%; top:100%; transform:translateX(-50%); background:#111d; color:#fff; padding:2px 5px; border-radius:3px; white-space:nowrap; font:600 11px system-ui; }
.no-item-colors .it .ic { background:#aaa !important; color:#aaa !important; }