body { font-family: sans-serif; background: #121212; color: #e0e0e0; padding: 20px; }
        #status { padding: 10px; margin-bottom: 10px; border-radius: 5px; font-weight: bold; }
        .online { background: #1b5e20; color: #c8e6c9; }
        .offline { background: #b71c1c; color: #ffcdd2; }
        #chat-box { background: #000; padding: 15px; height: 300px; overflow-y: auto; border: 1px solid #333; font-family: monospace; margin-bottom: 10px; }
        .msg { margin-bottom: 5px; border-bottom: 1px solid #222; padding-bottom: 2px; }
        .system { color: #888; font-style: italic; }
        .chat-msg { color: #fff; }
        .user-label { color: #4fc3f7; font-weight: bold; }
        input { padding: 10px; background: #222; border: 1px solid #444; color: white; border-radius: 4px; }
        button { padding: 10px 20px; cursor: pointer; background: #3949ab; border: none; color: white; border-radius: 4px; font-weight: bold; }
        button:hover { background: #303f9f; }
        .controls { margin-top: 15px; display: flex; gap: 10px; flex-wrap: wrap; }
        
        /* Video Grid */
        #video-grid { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 20px; }
        .video-card { position: relative; width: 300px; height: 200px; background: #000; border: 2px solid #333;
                 border-radius: 8px; overflow: hidden; align-items: center;border: 3px solid transparent;transition: border-color 0.2s ease, box-shadow 0.2s ease; }
        video { width: 100%; height: 100%; object-fit: cover; max-height: 200px;z-index: 2;position: absolute;}
        .label { position: absolute; bottom: 5px; left: 5px; background: rgba(0,0,0,0.6);z-index: 3; padding: 2px 6px; border-radius: 4px; font-size: 0.8em; }
        .avatar { width: 200px; height: 200px; border-radius: 25%; border: 2px solid #333;margin-left: 15%; position: absolute}
        .speaking-highlight {
        border-color: #00ff00; /* Neon Green */
        box-shadow: 0 0 15px rgba(0, 255, 0, 0.6);
        }
        #mobile_alert {
                display:none; position:fixed; top:0; left:0; width:100%; height:100%;backdrop-filter: blur(5px);-webkit-backdrop-filter: blur(5px); background:#00000062; color:#ffffff; display:flex; align-items:center; justify-content:center; z-index:9999;


        }