: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,.cctv-tabs span{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,.cctv-tabs span.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-frame{position:relative}.cctv-tile-favorite{z-index:1;color:var(--cctv-muted);cursor:pointer;background:0 0;border:0;border-radius:50%;padding:4px;display:inline-flex;position:absolute;top:4px;right:4px}.cctv-tile-favorite:hover{color:var(--cctv-accent);background:#fff9}.cctv-tile-favorite.is-on{color:var(--cctv-accent)}.cctv-tile-favorite:focus-visible{outline:2px solid var(--cctv-accent)}.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-place-tools{z-index:2;flex-direction:column;gap:4px;width:max-content;height:0;margin-left:8px;display:flex;position:sticky;top:6px}.cctv-place-tools>*{flex:none}.cctv-place-tools:empty{display:none}.cctv-place-tools .cctv-icon-button{color:var(--cctv-text)}.cctv-place-tools .cctv-favorites-link,.cctv-place-tools .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-player{aspect-ratio:auto;color:#eee;display:block;position:relative}.cctv-player video{aspect-ratio:16/9;cursor:pointer;background:#000;width:100%;height:auto;max-height:calc(100vh - 150px);display:block}.cctv-player.is-full{flex-direction:column;height:100%;display:flex}.cctv-player.is-full video{aspect-ratio:auto;flex:1;min-height:0;max-height:none}.cctv-player .cctv-video-error{aspect-ratio:16/9;justify-content:center;align-items:center;margin:0;display:flex}.cctv-player-status,.cctv-player-notice{pointer-events:none;white-space:nowrap;background:#000000a6;border-radius:4px;align-items:center;gap:8px;padding:6px 12px;font-size:13px;display:flex;position:absolute;left:50%;transform:translate(-50%)}.cctv-player-status{top:40%}.cctv-player-notice{top:12px}.cctv-player-spinner{border:2px solid #ffffff59;border-top-color:#fff;border-radius:50%;width:14px;height:14px;animation:.9s linear infinite cctv-spin}.cctv-player-bar{background:#161616;padding:4px 8px 6px}.cctv-player-timeline{font-variant-numeric:tabular-nums;align-items:center;gap:8px;font-size:12px;display:flex}.cctv-player-time{color:#bbb;flex:none;min-width:56px}.cctv-player-time:last-child{text-align:right}.cctv-player-range{appearance:none;cursor:pointer;background:0 0;flex:1;min-width:0;height:20px;margin:0}.cctv-player-range::-webkit-slider-runnable-track{background:linear-gradient(to right, var(--cctv-teal) var(--pos,0%), #555 var(--pos,0%));border-radius:2px;height:4px}.cctv-player-range::-moz-range-track{background:#555;border-radius:2px;height:4px}.cctv-player-range::-moz-range-progress{background:var(--cctv-teal);border-radius:2px;height:4px}.cctv-player-range::-webkit-slider-thumb{-webkit-appearance:none;background:#fff;border:0;border-radius:50%;width:14px;height:14px;margin-top:-5px}.cctv-player-range::-moz-range-thumb{background:#fff;border:0;border-radius:50%;width:14px;height:14px}.cctv-player-buttons{flex-wrap:wrap;align-items:center;gap:2px;display:flex}.cctv-player-buttons button{color:#eee;min-width:36px;height:34px;font:inherit;font-variant-numeric:tabular-nums;cursor:pointer;background:0 0;border:0;border-radius:4px;align-items:center;gap:6px;padding:0 8px;font-size:13px;display:inline-flex}.cctv-player-buttons button:hover:not(:disabled){background:#ffffff1f}.cctv-player-buttons button:disabled{opacity:.35;cursor:default}.cctv-player-buttons button:focus-visible,.cctv-player-range:focus-visible{outline:2px solid var(--cctv-teal);outline-offset:1px}.cctv-player-buttons .cctv-player-quality{letter-spacing:.04em;border:1px solid #555;justify-content:center;min-width:48px;font-weight:600}.cctv-player-buttons .cctv-player-quality.is-hd:not(:disabled){border-color:var(--cctv-teal)}.cctv-player-auto{letter-spacing:0;color:#aaa;font-size:10px;font-weight:400}.cctv-player-buttons .cctv-player-auto-reset{color:#bbb;font-size:12px}.cctv-player-spacer{flex:1}.cctv-player-behind{color:#ffb74d;font-variant-numeric:tabular-nums;padding:0 6px;font-size:13px}.cctv-player-dot{background:#777;border-radius:50%;width:8px;height:8px}.cctv-player-live.is-live .cctv-player-dot{background:#e53935}@media (width<=640px){.cctv-player-buttons button{min-width:32px;padding:0 6px}.cctv-player-time{min-width:0}.cctv-player video{max-height:calc(100vh - 170px)}}.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}}