/* Spatial navigation and layer controls. */
:root{--ov-map-left:calc(var(--ov-left) + var(--ov-gap));--ov-map-right:calc(var(--ov-right) + var(--ov-gap))}
.directory-panel.panel{left:0;border-left:0;padding-left:14px}
.monitor-panel{right:0;border-right:0;padding-right:14px}
.directory-key{display:flex;justify-content:space-between;font-size:9px;color:#648ba4;padding:10px 2px 8px;flex-shrink:0}
.directory-panel .heading small{display:none}
.tree-row.area{gap:4px;padding:4px 0;min-height:35px}
.tree-name{gap:6px;padding:4px 0;font-size:clamp(11px,.85vw,15px)}
.tree-name>.ui-icon{width:13px;height:13px}
.online-ratio{display:inline-flex;align-items:baseline;gap:3px;flex-shrink:0;font:11px Arial;color:#749bb1;font-variant-numeric:tabular-nums;white-space:nowrap}
.online-ratio b{font-weight:600;color:#95dbe6}
.online-ratio i{font-style:normal;color:#4d748e}
.tree-home .online-ratio{margin-left:5px;font-size:10px}
.tree-home small{font-size:8px}
.tree-row.room>.online-ratio{margin-left:auto;font-size:10px}
.tree-enter{display:block;margin:0 0 6px 37px;border:0;border-bottom:1px solid #43b8d83d;background:transparent;padding:2px 0;color:#66d5e7;font-size:9px;letter-spacing:.5px}
.tree-enter:hover{background:none;color:#c9faff;border-bottom-color:#66d5e7}
.health-stat{justify-content:flex-start;gap:10px}
.health-label{width:clamp(55px,4.2vw,78px);flex-shrink:0}
.health-numbers{flex:0 1 auto}
#metrics .health-metric .health-numbers{gap:6px}
#metrics .health-metric .health-stat strong{font-size:clamp(22px,1.65vw,31px);line-height:1.1;margin:0}
#metrics .health-metric .orb-copy strong{font-size:clamp(22px,1.65vw,30px);line-height:1.1;margin:0}
#metrics .people-metric .summary-total strong,#metrics .vehicle-metric .summary-total strong{font-size:clamp(27px,1.9vw,36px);line-height:1.05;margin:0}
#metrics .summary-split{padding-bottom:4px;box-sizing:border-box}
#metrics .summary-types{gap:5px;line-height:1.2}
#metrics .summary-types>div{line-height:1.2}
#metrics .summary-types small{position:static;line-height:1;display:inline}
#metrics .alarm-metric .metric-values{flex:1;min-height:0;margin:0;align-items:center;padding-bottom:3px}
#metrics .alarm-metric strong{font-size:clamp(27px,1.85vw,34px);line-height:1.05;margin:0}
#metrics .alarm-metric .metric-values>button>span{margin-top:4px;font-size:clamp(10px,.68vw,13px);line-height:1.2}
#metrics .alarm-metric .disposition-track{flex-shrink:0;margin-top:3px}
#metrics .alarm-metric #alarmProgressLabel{flex-shrink:0;line-height:10px;margin-top:2px;font-size:8px}
body>footer{display:none}
:root{--ov-bottom:8px}
.summary-split{grid-template-columns:1fr 1.05fr;gap:8px}
#metrics .summary-total{display:grid;grid-template-columns:clamp(29px,2.8vw,48px) max-content;align-content:center;justify-content:center;gap:2px 4px}
.summary-art{display:block;width:clamp(29px,2.8vw,48px);height:clamp(35px,3.1vw,52px);object-fit:contain;filter:drop-shadow(0 2px 4px #23dddb22)}
#metrics .summary-total strong{align-self:center;font-size:clamp(28px,2.2vw,40px)}
.summary-total>span{grid-column:1 / -1;margin-top:2px;font-size:9px}
.summary-total>span .total-symbol{display:none}
.summary-types{padding-left:8px;gap:8px}
.summary-types>div{justify-content:flex-start;gap:8px}
.summary-types>div>span{width:clamp(56px,4.6vw,88px);flex-shrink:0;font-size:clamp(9px,.73vw,13px)}
.summary-types b{font-size:clamp(13px,.95vw,18px)}
.header-time{right:calc(100px + var(--ov-margin));top:3px;font-size:8px;line-height:18px}
.header-tools{position:absolute;right:10px;top:1px;display:flex;align-items:center;gap:10px;z-index:12;height:22px}
.header-tool{display:flex;align-items:center;justify-content:center;background:none;border:0;width:23px;height:22px;padding:3px;color:#b8dfed}
.header-tool .ui-icon{width:14px;height:14px;filter:invert(82%) sepia(22%) saturate(520%) hue-rotate(153deg)}
.header-tool:hover{background:#18445c66}
.user-button{display:flex;align-items:center;gap:5px;border:0;background:none;padding:0;color:#b8d3e5;white-space:nowrap;font-size:9px}
.user-avatar{display:flex;align-items:center;justify-content:center;width:21px;height:21px;border:1px solid #57a2c668;border-radius:50%;background:linear-gradient(145deg,#18577c,#09283f)}
.user-avatar img{width:12px;height:12px;filter:invert(87%) sepia(10%) saturate(1200%) hue-rotate(147deg)}
.user-menu{position:absolute;right:0;top:28px;width:150px;display:flex;flex-direction:column;gap:8px;border:1px solid #36769788;background:#062238f5;padding:14px;border-radius:4px;box-shadow:0 8px 24px #0005;text-align:left}
.user-menu strong{font-size:12px;color:#d5eefb}.user-menu span{font-size:10px;color:#8cbbd0}.user-menu small{font-size:9px;color:#5a8ba5;border-top:1px solid #49839d33;padding-top:8px}
.map-legend{width:clamp(255px,18.5vw,330px);padding:11px 12px;left:calc(var(--ov-map-left) + 10px);bottom:calc(var(--ov-bottom) + 12px)}
.legend-heading strong{font-size:12px}
.legend-heading>span{font-size:9px}
.legend-content{padding-top:9px}
.scene-layer-switches{display:flex;flex-direction:column;gap:9px;padding-bottom:11px;border-bottom:1px solid #4b8caa35}
.scene-layer-switches>label,.point-control-heading>label{display:flex;align-items:center;width:100%;gap:8px;cursor:pointer;font-size:11px;color:#b7d8e8}
.scene-layer-switches>label>input,.point-control-heading>label>input{margin-left:auto}
.map-legend input[role="switch"]{appearance:none;position:relative;width:25px;height:13px;border-radius:8px;border:0;background:#2b4a5f;padding:0;cursor:pointer;flex-shrink:0}
.map-legend input[role="switch"]:before{content:"";position:absolute;left:2px;top:2px;width:9px;height:9px;border-radius:50%;background:#a3bdcc;transition:left .15s}
.map-legend input[role="switch"]:checked{background:#148fab}
.map-legend input[role="switch"]:checked:before{left:14px;background:#ccfbff}
.scene-layer-switches .heat-key{margin-left:4px;gap:3px;font-size:8px;opacity:.8}
.scene-layer-switches .heat-key i{width:35px}
.point-control-heading{display:flex;align-items:center;gap:12px;margin:12px 0 0}
.point-control-heading>label{font-weight:600}
#legendAll{background:none;border:0;padding:0;color:#70b9ce;font-size:9px;white-space:nowrap}
#legendAll:disabled{opacity:.4;cursor:default}
.map-legend #layers{display:grid;grid-template-columns:repeat(2,1fr);gap:10px 16px;margin:12px 0}
.legend-choice{font-size:11px;gap:7px;color:#9ebfd2}
.legend-choice input{margin-left:auto;appearance:none;width:11px;height:11px;border:1px solid #367791;border-radius:2px;background:transparent;position:relative;flex-shrink:0}
.legend-choice input:checked{border-color:#47bbd3;background:#1985a64d}
.legend-choice input:checked:after{content:"";position:absolute;width:5px;height:3px;border-left:1px solid #a9e8f2;border-bottom:1px solid #a9e8f2;transform:rotate(-45deg);left:2px;top:2px}
.legend-choice .category-icon{width:16px;height:16px;opacity:.85}
#pointControls.disabled{opacity:.3}
#pointControls.disabled label{cursor:default}
.point-state-heading{font-size:9px;color:#6e9bb2;border-top:1px solid #4b8caa35;padding-top:9px;margin-top:3px}
.point-state-options{display:flex;justify-content:space-between;gap:8px;margin-top:9px}
.point-state-options label{display:flex;align-items:center;gap:5px;font-size:10px;color:#a9c5d6;cursor:pointer}
.point-state-options input{width:11px;height:11px;appearance:auto;padding:0;margin:0;accent-color:#249bb7}
.point-state-options i{width:5px;height:5px;border-radius:50%;display:block}
.point-state-options i.normal{background:#38cef2}.point-state-options i.alarm{background:#fa7b87}.point-state-options i.offline{background:#748797}
.map-legend.collapsed{min-width:185px;width:auto}.map-legend.collapsed .legend-content{display:none}
.toolbar{bottom:calc(var(--ov-bottom) + 12px);right:calc(var(--ov-map-right) + 10px)}
.toolbar #clean{display:flex}
.toolbar #clean[aria-pressed="true"]{color:#d5faff;background:#1756757a}
#hint{bottom:calc(var(--ov-bottom) + 64px);right:calc(var(--ov-map-right) + 10px)}
.map-only #metrics,.map-only .directory-panel,.map-only .monitor-panel,.map-only #right,.map-only footer{display:none!important}
.map-only #scene,.map-only #labels,.map-only #mapPins{inset:var(--ov-header) 0 0}
.map-only .map-topbar{top:var(--ov-header);left:14px;right:14px}
.map-only .breadcrumb{top:calc(var(--ov-header) + 43px);left:14px;max-width:85%}
.map-only .map-legend{left:14px;bottom:14px}
.map-only .toolbar{right:14px;bottom:14px;max-width:none}
.map-only #hint{right:14px;bottom:66px}
.map-only #toast{top:calc(var(--ov-header) + 45px)}
@media(max-width:1500px){.summary-split{gap:7px;grid-template-columns:1fr 1.05fr}.summary-types{padding-left:7px}.summary-types>div{gap:5px}.summary-types>div>span{width:53px;font-size:9px}#metrics .summary-total strong{font-size:27px}#metrics .summary-total{grid-template-columns:29px max-content;gap:2px}.summary-art{width:29px;height:38px}.health-label{width:55px}.health-stat{gap:7px}.header-tools{right:8px;gap:9px}.user-name{display:none}.header-time{right:76px}.map-legend{width:255px;padding:10px}.toolbar button{font-size:10px;padding:7px}.directory-panel.panel{padding-left:12px}.online-ratio{font-size:10px}.tree-name{font-size:11px}}
.compact-preview #metrics .summary-total strong{font-size:27px}.compact-preview .summary-art{width:29px;height:38px}.compact-preview .toolbar{bottom:42px}.compact-preview #hint{bottom:94px}.compact-preview .map-only .toolbar{bottom:14px}.compact-preview .map-only #hint{bottom:66px}
#metrics .summary-types small{position:static;display:inline;bottom:auto;font-size:8px;color:#7096ab}#metrics h2 small{position:static;bottom:auto}