.connection-overlay { display: none; position: fixed; inset: 0; z-index: 10010; background: #17201acc; padding: 1.5rem; align-items: center; justify-content: center; }
.connection-overlay.connection-visible { display: flex; }
.connection-card { width: min(100%, 35rem); padding: 2rem; background: white; color: #171c1a; border-radius: 1rem; box-shadow: 0 1rem 4rem #0004; }
.connection-card h2 { font-size: 1.5rem; margin-top: 0; }
.connection-card p { line-height: 1.6; }
.connection-draft-hint { font-size: .9rem; color: #515b55; }
.system-state[data-connection-state="hide"] .state-dot { background: #247b49; }
.system-state:not([data-connection-state="hide"]) .state-dot { background: #bb6b00; }
.system-state[data-connection-state="failed"] .state-dot,
.system-state[data-connection-state="offline"] .state-dot { background: #bd2b27; }
@media (pointer: coarse) {
    .button, button.btn, .form-control, .form-select { min-height: 44px; }
    .table-actions { gap: .6rem; }
}
@media print { .connection-overlay { display: none !important; } }