html[data-alarm-preview] [data-alarm-preview-signal="true"] {
    background-color: #ff0000 !important;
    color: #08121c !important;
}
html[data-alarm-preview] .facility-panel img {
    outline-width: 5px !important;
    outline-style: solid !important;
    outline-color: red;
    outline-offset: -5px;
    animation: wallboard-alarm-outline 1s step-end infinite !important;
}
/* Room 3 clips the unused bottom of its 720px source canvas. Draw its
   preview frame on the visible panel rather than the taller image. */
html[data-alarm-preview] .facility-room3 img { outline: none !important; }
html[data-alarm-preview] .facility-room3::after {
    content: ""; position: absolute; inset: 0; z-index: 3;
    pointer-events: none; outline: 5px solid red; outline-offset: -5px;
    animation: wallboard-alarm-outline 1s step-end infinite;
}
#dashboard-alarm-preview-badge {
    position: fixed; right: 12px; top: 8px; z-index: 10000;
    padding: 6px 12px; border: 1px solid #ff7777; border-radius: 4px;
    background: #861313; color: white; font-size: 14px; line-height: 20px;
    pointer-events: none;
}
#dashboard-alarm-preview-badge[hidden] { display: none; }