:root{--cctv-text:#212121;--cctv-muted:#757575;--cctv-accent:#8e1b1b;--cctv-teal:#26a69a;--cctv-brand:#1b6c73;--cctv-page:#fafafa;--cctv-card:#d6d6d6;--cctv-card-strip:#e2e2e2;--cctv-line:#e0e0e0;--cctv-down:#c62828;--cctv-maintenance:#ef6c00;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}*,:before,:after{box-sizing:border-box}html,body,#root{height:100%}body{color:var(--cctv-text);background:#fff;margin:0;font-family:Roboto,Helvetica Neue,Arial,sans-serif;font-size:14px}button{font:inherit}a{color:inherit;text-decoration:none}.icon{display:block}.cctv-muted{color:var(--cctv-muted)}.cctv-error{color:var(--cctv-down)}.cctv-pad{padding:16px}.cctv-loading{color:var(--cctv-muted);padding:24px}.cctv-page{flex-direction:column;height:100%;display:flex}.cctv-topbar{border-bottom:1px solid var(--cctv-line);background:#fff;flex:none;align-items:center;height:56px;display:flex}.cctv-topbar-icons{flex:none;align-items:center;gap:2px;padding:0 8px;display:flex}.cctv-icon-button{width:36px;height:36px;color:var(--cctv-text);cursor:pointer;background:0 0;border:0;border-radius:50%;justify-content:center;align-items:center;display:inline-flex}.cctv-icon-button:hover{background:#0000000f}.cctv-icon-button:focus-visible,.cctv-tabs a:focus-visible,.cctv-sidebar button:focus-visible,.cctv-tile-body:focus-visible{outline:2px solid var(--cctv-accent);outline-offset:2px}.cctv-signout{color:var(--cctv-muted);margin:0 8px}.cctv-topbar-tabs{flex:1;min-width:0;height:100%}.cctv-tabs{scrollbar-width:thin;height:100%;display:flex;overflow-x:auto}.cctv-tabs a{white-space:nowrap;border-bottom:2px solid #0000;align-items:center;padding:0 12px;font-weight:500;display:flex}.cctv-tabs a:hover{background:#0000000a}.cctv-tabs a.active{border-bottom-color:var(--cctv-accent)}.cctv-body{flex:1;min-height:0;display:flex}.cctv-sidebar{border-right:1px solid var(--cctv-line);background:#fff;flex-direction:column;flex:none;width:240px;display:flex}.cctv-sidebar-list{flex:1;min-height:0;padding:8px 0;overflow-y:auto}.cctv-views-menu{border-top:1px solid var(--cctv-line);flex:none;padding:8px;position:relative}.cctv-sidebar .cctv-views-toggle{border:1px solid var(--cctv-line);text-align:center;border-radius:4px;font-weight:600}.cctv-sidebar .cctv-views-toggle[aria-expanded=true]{color:var(--cctv-accent)}.cctv-views-popup{z-index:20;border:1px solid var(--cctv-line);background:#fff;border-radius:4px;width:max-content;min-width:calc(100% - 16px);max-width:min(320px,90vw);max-height:50vh;margin:0;padding:4px 0;list-style:none;position:absolute;bottom:calc(100% - 4px);left:8px;overflow-y:auto;box-shadow:0 4px 16px #00000026}.cctv-sidebar button{text-align:left;width:100%;color:var(--cctv-text);cursor:pointer;background:0 0;border:0;padding:8px 10px;display:block}.cctv-sidebar button:hover{background:#0000000a}.cctv-sidebar button.active{color:var(--cctv-accent)}.cctv-main{background:var(--cctv-page);flex:1;min-width:0;overflow-y:auto}.cctv-grid{grid-template-columns:repeat(auto-fill, minmax(min(var(--cctv-tile-width,300px), 100%), 1fr));gap:16px 18px;padding:12px 16px 24px;display:grid}.cctv-tile{min-width:0;margin:0}.cctv-tile figcaption{color:var(--cctv-muted);white-space:nowrap;text-overflow:ellipsis;margin:0 0 4px;font-size:12px;font-weight:700;overflow:hidden}.cctv-tile-body{aspect-ratio:1;background:var(--cctv-card);cursor:pointer;border:0;justify-content:center;align-items:center;width:100%;padding:16px 8px;display:flex;position:relative}.cctv-tile-body img{background:#000;border:3px solid #f2f2f2;max-width:100%;max-height:100%;display:block;box-shadow:0 1px 2px #00000040}.cctv-tile-empty{color:#9e9e9e}.cctv-tile-ptz{color:#212121;position:absolute;bottom:4px;left:50%;transform:translate(-50%)}.cctv-tile-actions{background:var(--cctv-card-strip);border-top:2px solid #fff;justify-content:center;align-items:center;gap:6px;height:28px;display:flex}.cctv-tile-actions a,.cctv-tile-actions button{color:var(--cctv-teal);cursor:pointer;background:0 0;border:0;border-radius:3px;padding:3px;display:inline-flex}.cctv-tile-actions a:hover,.cctv-tile-actions button:hover{background:#0000000f}.cctv-tile-actions button.is-restart-running .icon{animation:1s linear infinite cctv-spin}.cctv-tile-actions button.is-restart-ok{color:#2e7d32}.cctv-tile-actions button.is-restart-failed{color:var(--cctv-down)}@keyframes cctv-spin{to{transform:rotate(360deg)}}.cctv-tile.is-down figcaption{color:var(--cctv-down)}.cctv-tile.is-down .cctv-tile-body{box-shadow:inset 0 0 0 2px var(--cctv-down)}.cctv-tile.is-maintenance figcaption,.cctv-tile.is-maintenance .cctv-tile-actions button[aria-pressed=true]{color:var(--cctv-maintenance)}.cctv-tile.is-inactive .cctv-tile-body img{filter:grayscale();opacity:.6}.cctv-glyph{background-color:currentColor;flex:none;display:inline-block;-webkit-mask:url(/assets/cctv-camera-CgCbOXAU.png) 50%/contain no-repeat;mask:url(/assets/cctv-camera-CgCbOXAU.png) 50%/contain no-repeat}.cctv-place{position:relative}.cctv-map-button{z-index:2;color:var(--cctv-text);position:absolute;top:6px;left:8px}.cctv-map-button.is-open{color:var(--cctv-accent)}.cctv-place.has-map-button .cctv-grid,.cctv-place.has-map-button>.cctv-pad,.cctv-place.has-map-button .cctv-map{padding-left:52px}.cctv-map{padding:12px 16px 4px}.cctv-map-tools{flex-wrap:wrap;align-items:center;gap:6px 16px;margin-bottom:8px;font-size:13px;display:flex}.cctv-map-style,.cctv-map-switch{align-items:center;gap:6px;display:inline-flex}.cctv-map-style select{font:inherit;padding:4px 6px}.cctv-map-switch input{accent-color:var(--cctv-accent)}.cctv-link-button[aria-pressed=true]{color:var(--cctv-accent)}.cctv-map-hint,.cctv-map-empty{margin:0 0 8px;font-size:13px}.cctv-map-frame{justify-content:center;display:flex}.cctv-map-stage{border:1px solid var(--cctv-line);touch-action:none;-webkit-user-select:none;user-select:none;background:#fff;min-width:0;max-width:100%;line-height:0;display:inline-block;position:relative}.cctv-map-stage img{max-width:100%;height:auto;display:block}.cctv-map-camera{cursor:pointer;background:0 0;border:0;border-radius:3px;padding:1px;display:inline-flex;position:absolute}.cctv-map-icon{width:calc(48px * var(--mark-scale,1));height:calc(20px * var(--mark-scale,1));fill:currentColor;display:block}.cctv-map-camera.is-white .cctv-map-icon{stroke:#333;stroke-width:1.2px}.cctv-map-preview{z-index:5;pointer-events:none;background:#e8e8e8;border:1px solid #bdbdbd;width:min(340px,40%);min-width:200px;padding:6px;line-height:normal;position:absolute;transform:translate(22px,14px);box-shadow:0 2px 10px #00000059}.cctv-map-preview.is-left{transform:translate(calc(-100% - 22px),14px)}.cctv-map-preview.is-up{transform:translate(22px,calc(-100% - 14px))}.cctv-map-preview.is-left.is-up{transform:translate(calc(-100% - 22px),calc(-100% - 14px))}.cctv-map-preview img{width:100%;height:auto;display:block}.cctv-map-preview-empty{aspect-ratio:16/9;background:var(--cctv-card);color:#9e9e9e;justify-content:center;align-items:center;display:flex}.cctv-map-preview-name{color:#616161;margin-top:6px;font-size:12px;font-weight:600;display:block}.cctv-map-camera.is-green{color:#2e7d32}.cctv-map-camera.is-black{color:#111}.cctv-map-camera.is-white{color:#fff}.cctv-map-camera.is-red{color:var(--cctv-down)}.cctv-map-camera.is-down{outline:2px solid var(--cctv-down)}.cctv-map-camera.is-inactive{opacity:.45}.cctv-map-camera:hover,.cctv-map-camera:focus-visible{background:#26a69a40;outline:none}.cctv-map-stage.is-arranging .cctv-map-camera{cursor:grab}.cctv-map-stage.is-arranging .cctv-map-camera:active{cursor:grabbing}.cctv-map-camera.is-hidden{opacity:.35}.cctv-map-unplaced{flex-wrap:wrap;align-items:center;gap:4px 8px;margin-top:8px;font-size:13px;display:flex}.cctv-form{flex-direction:column;gap:14px;padding-top:8px;display:flex}.cctv-form label{color:var(--cctv-muted);flex-direction:column;gap:4px;font-size:12px;display:flex}.cctv-form input:not([type=checkbox]){font:inherit;color:var(--cctv-text);border:1px solid #bdbdbd;border-radius:4px;padding:7px 8px;font-size:14px}.cctv-form .cctv-check{color:var(--cctv-text);flex-direction:row;align-items:center;gap:8px;font-size:14px}.cctv-form-row{flex-wrap:wrap;gap:8px 18px;display:flex}.cctv-form .cctv-form-row label{color:var(--cctv-text);flex-direction:row;align-items:center;gap:6px;font-size:14px}.cctv-form .cctv-form-row input{width:76px}.cctv-menu{grid-template-columns:1fr auto 1fr;align-items:start;gap:24px;max-width:960px;min-height:100%;margin:0 auto;padding:80px 16px 48px;display:grid}.cctv-menu-col{margin:0;padding:0;list-style:none}.cctv-menu-col li a{color:#212121;white-space:nowrap;text-overflow:ellipsis;padding:0 16px;font-size:16px;line-height:48px;display:block;overflow:hidden}.cctv-menu-col li a:hover,.cctv-menu-col li a:focus-visible{background:#f2f2f2}.cctv-menu-right{text-align:right}.cctv-menu-mark{margin-top:176px;position:sticky;top:160px}.cctv-menu-mark img{background:#fff;width:175px;height:229px;padding:3px;display:block;box-shadow:0 1px 4px #00000059}.cctv-center{justify-content:center;align-items:center;min-height:100%;padding:16px;display:flex}.cctv-center.cctv-top{align-items:flex-start}.cctv-card{background:#fff;border-radius:4px;width:100%;max-width:360px;padding:16px 20px;box-shadow:0 2px 1px -1px #0003,0 1px 1px #00000024,0 1px 3px #0000001f}.cctv-card h1{margin:4px 0 16px;font-size:18px;font-weight:400}.cctv-login{flex-direction:column;gap:12px;display:flex}.cctv-login-mark{justify-content:center;display:flex}.cctv-login-mark img{border-radius:10px;display:block}.cctv-login h1{text-align:center;margin-bottom:4px}.cctv-login label{color:var(--cctv-muted);flex-direction:column;gap:4px;font-size:12px;display:flex}.cctv-login input:not([type=checkbox]){font:inherit;color:var(--cctv-text);background:0 0;border:0;border-bottom:1px solid #9e9e9e;padding:8px 0;font-size:15px}.cctv-login input:focus{border-bottom-color:var(--cctv-brand);outline:none}.cctv-login input[type=checkbox]{accent-color:var(--cctv-brand)}.cctv-login .cctv-button{background:var(--cctv-brand)}.cctv-login .cctv-button:focus-visible{outline-color:var(--cctv-brand)}.cctv-login .cctv-check{color:var(--cctv-text);flex-direction:row;align-items:center;gap:8px;font-size:13px}.cctv-button{background:var(--cctv-accent);color:#fff;cursor:pointer;border:0;border-radius:4px;margin-top:4px;padding:9px 16px;font-weight:500}.cctv-button:disabled{opacity:.5;cursor:default}.cctv-settings dl{margin:0}.cctv-settings dl div{justify-content:space-between;padding:6px 0;font-size:13px;display:flex}.cctv-settings dt{font-weight:700}.cctv-settings dd{margin:0}.cctv-settings dl div{align-items:center;gap:16px;min-height:36px}.cctv-status-ok{color:#2e7d32;font-weight:600}.cctv-status-warn{color:var(--cctv-maintenance);font-weight:600}.cctv-status-bad{color:var(--cctv-down);font-weight:600}.cctv-status-none{color:var(--cctv-muted)}.cctv-link-button{color:var(--cctv-text);font:inherit;cursor:pointer;background:0 0;border:0;border-radius:4px;align-items:center;gap:4px;padding:6px 8px;text-decoration:none;display:inline-flex}.cctv-link-button:hover{background:#f2f2f2}.cctv-link-button:disabled{opacity:.5;cursor:default}.cctv-button-flat{color:var(--cctv-text)!important;background:0 0!important}.cctv-panel{flex-direction:column;width:min(720px,100%);max-height:calc(100vh - 32px);display:flex}.cctv-panel.is-wide{width:min(1280px,100%)}.cctv-panel-body{padding:4px 16px 16px;font-size:13px;overflow:auto}.cctv-panel-footer{border-top:1px solid var(--cctv-line);justify-content:flex-end;gap:8px;padding:12px 16px;display:flex}.cctv-panel-footer .cctv-button{margin-top:0}.cctv-table-wrap{overflow-x:auto}.cctv-table{border-collapse:collapse;width:100%}.cctv-table th,.cctv-table td{border-bottom:1px solid var(--cctv-line);text-align:left;vertical-align:top;padding:6px 8px}.cctv-table th{white-space:nowrap;background:#fff;font-weight:600;position:sticky;top:0}.cctv-table tr.is-off td{color:var(--cctv-muted)}.cctv-rows{margin:0;padding:0;list-style:none}.cctv-rows li{border-bottom:1px solid var(--cctv-line);justify-content:space-between;align-items:center;gap:12px;padding:6px 0;display:flex}.cctv-import-top{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;padding:8px 0;display:flex}.cctv-file{align-items:center;gap:8px;display:flex}.cctv-import-hint{margin:0 0 8px}.cctv-import-summary .is-ok{color:#2e7d32;font-weight:600}.cctv-import-summary .is-warn{color:var(--cctv-maintenance);font-weight:600}.cctv-import-table tr.is-ok td{background:#e8f5e9}.cctv-import-table tr.is-warn td{background:#fff3e0}.cctv-import-notes{min-width:260px}.cctv-settings-home{margin:12px auto 0;display:flex}.cctv-dialog-backdrop{z-index:10;background:#0009;justify-content:center;align-items:center;padding:16px;display:flex;position:fixed;inset:0}.cctv-dialog{background:#fff;border-radius:4px;width:min(1100px,100%);overflow:hidden}.cctv-dialog.is-narrow{width:min(460px,100%)}.cctv-dialog header{justify-content:space-between;align-items:center;padding:4px 4px 4px 16px;display:flex}.cctv-dialog h2{margin:0;font-size:15px;font-weight:500}.cctv-video{aspect-ratio:16/9;background:#000;justify-content:center;align-items:center;display:flex}.cctv-video video{width:100%;height:100%}.cctv-video-error{color:#eee;text-align:center;padding:24px}.cctv-camera-page{background:#000;align-items:center;min-height:100%;display:flex}.cctv-camera-page .cctv-video{width:100%}@media (width<=640px){.cctv-sidebar{width:140px}.cctv-grid{grid-template-columns:1fr;padding:8px}.cctv-menu{grid-template-columns:1fr 1fr;gap:8px;padding:16px 8px}.cctv-menu-col li a{padding:0 8px}.cctv-menu-mark{display:none}}