.pwa-connection {
    align-items: center;
    background: rgb(236 253 245 / 0.96);
    border: 1px solid rgb(16 185 129 / 0.35);
    border-radius: 9999px;
    bottom: 1rem;
    color: rgb(6 95 70);
    display: flex;
    font-size: 0.75rem;
    font-weight: 600;
    gap: 0.4rem;
    line-height: 1rem;
    padding: 0.45rem 0.7rem;
    position: fixed;
    right: 1rem;
    z-index: 50;
}
.pwa-connection::before {
    background: rgb(16 185 129);
    border-radius: 9999px;
    content: '';
    height: 0.5rem;
    width: 0.5rem;
}
.pwa-connection[data-state='offline'], .pwa-connection[data-state='unavailable'] {
    background: rgb(255 247 237 / 0.98);
    border-color: rgb(234 88 12 / 0.35);
    color: rgb(154 52 18);
}
.pwa-connection[data-state='offline']::before, .pwa-connection[data-state='unavailable']::before {
    background: rgb(234 88 12);
}