body { font-family: Arial, sans-serif; background-color: #111; color: #fff; text-align:center; margin:0; padding:20px; }
video { background-color: black; }
#main { width:80%; max-width:600px; border:2px solid #333; margin:10px auto; display:block; }
.camera-container { position: relative; display: inline-block; margin:5px; }
#statusBar { position:absolute; top:0; left:0; width:100%; height:8px; background-color:red; transition: background-color 0.3s; }
#thumbnails { display:flex; flex-wrap:wrap; justify-content:center; }
.thumbnail { position:relative; display:inline-block; margin:5px; border:2px solid #555; cursor:pointer; transition:border 0.3s; }
.thumbnail.live { border:4px solid limegreen; }
.thumbnail video { width:120px; height:90px; object-fit:cover; }
.camNumber { position:absolute; bottom:2px; right:5px; background:rgba(0,0,0,0.6); color:white; font-weight:bold; padding:2px 5px; border-radius:3px; font-size:12px; }