.page-container[data-v-c79dd7e8]{width:100%;height:100vh;display:flex;justify-content:center;align-items:center;padding:20px;box-sizing:border-box}.grid-container[data-v-c79dd7e8]{width:100%;max-width:1400px;height:100%;max-height:calc(100vh - 40px);display:grid;grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(4,1fr);gap:10px;margin:0 auto}.grid-item[data-v-c79dd7e8],.player[data-v-c79dd7e8]{width:100%;height:100%;display:flex;flex-direction:column}.player[data-v-c79dd7e8]{background-color:#000;border-radius:4px;overflow:hidden}.player-content[data-v-c79dd7e8]{flex-direction:row}.player-content[data-v-c79dd7e8],.player-video[data-v-c79dd7e8]{width:100%;height:100%;display:flex;justify-content:center;align-items:center}.player-video[data-v-c79dd7e8]{position:relative}.player-video video[data-v-c79dd7e8]{width:100%;height:100%;-o-object-fit:contain;object-fit:contain;max-width:100%;max-height:100%}.page-container[data-v-676c6149]{display:flex;height:85vh;overflow:hidden}.sidebar-left[data-v-676c6149]{width:300px;background-color:var(--background-secondly);border-right:1px solid #404040;display:flex;flex-direction:column;padding-bottom:15px}.sidebar-left .sidebar-header[data-v-676c6149]{padding:16px;border-bottom:1px solid #404040}.sidebar-left .sidebar-header h3[data-v-676c6149]{margin:0 0 12px 0;font-size:16px;color:#fff}.sidebar-left .sidebar-header .header-buttons[data-v-676c6149]{display:flex;gap:8px}.sidebar-left .sidebar-header .header-buttons .header-btn[data-v-676c6149]{flex:1;background-color:#409eff;color:#fff;border:none;padding:8px 12px;border-radius:4px;cursor:pointer;font-size:12px}.sidebar-left .sidebar-header .header-buttons .header-btn[data-v-676c6149]:hover{background-color:#66b1ff}.sidebar-left .video-source-list[data-v-676c6149]{flex:1;overflow-y:auto;padding:8px}.sidebar-left .video-source-list .video-source-item[data-v-676c6149]{display:flex;align-items:center;padding:12px;margin-bottom:8px;background-color:#3d3d3d;border-radius:4px;cursor:pointer;transition:all .3s}.sidebar-left .video-source-list .video-source-item[data-v-676c6149]:hover{background-color:#4d4d4d}.sidebar-left .video-source-list .video-source-item.active[data-v-676c6149]{background-color:#409eff}.sidebar-left .video-source-list .video-source-item.active .source-name[data-v-676c6149],.sidebar-left .video-source-list .video-source-item.active .source-status[data-v-676c6149]{color:#fff}.sidebar-left .video-source-list .video-source-item .source-info[data-v-676c6149]{flex:1}.sidebar-left .video-source-list .video-source-item .source-info .source-name[data-v-676c6149]{font-size:14px;color:#fff;margin-bottom:4px}.sidebar-left .video-source-list .video-source-item .source-info .source-status[data-v-676c6149]{font-size:12px;color:#909399;display:flex;align-items:center}.sidebar-left .video-source-list .video-source-item .source-info .source-status .status-dot[data-v-676c6149]{width:6px;height:6px;border-radius:50%;margin-right:4px}.sidebar-left .video-source-list .video-source-item .source-info .source-status .status-dot.online[data-v-676c6149]{background-color:#67c23a}.sidebar-left .video-source-list .video-source-item .source-info .source-status .status-dot.offline[data-v-676c6149]{background-color:#f56c6c}.main-preview[data-v-676c6149]{flex:1;background-color:var(--background-secondly);display:flex;flex-direction:column}.main-preview .preview-header[data-v-676c6149]{padding:16px;border-bottom:1px solid #404040}.main-preview .preview-header h3[data-v-676c6149]{margin:0;font-size:16px;color:#fff}.main-preview .preview-content[data-v-676c6149]{flex:1;padding:20px}.main-preview .preview-content .grid-container[data-v-676c6149]{width:100%;height:100%;display:grid;grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(4,1fr);gap:10px}.main-preview .preview-content .grid-container .grid-item[data-v-676c6149]{width:100%;height:100%;display:flex;flex-direction:column}.main-preview .preview-content .grid-container .grid-item .player[data-v-676c6149]{width:100%;height:100%;display:flex;flex-direction:column;background-color:#000;border-radius:4px;overflow:hidden}.main-preview .preview-content .grid-container .grid-item .player .player-content .player-video[data-v-676c6149],.main-preview .preview-content .grid-container .grid-item .player .player-content[data-v-676c6149]{width:100%;height:100%;display:flex;justify-content:center;align-items:center}.main-preview .preview-content .grid-container .grid-item .player .player-content .player-video video[data-v-676c6149]{width:100%;height:100%;-o-object-fit:contain;object-fit:contain;max-width:100%;max-height:100%}.sidebar-right[data-v-676c6149]{width:350px;background-color:var(--background-secondly);border-left:1px solid #404040;display:flex;flex-direction:column}.sidebar-right .form-header[data-v-676c6149]{padding:16px;border-bottom:1px solid #404040}.sidebar-right .form-header h3[data-v-676c6149]{margin:0;font-size:16px;color:#fff}.sidebar-right .form-content[data-v-676c6149]{flex:1;padding:20px;overflow-y:auto}.onvif-modal-content .modal-header[data-v-676c6149]{margin-bottom:16px;display:flex;justify-content:flex-end}.ant-table-wrapper .ant-table[data-v-676c6149]{background-color:#1a1a1a;color:#fff}.ant-table-wrapper .ant-table .ant-table-thead>tr>th[data-v-676c6149]{background-color:#2a2a2a;color:#fff;border-bottom:1px solid #404040}.ant-table-wrapper .ant-table .ant-table-tbody>tr>td[data-v-676c6149]{border-bottom:1px solid #303030;color:#fff}.ant-table-wrapper .ant-table .ant-table-tbody>tr:hover>td[data-v-676c6149]{background-color:#2a2a2a}@media screen and (max-width:1200px){.sidebar-left[data-v-676c6149]{width:250px}.sidebar-right[data-v-676c6149]{width:300px}}@media screen and (orientation:landscape) and (max-height:600px){.page-container[data-v-676c6149]{height:100vh}.sidebar-left[data-v-676c6149],.sidebar-right[data-v-676c6149]{max-height:100vh}.grid-container[data-v-676c6149]{gap:5px!important}}[data-v-676c6149]::-webkit-scrollbar{width:6px;height:6px}[data-v-676c6149]::-webkit-scrollbar-track{background:#1a1a1a}[data-v-676c6149]::-webkit-scrollbar-thumb{background:#404040;border-radius:3px}[data-v-676c6149]::-webkit-scrollbar-thumb:hover{background:#606060}