/* ===== Slow-connection toolbar indicator =====
   Sits immediately left of the Ask DEX pill in the MainLayout app bar. It only ever appears once the
   rolling median latency has been over threshold for two consecutive sampling windows, so it should
   arrive calmly rather than snapping in — an icon that pops is read as an error, and this is advisory. */

.network-quality-indicator {
    display: inline-flex;
    align-items: center;
    align-self: center;
    animation: network-quality-fade-in 260ms ease-out both;
}

/* Slow breathing pulse: enough to draw the eye on arrival, slow enough not to nag for the whole
   time a connection stays poor. */
.network-quality-indicator .mud-icon-root {
    animation: network-quality-pulse 2.6s ease-in-out infinite;
}

@keyframes network-quality-fade-in {
    from {
        opacity: 0;
        transform: scale(0.85);
    }

    to {
        opacity: 1;
        transform: scale(1);
    }
}

@keyframes network-quality-pulse {
    0%, 100% {
        opacity: 1;
    }

    50% {
        opacity: 0.45;
    }
}

@media (prefers-reduced-motion: reduce) {
    .network-quality-indicator,
    .network-quality-indicator .mud-icon-root {
        animation: none;
    }
}