#root,body,html{min-height:100%}body{margin:0}*{box-sizing:border-box}#root,body,html{height:100%;margin:0;padding:0;width:100%}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;overflow:hidden}button,input{font-family:inherit}.login-page{align-items:center;background:#f4f7fb;height:100vh;justify-content:center;padding:30px}.login-container,.login-page{display:flex;overflow:hidden;width:100%}.login-container{background:#fff;border-radius:20px;box-shadow:0 15px 50px #0000001a;max-width:1100px;min-height:650px}.login-brand{align-items:center;background:linear-gradient(145deg,#1769aa,#0b4778);color:#fff;display:flex;padding:60px;width:45%}.brand-content{max-width:390px}.login-brand .brand-logo{align-items:center;background:#fff;border-radius:18px;color:#1769aa;display:flex;font-size:36px;font-weight:700;height:70px;justify-content:center;margin-bottom:30px;width:70px}.login-brand h1{font-size:42px;font-weight:700;margin:0 0 18px}.login-brand p{font-size:17px;line-height:1.7;margin-bottom:35px;opacity:.9}.brand-feature{align-items:center;display:flex;font-size:15px;gap:12px;margin:18px 0}.brand-feature span:first-child{background:#fff3;border-radius:50%;height:24px;width:24px}.brand-feature span:first-child,.login-form-section{align-items:center;display:flex;justify-content:center}.login-form-section{padding:60px;width:55%}.login-form-container{max-width:420px;width:100%}.login-form-container h2{color:#202733;font-size:32px;margin:0 0 8px}.login-subtitle{color:#7a8494;font-size:15px;margin:0 0 35px}.form-group{margin-bottom:22px}.form-group label{color:#394150;display:block;font-size:14px;font-weight:600;margin-bottom:8px}.form-group input{border:1px solid #d9dee7;border-radius:9px;font-size:15px;height:50px;outline:none;padding:0 15px;transition:.2s;width:100%}.form-group input:focus{border-color:#1769aa;box-shadow:0 0 0 3px #1769aa1a}.password-label-row{align-items:center;display:flex;justify-content:space-between}.forgot-password{background:none;border:none;color:#1769aa;cursor:pointer;font-size:13px;padding:0}.login-button{background:#1769aa;border:none;border-radius:9px;color:#fff;cursor:pointer;font-size:16px;font-weight:600;height:52px;margin-top:5px;transition:.2s;width:100%}.login-button:hover{background:#0f578f}.login-footer{color:#9aa3b1;font-size:12px;margin-top:35px;text-align:center}.mobile-logo{display:none}.camera-page{background:#f5f7fb;color:#1e293b;display:flex;flex-direction:column;height:100vh;overflow:hidden;width:100%}.camera-header{background:#fff;border-bottom:1px solid #e7eaf0;flex-shrink:0;height:68px;justify-content:space-between;min-height:68px;padding:0 34px;z-index:20}.brand-section,.camera-header{align-items:center;display:flex}.brand-section{gap:12px}.camera-header .brand-logo{align-items:center;background:linear-gradient(135deg,#6c63ff,#8b5cf6);border-radius:10px;box-shadow:0 5px 12px #6c63ff38;color:#fff;display:flex;font-size:18px;font-weight:800;height:38px;justify-content:center;width:38px}.brand-text h1{color:#172033;font-size:17px;font-weight:700;margin:0}.brand-text span{color:#8a93a6;display:block;font-size:11px;margin-top:1px}.header-actions{align-items:center;display:flex;gap:16px}.connection-status{align-items:center;color:#64748b;display:flex;font-size:11px;font-weight:600;gap:7px}.status-dot{background:#22c55e;border-radius:50%;box-shadow:0 0 0 4px #22c55e1f;flex-shrink:0;height:7px;width:7px}.logout-button{align-items:center;background:#fff;border:1px solid #e3e7ee;border-radius:8px;color:#475569;cursor:pointer;display:flex;font-size:12px;font-weight:600;gap:6px;padding:8px 13px;transition:all .2s ease}.logout-button:hover{background:#f8fafc;border-color:#cbd5e1}.camera-main{display:flex;flex:1 1;flex-direction:column;margin:0 auto;max-width:1450px;min-height:0;overflow:hidden;padding:6px 34px 4px;width:100%}.page-heading{align-items:center;display:flex;flex-shrink:0;justify-content:space-between;margin-bottom:10px}.page-heading h2{color:#172033;font-size:25px;letter-spacing:-.4px;line-height:1.2;margin:0}.page-heading p{color:#7a8497;font-size:12px;margin:5px 0 0}.camera-count{background:#fff;border:1px solid #e8ebf1;border-radius:10px;min-width:105px;padding:9px 14px;text-align:center}.camera-count strong{color:#6258d9;display:block;font-size:18px;line-height:1.1}.camera-count span{color:#8992a4;display:block;font-size:10px;margin-top:2px}.camera-api-error{background:#fff7f7;border:1px solid #f3d2d2;border-radius:9px;gap:12px;margin-bottom:14px;padding:10px 14px}.camera-api-error,.camera-error-icon{align-items:center;display:flex;flex-shrink:0}.camera-error-icon{background:#fee2e2;border-radius:8px;color:#dc2626;height:30px;justify-content:center;width:30px}.camera-error-content{flex:1 1;min-width:0}.camera-error-content strong{color:#991b1b;display:block;font-size:12px}.camera-error-content p{color:#b45353;font-size:11px;margin:2px 0 0}.camera-api-error button{background:#dc2626;border:none;border-radius:7px;color:#fff;cursor:pointer;flex-shrink:0;font-size:11px;font-weight:600;padding:7px 11px}.camera-layout{grid-gap:18px;align-items:stretch;display:grid;flex:1 1;gap:18px;grid-template-columns:300px minmax(0,1fr);min-height:0;overflow:hidden;width:100%}.camera-sidebar{background:#fff;border:1px solid #e7eaf0;border-radius:14px;box-shadow:0 4px 15px rgba(31,41,55,.035);display:flex;flex-direction:column;min-height:0;min-width:0;overflow:hidden;padding:16px}.sidebar-header{align-items:center;display:flex;flex-shrink:0;justify-content:space-between;margin-bottom:12px}.sidebar-header h3{color:#1e293b;font-size:15px;margin:0}.sidebar-header p{color:#929aaa;font-size:10px;margin:3px 0 0}.camera-total{background:#f0efff;border-radius:7px;color:#6258d9;font-size:11px;font-weight:700;height:25px;justify-content:center;min-width:25px}.camera-search,.camera-total{align-items:center;display:flex}.camera-search{background:#fafbfc;border:1px solid #e5e8ef;border-radius:8px;flex-shrink:0;gap:8px;height:38px;margin-bottom:12px;min-height:38px;padding:0 10px}.search-icon{color:#98a1b2;font-size:18px;transform:rotate(-20deg)}.camera-search input{background:#0000;border:0;color:#334155;font-size:12px;min-width:0;outline:none;width:100%}.camera-search input::placeholder{color:#a4acba}.camera-list{flex:1 1;min-height:0;overflow-x:hidden;overflow-y:auto;padding-right:3px}.camera-list::-webkit-scrollbar{width:5px}.camera-list::-webkit-scrollbar-track{background:#0000}.camera-list::-webkit-scrollbar-thumb{background:#d7dbe4;border-radius:10px}.camera-list::-webkit-scrollbar-thumb:hover{background:#c1c6d1}.camera-tree{display:flex;flex-direction:column;gap:5px}.camera-group{background:#fff;border:1px solid #edf0f4;border-radius:9px;overflow:hidden}.camera-group[open]{background:#fafaff}.camera-group-header{align-items:center;cursor:pointer;display:flex;gap:8px;list-style:none;min-height:42px;padding:7px 9px;-webkit-user-select:none;user-select:none}.camera-group-header::-webkit-details-marker{display:none}.tree-chevron{align-items:center;background:#f0efff;border-radius:5px;color:#6c63ff;display:flex;flex-shrink:0;font-size:15px;height:18px;justify-content:center;transition:transform .2s ease;width:18px}.camera-group[open]>.camera-group-header .tree-chevron{transform:rotate(90deg)}.group-info{display:flex;flex-direction:column;gap:1px;min-width:0}.group-info strong{color:#273248;font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.group-info span{color:#98a1b1;font-size:9px}.camera-subgroups{padding:0 7px 7px 27px}.camera-subgroup{border-top:1px solid #eef0f4}.camera-subgroup-header{align-items:center;cursor:pointer;display:flex;gap:7px;list-style:none;min-height:34px;padding:5px 3px;-webkit-user-select:none;user-select:none}.camera-subgroup-header::-webkit-details-marker{display:none}.camera-subgroup-header .tree-chevron{background:#0000;color:#9aa2b1;font-size:13px;height:15px;width:15px}.camera-subgroup[open]>.camera-subgroup-header .tree-chevron{transform:rotate(90deg)}.subgroup-name{color:#566174;flex:1 1;font-size:11px;font-weight:600;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.subgroup-count{align-items:center;background:#f3f4f7;border-radius:5px;color:#8b94a4;display:flex;font-size:9px;font-weight:600;height:19px;justify-content:center;min-width:19px}.subgroup-cameras{display:flex;flex-direction:column;gap:3px;padding:1px 0 6px 22px}.camera-item{align-items:center;background:#fff;border:1px solid #0000;border-radius:7px;cursor:pointer;display:flex;gap:8px;min-height:37px;padding:6px 8px;text-align:left;transition:background .15s ease,border-color .15s ease;width:100%}.camera-item:hover{background:#f7f6ff;border-color:#e1ddff}.camera-item.active{background:#f0eeff;border-color:#aaa3f2}.camera-status-icon{align-items:center;background:#edf0f4;border-radius:5px;display:flex;flex-shrink:0;height:17px;justify-content:center;width:17px}.camera-status-icon span{background:#9aa3b2;border-radius:50%;height:5px;width:5px}.camera-status-icon.active{background:#e3e0ff}.camera-status-icon.active span{background:#6c63ff;box-shadow:0 0 0 3px #6c63ff1a}.camera-item-info{display:flex;flex:1 1;flex-direction:column;gap:1px;min-width:0}.camera-item-info strong{color:#334155;font-size:11px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.camera-item-info span{color:#9aa3b2;font-size:8px}.camera-live-label{background:#f1f5f9;border-radius:3px;color:#94a3b8;flex-shrink:0;font-size:7px;font-weight:800;padding:2px 4px}.camera-item.active .camera-live-label{background:#e5e2ff;color:#6258d9}.camera-player-section,.player-card{height:100%;min-height:0;min-width:0;overflow:hidden;width:100%}.player-card{background:#000;border:1px solid #e7eaf0;border-radius:14px;box-shadow:0 4px 15px rgba(31,41,55,.035);display:flex}.player-header{border-bottom:1px solid #edf0f4;flex-shrink:0;height:62px;justify-content:space-between;min-height:62px;padding:12px 17px}.player-header,.player-title{align-items:center;display:flex}.player-title{gap:10px;min-width:0}.player-camera-icon{align-items:center;background:#f1f0ff;border-radius:8px;display:flex;flex-shrink:0;font-size:15px;height:34px;justify-content:center;width:34px}.player-title h3{color:#202b3d;font-size:14px;margin:0}.player-title h3,.player-title p{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.player-title p{color:#929aaa;font-size:9px;margin:2px 0 0}.player-title p span{color:#c0c5ce;margin:0 3px}.live-badge{align-items:center;background:#fff1f2;border-radius:6px;color:#e5484d;display:flex;flex-shrink:0;font-size:9px;font-weight:800;gap:5px;letter-spacing:.5px;padding:5px 8px}.live-badge span{background:#e5484d;border-radius:50%;box-shadow:0 0 0 3px #e5484d1f;height:5px;width:5px}.video-container{align-items:center;display:flex;justify-content:center;position:relative}.camera-player,.video-container{background:#000;height:100%;min-height:0;min-width:0;overflow:hidden;width:100%}.camera-player{border:0;display:block;margin:0;padding:0}.video-placeholder{align-items:center;color:#fff;display:flex;height:100%;justify-content:center;overflow:hidden;position:relative;width:100%}.empty-video{background:radial-gradient(circle at center,#273248 0,#141b2a 55%,#0e1420 100%)}.selected-video{background:radial-gradient(circle at center,#29364b 0,#151e2e 60%,#0d1420 100%)}.video-center{max-width:400px;padding:25px;text-align:center}.large-video-icon{align-items:center;background:#ffffff1f;border:1px solid #ffffff26;border-radius:50%;display:flex;font-size:20px;height:58px;justify-content:center;margin:0 auto 14px;width:58px}.video-center h3{font-size:17px;font-weight:600;margin:0}.video-center p{color:#aeb7c7;font-size:11px;margin:6px 0 14px}.loading-stream{align-items:center;background:#ffffff12;border-radius:6px;color:#c2c9d5;display:inline-flex;font-size:9px;gap:7px;padding:6px 10px}.loading-stream span{background:#22c55e;border-radius:50%;height:6px;width:6px}.empty-video-content{max-width:400px;padding:20px;text-align:center}.empty-camera-icon{align-items:center;background:#ffffff14;border-radius:16px;display:flex;font-size:24px;height:60px;justify-content:center;margin:0 auto 14px;width:60px}.empty-video-content h3{color:#fff;font-size:17px;margin:0}.empty-video-content p{color:#9da8ba;font-size:11px;line-height:1.6;margin:7px 0 16px}.choose-camera-button{background:#6c63ff;border:0;border-radius:7px;color:#fff;cursor:pointer;font-size:10px;font-weight:600;padding:8px 13px;transition:background .2s ease}.choose-camera-button:hover{background:#5d54e8}.video-overlay-top{align-items:center;color:#fff;display:flex;font-size:9px;font-weight:700;justify-content:space-between;left:12px;pointer-events:none;position:absolute;right:12px;top:12px}.video-overlay-top>span:last-child{background:#dc2626d9;border-radius:5px;padding:4px 7px}.stream-quality{background:#0006;border-radius:4px;padding:3px 5px}.video-overlay-bottom{bottom:11px;color:#d7dce5;display:flex;font-size:9px;justify-content:space-between;left:12px;pointer-events:none;position:absolute;right:12px}.video-overlay-bottom span{background:#0000006b;border-radius:4px;padding:4px 7px}.player-footer{background:#fcfcfd;border-top:1px solid #edf0f4;flex-shrink:0;height:42px;justify-content:space-between;min-height:42px;padding:8px 15px}.footer-info,.player-footer{align-items:center;display:flex}.footer-info{color:#99a1af;font-size:9px;gap:6px}.info-icon{border:1px solid #c7ccd5;border-radius:50%;font-size:8px;height:15px;justify-content:center;width:15px}.info-icon,.stream-status{align-items:center;display:flex}.stream-status{color:#64748b;font-size:9px;font-weight:600;gap:6px}.camera-loading{align-items:center;display:flex;flex-direction:column;justify-content:center;min-height:180px;padding:20px;text-align:center}.loading-spinner{animation:camera-spin .8s linear infinite;border:3px solid #e5e7eb;border-radius:50%;border-top-color:#6c63ff;height:24px;margin-bottom:10px;width:24px}.camera-loading strong{color:#566174;font-size:11px}.camera-loading span{color:#a0a8b6;font-size:9px;margin-top:4px}@keyframes camera-spin{to{transform:rotate(1turn)}}.no-results{color:#8992a3;padding:35px 15px;text-align:center}.no-results-icon{font-size:20px;margin-bottom:8px}.no-results strong{color:#566174;display:block;font-size:11px}.no-results span{display:block;font-size:9px;margin-top:4px}.camera-footer{align-items:center;color:#a0a7b4;display:flex;flex-shrink:0;font-size:9px;height:30px;justify-content:space-between;margin:0 auto;max-width:1450px;min-height:30px;padding:0 34px;width:100%}@media (max-width:1000px){.camera-header{padding:0 22px}.camera-main{padding:20px 22px 16px}.camera-layout{grid-template-columns:270px minmax(0,1fr)}.connection-status{display:none}.camera-footer{padding-left:22px;padding-right:22px}}@media (max-width:760px){.camera-page{height:100vh}.camera-header{height:60px;min-height:60px;padding:0 14px}.camera-header .brand-logo{border-radius:9px;font-size:16px;height:34px;width:34px}.brand-section{gap:9px}.brand-text h1{font-size:14px}.brand-text span{display:none}.logout-button{font-size:10px;padding:7px 9px}.camera-main{overflow:hidden;padding:16px 14px 10px}.page-heading{align-items:center;margin-bottom:12px}.page-heading h2{font-size:21px}.page-heading p{font-size:10px}.camera-count{min-width:78px;padding:7px 9px}.camera-count strong{font-size:15px}.camera-count span{font-size:8px}.camera-layout{display:flex;flex-direction:column;gap:10px;min-height:0}.camera-sidebar{flex:0 0 210px;min-height:0;order:2;padding:12px}.player-header{height:52px;min-height:52px;padding:9px 12px}.player-camera-icon{font-size:13px;height:30px;width:30px}.player-title h3{font-size:12px}.live-badge,.player-title p{font-size:8px}.live-badge{padding:4px 6px}.video-container{min-height:0}.player-footer{height:36px;min-height:36px;padding:7px 11px}.footer-info,.stream-status{font-size:8px}.camera-footer{display:none}}@media (max-width:480px){.camera-main{padding:12px 10px 8px}.page-heading h2{font-size:19px}.page-heading p{font-size:9px}.camera-sidebar{flex-basis:190px}.camera-item{min-height:34px}.camera-item-info strong{font-size:10px}.camera-item-info span{font-size:7px}.camera-live-label{display:none}}@media (max-width:380px){.camera-sidebar{flex-basis:175px}.player-header{padding:8px 9px}.live-badge{display:none}}
/*# sourceMappingURL=main.ee1a2bb4.css.map*/