/* Only what Blazor needs and the React app has no counterpart for (the screens use the React stylesheets). */
#blazor-error-ui { background: var(--danger-faint); color: var(--danger-text); bottom: 0; left: 0; padding: .6rem 1.25rem; position: fixed; width: 100%; z-index: 1000; font-size: 11px }
#blazor-error-ui[hidden] { display: none }
.app-loading { min-height: 100vh; display: grid; place-items: center; color: var(--text-muted); font-size: 11px; background: var(--bg) }
/* Reconnect element of App.razor (audit 2026-10-04: replaces the default UI of Blazor, whose inline <style> the CSP blocks). Blazor toggles the classes. */
#components-reconnect-modal { display: none; position: fixed; left: 50%; bottom: 1.25rem; transform: translateX(-50%); z-index: 1001; max-width: 28rem; padding: .7rem 1.1rem; border-radius: var(--radius); background: var(--surface); color: var(--text); border: 1px solid var(--border-strong); box-shadow: 0 8px 24px var(--shadow); font-size: 12px }
#components-reconnect-modal p { margin: 0 }
#components-reconnect-modal.components-reconnect-show, #components-reconnect-modal.components-reconnect-retrying, #components-reconnect-modal.components-reconnect-paused, #components-reconnect-modal.components-reconnect-failed, #components-reconnect-modal.components-reconnect-rejected, #components-reconnect-modal.components-reconnect-resume-failed { display: block }
#components-reconnect-modal .reconnect-failed, #components-reconnect-modal.components-reconnect-failed .reconnect-retrying, #components-reconnect-modal.components-reconnect-rejected .reconnect-retrying, #components-reconnect-modal.components-reconnect-resume-failed .reconnect-retrying { display: none }
#components-reconnect-modal.components-reconnect-failed .reconnect-failed, #components-reconnect-modal.components-reconnect-rejected .reconnect-failed, #components-reconnect-modal.components-reconnect-resume-failed .reconnect-failed { display: block }