.connection-status{position:fixed;right:14px;bottom:14px;z-index:900;display:flex;align-items:flex-start;gap:9px;max-width:min(390px,calc(100% - 28px));padding:10px 12px;border-radius:14px;box-shadow:0 10px 28px #00173b2a;font-size:12px;transition:.2s}.connection-status span{display:grid;place-items:center;width:25px;height:25px;border-radius:50%;font-weight:900}.connection-status div{display:grid;gap:2px}.connection-status b{font-size:12px}.connection-status small{font-size:10px;line-height:1.3}.connection-status.online{background:#effaf5;border:1px solid #c8eadc;color:#205d49}.connection-status.online span{background:#d5f4e4;color:#137a54}.connection-status.offline{background:#fff3df;border:1px solid #f3c77e;color:#7c3f0d}.connection-status.offline span{background:#ffd587;color:#793800}@media(max-width:520px){.connection-status{left:12px;right:12px;bottom:10px;max-width:none}.connection-status.online{display:none}.app-offline:before{display:none}}