/* /Components/Layout/ReconnectModal.razor.rz.scp.css */
.reconnect[b-gwx82rvs48] {
    position: fixed; z-index: 2000; left: 50%; top: calc(env(safe-area-inset-top, 0px) + 8px);
    display: flex; align-items: center; gap: .6rem;
    max-width: calc(100% - 32px); padding: .45rem .55rem .45rem .85rem;
    font-size: .88rem; color: var(--text); background: var(--warn-bg);
    border-radius: 999px; box-shadow: var(--shadow-2);
    transform: translate(-50%, -150%); opacity: 0; pointer-events: none;
    transition: transform var(--dur-l) var(--ease), opacity var(--dur-m) var(--ease);
}
.reconnect.visible[b-gwx82rvs48] { transform: translate(-50%, 0); opacity: 1; pointer-events: auto; }
.reconnect-spin[b-gwx82rvs48] {
    width: 14px; height: 14px; flex: none; border-radius: 50%;
    border: 2px solid var(--warn); border-right-color: transparent;
    animation: reconnect-spin-b-gwx82rvs48 .8s linear infinite;
}
.reconnect.failed .reconnect-spin[b-gwx82rvs48] { display: none; }
.reconnect-btn[b-gwx82rvs48] {
    display: none; min-height: 36px; padding: 0 .8rem; font: inherit; font-weight: 600; font-size: .85rem;
    color: var(--accent-text); background: var(--accent); border: 0; border-radius: 999px; cursor: pointer;
}
.reconnect.failed .reconnect-btn[b-gwx82rvs48] { display: inline-block; }
@keyframes reconnect-spin-b-gwx82rvs48 { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .reconnect-spin[b-gwx82rvs48] { animation-duration: 2.4s; } }