/* 17 Oct build (weba): the prototype's CSS from v185 to v326 (source/proto_s41.css lines 15-74, proto_s42.css, proto_s43.css,
   proto_s44.css, proto_s45.css), as they are: the screens use the prototype's class names, and html carries data-mode (light / dark)
   and data-r42 (the page) like the prototype. The shell's own additions for the real app are at the end. */

/* ===== proto_s41.css (Sam 15 Oct 06:18-07:38) ===== */
/* Sam 19:36: Building, Run time and Heat plant stacked in the first column */
.lv41-c1{display:flex;flex-direction:column;gap:16px;min-width:0}
.lv41-c1 > .card,.lv41-c1 > section{margin:0!important;min-width:0}
.lv41-c1 .lvt26-in{grid-template-columns:1fr!important;display:grid;gap:8px}
.lv41-c1 .scroll{overflow-x:auto}
.lv41-c1 .lvt26-run th{white-space:normal!important;overflow:visible!important;text-overflow:clip!important;letter-spacing:.04em}
/* Sam 15 Oct 06:18: alert names on Open alerts and All alerts in navy blue */
:root{--an33:#0b1d42}
html:root[data-mode="dark"]{--an33:#9db8f0}
/* Sam 06:19: the same on the pop-up's All alerts tab: box alarm and alert names, and the 15-day chart's alert names, in navy */
table.bxa td:nth-child(3),table.bxa td:nth-child(5){color:var(--an33);font-weight:600}
svg.tl text.ch-t{fill:var(--an33)}
.pkh97{flex-wrap:wrap}
/* TIME-LINE: Status changes switch hidden for now (Sam 15 Oct 06:24) */
.dyc97[data-dyg="s"]{display:none!important}
/* TIME-LINE markers on the bar (Sam 06:36) */
.dt97.v41{width:14px;height:14px;border-radius:2px;background:var(--c);border:2px solid #fff;box-shadow:0 0 0 1px rgba(0,0,0,.35);transform:translate(-50%,-50%) rotate(45deg);z-index:4}
.dt97.f41{width:8px;height:8px;background:#fff;border:2px solid #1f2933;z-index:3}
.dt97.f41.on41{background:#1f2933;border-color:#fff;box-shadow:0 0 0 1px #1f2933}
html[data-mode="dark"] .dt97.f41{background:#0f1419;border-color:#e6edf3} html[data-mode="dark"] .dt97.f41.on41{background:#e6edf3;border-color:#0f1419}
.lg97 i.lg41d{display:inline-block;width:9px;height:9px;background:#5b6b7a;border:1.5px solid #fff;box-shadow:0 0 0 1px rgba(0,0,0,.35);transform:rotate(45deg);border-radius:1px;margin-right:6px}
.lg97 i.lg41f{display:inline-block;width:8px;height:8px;border-radius:50%;background:#fff;border:2px solid #1f2933;margin-right:6px} .lg97 i.lg41f.on41{background:#1f2933}
/* TIME-LINE building name bar (Sam 15 Oct 06:39): the same colour as the Live screen's Boiler mode box (was light blue) */
.rw97>.nm97{background:color-mix(in srgb,var(--acc) 9%,var(--surface))!important;border-bottom:1px solid color-mix(in srgb,var(--acc) 45%,var(--line))!important}
html:root[data-mode="dark"] .rw97>.nm97{background:color-mix(in srgb,var(--acc) 9%,var(--surface))!important}
.rw97.sel97>.nm97{background:color-mix(in srgb,var(--acc) 18%,var(--surface))!important}
/* boiler firing strip under the bar (Sam 06:39: no marks on the bar) */
.fr41{position:absolute;height:4px;border-radius:2px;background:#1f2933;opacity:.75;cursor:pointer;z-index:2}
html[data-mode="dark"] .fr41{background:#e6edf3;opacity:.6}
.lg97 i.lg41s{display:inline-block;width:18px;height:4px;border-radius:2px;background:#1f2933;opacity:.75;margin-right:6px;vertical-align:middle}
/* TIME-LINE (Sam 15 Oct 06:43): the boxes stay white; the circle (event) or diamond (alert) that was on the bar sits at the top
   right inside each box, in the event's colour */
.bx97 .mk41{position:absolute;top:6px;right:7px;width:9px;height:9px;background:var(--c);border-radius:50%}
.bx97 .mk41.a{border-radius:1px;transform:rotate(45deg);width:8px;height:8px;top:7px}
.bx97:has(.mo97) .mk41{right:38px}
.bx97 .l1{padding-right:14px}
/* Boiler firing strip red and thicker (Sam 15 Oct 06:46) */
.fr41{height:3px!important;border-radius:2px;background:#d0312d!important;opacity:1!important}
html[data-mode="dark"] .fr41{background:#ff6b63!important}
.lg97 i.lg41s{height:3px!important;border-radius:2px;background:#d0312d!important;opacity:1!important}
/* TIME-LINE uses the full window width (Sam 06:47) */
main.page.dy97{max-width:none!important;padding-left:12px!important;padding-right:12px!important}
.rw97{overflow:clip!important}
.rw97>.nm97{position:sticky!important;left:0;width:max-content!important;min-width:var(--vw41,100%);box-sizing:border-box;z-index:7}
.ls41{font:inherit;font-size:12px;font-weight:600;letter-spacing:.02em;padding:3px 10px;border-radius:999px;border:1px solid var(--acc);background:var(--surface);color:var(--acc);cursor:pointer;align-self:center}
.ls41:hover,.ls41.on{background:var(--acc);color:#fff}
.ls41p{margin:0 14px 6px;padding:8px 12px;border:1px solid var(--line);border-radius:8px;background:var(--surface);font-size:13px;line-height:1.5;display:flex;flex-direction:column;gap:2px;position:sticky;left:14px;max-width:min(900px,calc(var(--vw41,100%) - 28px))}
.ls41p small{color:var(--muted)}
/* Sam 15 Oct 07:01: thinner building name bar, thicker time-line bar, white day area */
.rw97>.nm97{padding:3px 14px!important;gap:2px 10px}
.rw97>.nm97 b{font-size:14px}
.rw97>.nm97 small{font-size:12px}
.rw97>.nm97 .now97,.rw97>.nm97 .ls41{padding-top:1px;padding-bottom:1px}
.sh97.dy{background:#fffff4!important}
html:root[data-mode="dark"] .sh97.dy{background:rgba(238,255,65,.07)!important}
/* Sam 15 Oct 07:16: Metrics tab buttons bigger */
main.page.mt .mt-tabs button{font-size:15px!important;padding-top:9px;padding-bottom:9px}
/* Sam 15 Oct 07:38: day heading on the alert lists in bold */
section.aday>header h4{font-weight:800!important;font-size:13.5px!important;color:#000!important}
html:root[data-mode="dark"] section.aday>header h4{color:#fff!important}

/* ===== proto_s42.css ===== */
/* Q162 (Sam 15 Oct 09:29): vertical Set DITs / Set DTs like the old app */
.swal2-popup.pop42{width:min(1000px,96vw)!important}
.v42{display:flex;gap:12px;align-items:flex-start;flex-wrap:nowrap}
.t42{border-collapse:collapse;background:var(--surface);font-size:13.5px}
.t42 caption{text-align:left;font-weight:600;color:#1D4ED8;padding:6px 8px;font-size:13px;letter-spacing:.02em;text-transform:uppercase}
.t42 .i42{margin-right:6px;color:#d99a00}
.t42 th{font-size:11px;font-weight:500;color:var(--muted);text-align:left;padding:4px 8px}
.t42 td{padding:2px 8px;border-top:1px solid var(--line);line-height:1.2}
.t42 tbody tr:nth-child(odd) td{background:color-mix(in srgb,var(--line) 35%,transparent)}
.t42 td.l42{white-space:nowrap;min-width:70px}.t42 td.c42{font-weight:600;min-width:34px}
html body .t42 input.in{width:56px!important;min-width:0!important;padding:2px 6px!important;height:26px!important;font-size:13.5px!important}
.dits42{display:flex;gap:14px;align-items:flex-start}
.nav42{display:flex;flex-direction:column;gap:14px;min-width:120px;position:sticky;top:0}
.grp42{display:flex;flex-direction:column;gap:2px;padding-bottom:12px;border-bottom:1px solid var(--line)}
.grp42 button{border:0;background:none;padding:8px 10px;border-radius:6px;color:var(--muted);cursor:pointer;font:inherit;text-transform:uppercase;letter-spacing:.03em;font-size:12.5px}
.grp42 button:hover{background:color-mix(in srgb,#1D4ED8 8%,transparent);color:var(--text)}
.grp42 button.on{background:#7FAEEA;color:#0b1d42;font-weight:600}
.pane42{flex:1;min-width:0}.pane42 .s32g .scroll,.dts42 .s32g .scroll{overflow:visible}
.dts42{display:flex;gap:12px;flex-wrap:nowrap;align-items:flex-start}.dts42 .s32g{flex:1 1 0;min-width:0;margin-bottom:0!important}.dts42 .s32g header{flex-wrap:wrap}
/* Q163 fuel valve on / off picture (Sam 09:29) */
svg.fv42{display:inline-block;vertical-align:-3px;margin-right:5px;flex:none}
.blr23 .lt.fvlt42 > i{display:none}
.blr23 .lt.fvlt42{display:inline-flex;align-items:center}
/* Q165 top bar (Sam 09:49: option 3 royal blue #1E40AF; the white option K was dropped): whole bar royal blue, white words,
   open page white with blue words, clear hover (lighter fill, solid white border, small lift). */
:root{--top1:#1E40AF!important;--bar37:#1E40AF}
header.top{background:#1E40AF!important}
.top-in .nb-day34.on,.top1 .nb-ai.on,header.top .navr .nb.on,header.top .navr .nb[aria-current],html body header.top .top-in a.nb.on[aria-current]{color:#1E40AF!important}
html body header.top .top-in a.nb:not(.on):not([aria-current]):not(.nb-live33):hover,html body header.top .nb:not(.on):not([aria-current]):not(.nb-live33):hover{background:rgba(255,255,255,.22)!important;border-color:#fff!important;transform:translateY(-1px);box-shadow:0 2px 6px rgba(0,0,0,.25)}
/* top bar buttons on the dark top bar (dark mode) keep a clear hover too */
html body header.top .nb:not(.on):not([aria-current]):not(.nb-live33):hover{border-color:currentColor}
/* Q165 TRIAL (Sam 09:33, colour follows the bar 09:49): buttons in #1E40AF on Real-Time and Anagha AI only, then Sam decides */
html[data-r42="realtime"] main .btn.pri,html[data-r42="home"] main .btn.pri,html[data-r42="home"] .aibar .btn.pri{background:#1E40AF!important;border-color:#1E40AF!important;color:#fff!important}
html[data-r42="realtime"] main .btn:not(.pri),html[data-r42="home"] main .btn:not(.pri),html[data-r42="home"] .aia-sug button{border-color:#1E40AF!important;color:#1E40AF!important}
html[data-r42="realtime"] main .btn:not(.pri):hover,html[data-r42="home"] main .btn:not(.pri):hover,html[data-r42="home"] .aia-sug button:hover{background:#E8EEFB!important}
html[data-r42="home"] .aic-f,html[data-r42="home"] .aic-f *,html[data-r42="home"] .linkbtn{color:#1E40AF!important}
html[data-r42="home"] .aic-f:hover{background:#E8EEFB!important}
/* Q170 (Sam 15 Oct 10:06): the whole app follows the royal blue top bar (#1E40AF). Buttons are either solid blue (main action,
   chosen tab or switch) or white with a blue border and blue words. Modals, the live pop-up header and the login page are blue too.
   Status colours (green satisfied, red/amber alerts) and the coloured building action buttons (ac33) are unchanged. */
:root{--blue42:#1E40AF;--blue42h:#1A3690;--blue42s:#E8EEFB}
html:root[data-mode="dark"]{--blue42:#3B63D9;--blue42h:#3358C8;--blue42s:rgba(59,99,217,.18)}
/* solid blue */
html body .btn.pri:not(#z42),html body .swal2-confirm:not(#z42),html body .seg button.on:not(#z42),html body .seg > .on:not(#z42),html body .tabs button.on:not(#z42),html body .tabs > .on:not(#z42),
html body .login #go:not(#z42),html body .login .btn.pri:not(#z42),html body .lg37-btn:not(#z42),html body .aifab:not(#z42){background:var(--blue42)!important;border-color:var(--blue42)!important;color:#fff!important}
html body .btn.pri:not(#z42):hover,html body .swal2-confirm:not(#z42):hover,html body .aifab:not(#z42):hover,html body .login #go:not(#z42):hover,html body .lg37-btn:not(#z42):hover{background:var(--blue42h)!important;border-color:var(--blue42h)!important}
/* white with a blue border */
html:not([data-mode="dark"]) body .btn:not(.pri):not(.ac33):not(.on):not(#z42),html:not([data-mode="dark"]) body .swal2-cancel:not(#z42),html:not([data-mode="dark"]) body .swal2-deny:not(#z42){background:#fff!important;border:1px solid var(--blue42)!important;color:var(--blue42)!important}
html[data-mode="dark"] body .btn:not(.pri):not(.ac33):not(.on):not(#z42),html[data-mode="dark"] body .swal2-cancel:not(#z42){background:transparent!important;border:1px solid var(--blue42)!important;color:#C7D4FA!important}
html body .btn:not(.pri):not(.ac33):not(.on):not(#z42):hover,html body .swal2-cancel:not(#z42):hover{background:var(--blue42s)!important}
/* segmented choices and tabs: blue outline, blue words, the chosen one solid blue */
html body .seg:not(#z42),html body .tabs:not(#z42){border-color:var(--blue42)!important}
html:not([data-mode="dark"]) body .seg button:not(.on):not(#z42),html:not([data-mode="dark"]) body .tabs button:not(.on):not(#z42){color:var(--blue42)!important}
html body .seg button:not(.on):not(#z42):hover,html body .tabs button:not(.on):not(#z42):hover{background:var(--blue42s)!important}
html body .linkbtn:not(#z42),html body .aic-f:not(#z42),html body .aic-f *{color:var(--blue42)!important}
/* modals */
html body .swal2-popup:not(#z42){border-top:4px solid var(--blue42)!important}
html body .swal2-title{color:var(--blue42)}
html body .lvp-h:not(#z42){background:var(--blue42)!important}
html body input[type=checkbox],html body input[type=radio]{accent-color:var(--blue42)}
/* login page (was green #2A5F57) */
html body .login h1:not(#z42),html body .login .brand:not(#z42),html body .login a:not(#z42),html body .lg37-fg a,html body .lg37-reg a,html body .lg37-lk a{color:var(--blue42)!important}
html body .login .who label:has(input:checked),html body .login .who .on{background:var(--blue42s)!important;border-color:var(--blue42)!important}
html body .lvt26 h3:not(#z42){color:var(--blue42)!important}
html body .ab31.ab38.ab38-on:not(#z42){border-top-color:var(--blue42)!important}
html body .lvt26 table.t tbody tr:nth-child(odd) td{background:color-mix(in srgb,var(--blue42) 4%,var(--surface))}
html:not([data-mode="dark"]) body:has(.login):not(#z42){background:linear-gradient(160deg,#eef2fd 0%,#dbe4fa 100%)!important}
html body .login .card:not(#z42),html body .login > div:not(#z42),html body .login form:not(#z42){border-color:#9db2ea!important}
html body .login37:not(#z42){background:#0b1a4a!important}
/* Q162 (Sam 10:14): Set DITs shows all six blocks at once, three per row */
.swal2-popup.pop42 .swb.col37{columns:auto!important;column-count:1!important}
.swal2-popup.pop42:has(.dits42g){width:min(1480px,98vw)!important}
.dits42g{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px 10px}
@media (max-width:1100px){.dits42g{grid-template-columns:1fr}}
.dits42g .s32g{margin:0!important;min-width:0}.dits42g .s32g .scroll{overflow:visible}
.dits42g .t42 td{padding:1px 6px}.dits42g .t42 input.in:not(#z42){height:22px!important}
.dits42g .s32g header{flex-wrap:wrap;gap:6px}
/* Q174 (Sam 10:14): no row click to the live screen */
tr.click[data-go*="-live"]{cursor:default!important}
/* Q170 (Sam 10:14): boiler mode box very light blue, Auto in royal blue (Bypass On / Off keep amber / red) */
.bm33:not(.m-bypassOn):not(.m-bypassOff){--m:var(--blue42)!important}
/* Q177 (Sam 15 Oct 10:17): logo / favicon in a royal blue gradient (light blue to deep blue); flame and white A kept, dot light blue */
html body .top1 .brand i:not(#z42),html body header.top .brand i:not(#z42),html body .lg37-mark:not(#z42){background-image:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA2NCA2NCIgeG1sbnM6YzJwYT0iaHR0cDovL2MycGEub3JnL21hbmlmZXN0Ij48bWV0YWRhdGE+PGMycGE6bWFuaWZlc3Q+QUFBV2dtcDFiV0lBQUFBZWFuVnRaR015Y0dFQUVRQVFnQUFBcWdBNG0zRURZekp3WVFBQUFCWmNhblZ0WWdBQUFFZHFkVzFrWXpKdFlRQVJBQkNBQUFDcUFEaWJjUU4xY200Nll6SndZVHBoTkRobVpHVXpNeTB5TldWbExUUTRaVE10WW1VMU5DMHlaV1kwTkRoaE1XUmtNRFFBQUFBRGwycDFiV0lBQUFBcGFuVnRaR015WVhNQUVRQVFnQUFBcWdBNG0zRURZekp3WVM1aGMzTmxjblJwYjI1ekFBQUFBTHhxZFcxaUFBQUFSR3AxYldSalltOXlBQkVBRUlBQUFLb0FPSnR4RTJNeWNHRXVhVzVuY21Wa2FXVnVkQzUyTXdBQUFBQVlZekp6YURVQTlkb3o2ZnNxRTZtY3J2OEJrODhBQUFCd1kySnZjcU5wWkdNNlptOXliV0YwYldsdFlXZGxMM04yWnl0NGJXeHFhVzV6ZEdGdVkyVkpSSGdzZUcxd09tbHBaRG8xTldNME5URmtNaTFpWmpCbUxUUTBaV1F0WWpNMU5pMHhPRGxrTWprd05USmhZbUpzY21Wc1lYUnBiMjV6YUdsd2FIQmhjbVZ1ZEU5bUFBQUI0bXAxYldJQUFBQkJhblZ0WkdOaWIzSUFFUUFRZ0FBQXFnQTRtM0VUWXpKd1lTNWhZM1JwYjI1ekxuWXlBQUFBQUJoak1uTm9pYy9KOThKbmtPZjlJeXgrbjBjeVJRQUFBWmxqWW05eW9tZGhZM1JwYjI1emdxSm1ZV04wYVc5dWEyTXljR0V1YjNCbGJtVmthbkJoY21GdFpYUmxjbk9oYTJsdVozSmxaR2xsYm5SemdhSmpkWEpzZUMxelpXeG1JMnAxYldKbVBXTXljR0V1WVhOelpYSjBhVzl1Y3k5ak1uQmhMbWx1WjNKbFpHbGxiblF1ZGpOa2FHRnphRmdnSlNXZE1jSDVBdU4wcnlkYjFDVVNlbUlCUy9XUDFmemNxQy9JR3lJcDROK2tabUZqZEdsdmJuZ2RZMjl0TG1GdWRHaHliM0JwWXk1amJHRjFaR1V1Y0hKdmRtbGtaV1JxY0dGeVlXMWxkR1Z5YzZGNEgyTnZiUzVoYm5Sb2NtOXdhV011YjNKcFoybHVMV052Ym1acFpHVnVZMlZuZFc1cmJtOTNibXRrWlhOamNtbHdkR2x2Ym5obVEyeGhkV1JsSUhCeWIzWnBaR1ZrSUhSb2FYTWdabWxzWlNCaGRDQjBhR1VnY21WeGRXVnpkQ0J2WmlCaElIVnpaWElnWVc1a0lHMWhlU0JvWVhabElHTnlaV0YwWldRZ2IzSWdiVzlrYVdacFpXUWdkR2hsSUdacGJHVWdZMjl1ZEdWdWRITXViWE52Wm5SM1lYSmxRV2RsYm5TaFpHNWhiV1ZtUTJ4aGRXUmxjbUZzYkVGamRHbHZibk5KYm1Oc2RXUmxaUFVBQUFESWFuVnRZZ0FBQUVCcWRXMWtZMkp2Y2dBUkFCQ0FBQUNxQURpYmNSTmpNbkJoTG1oaGMyZ3VaR0YwWVFBQUFBQVlZekp6YUw3MlBmSG4wM1RwU1dnWDNiL0prZWdBQUFDQVkySnZjcVZqWVd4blpuTm9ZVEkxTm1Od1lXUk5BQUFBQUFBQUFBQUFBQUFBQUdSb1lYTm9XQ0JaUHRWNCtYOWVBZFpLQmkwc1ZjOHc5TDdBTmhQMGFTbW8weWd0SUNiaWIyUnVZVzFsYm1wMWJXSm1JRzFoYm1sbVpYTjBhbVY0WTJ4MWMybHZibk9Cb21WemRHRnlkQmg3Wm14bGJtZDBhQmtlQkFBQUFqNXFkVzFpQUFBQUoycDFiV1JqTW1Oc0FCRUFFSUFBQUtvQU9KdHhBMk15Y0dFdVkyeGhhVzB1ZGpJQUFBQUNEMk5pYjNLbFkyRnNaMlp6YUdFeU5UWnBjMmxuYm1GMGRYSmxlRTF6Wld4bUkycDFiV0ptUFM5ak1uQmhMM1Z5Ympwak1uQmhPbUUwT0daa1pUTXpMVEkxWldVdE5EaGxNeTFpWlRVMExUSmxaalEwT0dFeFpHUXdOQzlqTW5CaExuTnBaMjVoZEhWeVpXcHBibk4wWVc1alpVbEVlQ3g0YlhBNmFXbGtPbUV3Tm1JNFpHSmpMV1F4T0RBdE5EVXlNaTA1WTJJMUxUUmlNRGt5TkRRME9XSTJaSEpqY21WaGRHVmtYMkZ6YzJWeWRHbHZibk9Eb21OMWNteDRMWE5sYkdZamFuVnRZbVk5WXpKd1lTNWhjM05sY25ScGIyNXpMMk15Y0dFdWFXNW5jbVZrYVdWdWRDNTJNMlJvWVhOb1dDQWxKWjB4d2ZrQzQzU3ZKMXZVSlJKNllnRkw5WS9WL055b0w4Z2JJaW5nMzZKamRYSnNlQ3B6Wld4bUkycDFiV0ptUFdNeWNHRXVZWE56WlhKMGFXOXVjeTlqTW5CaExtRmpkR2x2Ym5NdWRqSmthR0Z6YUZnZ01Zc2M5YzExRk5aL2N6dDE0RXpETmJ0M2l1dWgrQ1N5dnl4bFh5Q1lQa21pWTNWeWJIZ3BjMlZzWmlOcWRXMWlaajFqTW5CaExtRnpjMlZ5ZEdsdmJuTXZZekp3WVM1b1lYTm9MbVJoZEdGa2FHRnphRmdnZzRJc1FGK0UycFd5YWhUSlJZeXRYV2V1MkxtMk9XaXBLUk0yRDlzY01IVjBZMnhoYVcxZloyVnVaWEpoZEc5eVgybHVabStqWkc1aGJXVnZRVzUwYUhKdmNHbGpJRVpwYkdWelozWmxjbk5wYjI1bE1TNHdMakJyYzNCbFkxWmxjbk5wYjI1bE1pNDBMakFBQUJBNGFuVnRZZ0FBQUNocWRXMWtZekpqY3dBUkFCQ0FBQUNxQURpYmNRTmpNbkJoTG5OcFoyNWhkSFZ5WlFBQUFCQUlZMkp2Y3RLRVdRSVNvZ0VtR0NGWkFnb3dnZ0lHTUlJQmphQURBZ0VDQWhSQTVhQUs3c0k1MEw2NGcvb0dRZ1U5WjFVVEFEQUtCZ2dxaGtqT1BRUURBekJKTVJjd0ZRWURWUVFLRXc1QmJuUm9jbTl3YVdNc0lGQkNRekV1TUN3R0ExVUVBeE1sUVc1MGFISnZjR2xqSUVOdmJuUmxiblFnUTNKbFpHVnVkR2xoYkhNZ1VtOXZkQ0JEUVRBZUZ3MHlOakE0TURjeE9EUXpOVFphRncweU9EQTRNRFl4T1RRek5UWmFNRVF4RnpBVkJnTlZCQW9URGtGdWRHaHliM0JwWXl3Z1VFSkRNU2t3SndZRFZRUURFeUJCYm5Sb2NtOXdhV01nUTJ4aGRXUmxJRU52Ym5SbGJuUWdVMmxuYm1sdVp6QlpNQk1HQnlxR1NNNDlBZ0VHQ0NxR1NNNDlBd0VIQTBJQUJKaDZDbXZMVUJnRkZOVTB2VUtsT1Z0RTZkamQxN0w1U3V3WDBMZW1GaXNCTTNka2QvM2N5anhGQTNRbzVTNDZmWDAvaWhZMFZaN21mYjlLRjcwM3Q1T2pXREJXTUE0R0ExVWREd0VCL3dRRUF3SUhnREFWQmdOVkhTVUVEakFNQmdvckJnRUVBWVBvWGdJQk1Bd0dBMVVkRXdFQi93UUNNQUF3SHdZRFZSMGpCQmd3Rm9BVXpsSGlCSUZPWkZzaitPUEV6NW8rbk1IWFhNSXdDZ1lJS29aSXpqMEVBd01EWndBd1pBSXdNWE1kRko0QmV0TExWWTdPUnVFOW5vcWJiQVpPWm4vYUFyWHlUd0ZBWmZLclB6eEYydlBvSk5mMStVQ2RnMVhHQWpCd1gxemQ5V0dxWWtxbUw1U0ZxdzFReVNqcjF6SmZwSk05KzFyZER3U1BMTU9QT2pLdWlYam9VL3BVVWVHOVJ3bWhZM0JoWkZrTm5nQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBUFpZUUpuUkhWT2Y0RmFyNitkQytuUnNQVkNMTXNaOXN5Q08yMUlHb2VBaHBkOG5VOFZiMjhsd1AyZStMajFIWGpSSjBqejdXZktZdHdXVjZBWDlPVi9pZ1JvPTwvYzJwYTptYW5pZmVzdD48L21ldGFkYXRhPgogIDxkZWZzPgogICAgPGxpbmVhckdyYWRpZW50IGlkPSJiZyIgeDE9IjAiIHkxPSIwIiB4Mj0iMSIgeTI9IjEiPjxzdG9wIG9mZnNldD0iMCIgc3RvcC1jb2xvcj0iIzNCODJGNiIvPjxzdG9wIG9mZnNldD0iLjU1IiBzdG9wLWNvbG9yPSIjMUU0MEFGIi8+PHN0b3Agb2Zmc2V0PSIxIiBzdG9wLWNvbG9yPSIjMTcyRTdBIi8+PC9saW5lYXJHcmFkaWVudD4KICAgIDxsaW5lYXJHcmFkaWVudCBpZD0iZmwiIHgxPSIwIiB5MT0iMSIgeDI9IjAiIHkyPSIwIj48c3RvcCBvZmZzZXQ9IjAiIHN0b3AtY29sb3I9IiNmZjdhMWEiLz48c3RvcCBvZmZzZXQ9IjEiIHN0b3AtY29sb3I9IiNmZmM5NGEiLz48L2xpbmVhckdyYWRpZW50PgogIDwvZGVmcz4KICA8cmVjdCB3aWR0aD0iNjQiIGhlaWdodD0iNjQiIHJ4PSIxNCIgZmlsbD0idXJsKCNiZykiLz4KICA8cGF0aCBkPSJNMTIgNTEgTDMyIDEzIEw1MiA1MSIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjZmZmZmZmIiBzdHJva2Utd2lkdGg9IjciIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIvPgogIDxwYXRoIGQ9Ik0zMiAyOSBDMzYuNSAzNCAzOSAzOCAzOSA0Mi41IEMzOSA0NyAzNS45IDUwIDMyIDUwIEMyOC4xIDUwIDI1IDQ3IDI1IDQyLjUgQzI1IDM5LjYgMjYuNiAzNy4yIDI4LjQgMzUuNiBDMjguNiAzOCAyOS44IDM5LjQgMzEuMiAzOS44IEMzMC42IDM2IDMxIDMyLjQgMzIgMjkgWiIgZmlsbD0idXJsKCNmbCkiLz4KICA8Y2lyY2xlIGN4PSI1MSIgY3k9IjEzIiByPSI0LjIiIGZpbGw9IiNCRkRCRkUiLz4KPC9zdmc+Cg==")!important}
/* Q178 (Sam 10:17): Cycle rem value light and bright */
html body .lbl + .badge.warn:not(#z42){background:#FFD54A!important;color:#3a2600!important;border-color:#FFC21A!important}
html[data-mode="dark"] body .lbl + .badge.warn:not(#z42){background:#FFC93C!important;color:#2a1c00!important}

/* Q180 DITs: Heat / Cool row headings with the copy button; tighter blocks so three fit per row */
.row42{grid-column:1/-1;display:flex;align-items:center;gap:12px;padding:6px 2px 0;border-bottom:2px solid var(--blue42)}
.row42 b{color:var(--blue42);font-size:14px;letter-spacing:.02em;text-transform:uppercase}.row42 .btn{margin-left:auto}
.dits42g .s32g{padding:8px!important}.dits42g .s32g header{gap:4px 8px}
.dits42g .v42{gap:8px}.dits42g .t42 td{padding:1px 4px}.dits42g .t42 th{padding:3px 4px}.dits42g .t42 td.l42{min-width:58px}.dits42g .t42 td.c42{min-width:26px}
html body .dits42g .t42 input.in:not(#z42){width:46px!important;padding:1px 4px!important}
/* Q181 DTs: narrower pop-up, two blocks side by side */
.swal2-popup.pop42:has(.dts42){width:min(820px,96vw)!important}
.dts42 .t42{width:100%}.dts42 .t42 th:first-child{color:var(--muted)}
/* Q182 colour squares for gas / oil */
.sw42{display:inline-flex;align-items:center;gap:4px;margin-right:10px}.sw42 i{width:11px;height:11px;border-radius:2px;display:inline-block}
.sw42g{background:var(--acc)}.sw42o{background:var(--warn)}
.dits42g .t42 caption{white-space:nowrap;font-size:12px;padding:4px}
.lv-grid.lv3.noside42{grid-template-columns:minmax(0,1fr)!important}.lv-grid.noside42 > aside.side{display:none}
/* Q184 Real-Time / Watch pill: same words, case and colours as the Buildings status badge */
.rt-pill.st33:not(#z42){text-transform:none;letter-spacing:0}
/* Q188 Predictions button + pop-up */
html body .btn.pd42.pd42:not(.x1):not(.x2):not(.x3):not(#z42),html[data-mode] body .btn.pd42:not(#z42):not(#z43){background:#C62828!important;border-color:#C62828!important;color:#fff!important;margin-left:18px}
html body .btn.pd42.pd42:not(.x1):not(.x2):not(.x3):not(#z42):hover,html[data-mode] body .btn.pd42:not(#z42):not(#z43):hover{background:#A51F1F!important;border-color:#A51F1F!important}
.swal2-popup.pd42p:not(#z42){width:min(1100px,96vw)!important}
.pd42n{background:#FFF4E5;border:1px solid #F5C27A;border-left:4px solid #C62828;border-radius:6px;padding:10px 12px;font-size:13.5px;line-height:1.45;text-align:left}
html[data-mode="dark"] .pd42n{background:#3a2a12;border-color:#7a5520;color:#f3e3c8}
.pd42t td{vertical-align:top}
/* Q187 Admin > Predictions */
.pd42a td{vertical-align:middle}.pd42l{display:flex;flex-direction:column;gap:4px}
.pd42l label{display:flex;align-items:center;gap:6px;white-space:nowrap}.pd42l input.in{width:64px}
.pd42a td:nth-child(2){min-width:230px}.pd42a select.in{width:auto;min-width:0}.pd42a th{white-space:normal}
/* Q188 (Sam 11:02): small button right of the first hour label ("2 AM") on Open alerts, no new space */
main .hr28:has(.pd42){display:flex;align-items:center;gap:8px}
html body .btn.pd42.pd42:not(.x1):not(.x2):not(.x3):not(#z42),html[data-mode] body .btn.pd42:not(#z42):not(#z43){margin:0;padding:1px 8px!important;font-size:10.5px!important;line-height:1.5!important;min-height:0!important;height:auto!important;letter-spacing:.04em}
/* Q194 Alert history: per day a Critical, Warning and Info time line like Open alerts */
.story33 .ah42{display:flex;flex-direction:column;gap:8px;margin:4px 0 12px}
.story33 .ah42 .tg28{padding:4px 10px 2px}
/* Sam 11:51 (Q180 follow-up): DITs rows a little taller, values and labels larger; intro next to the title; one scrollbar only */
.swal2-popup.pop42 .swal2-title .ttl42{display:inline-block;margin-left:14px;font-size:12.5px;font-weight:400;color:var(--muted);letter-spacing:0;text-transform:none;vertical-align:middle}
.dits42g .t42{font-size:15.5px}.dits42g .t42 td{padding:4px 6px!important}.dits42g .t42 td.l42{min-width:72px}.dits42g .t42 td.c42{min-width:30px}
.dits42g .t42 th{font-size:12px;padding:4px 6px!important}
html body .dits42g .t42 input.in:not(#z42){width:52px!important;height:28px!important;font-size:15.5px!important}
.dts42 .t42{font-size:15px}.dts42 .t42 td{padding:4px 8px}
body.swal2-shown:has(.swal2-popup.pop42) .swal2-container{overflow:hidden!important}
.swal2-popup.swp.fit37.pop42 .swal2-html-container.swh{max-height:calc(100vh - 130px);overflow:auto}
@media (min-width:1900px){.swal2-popup.swp.fit37.pop42 .swal2-html-container.swh{max-height:calc(100vh/1.2 - 130px)}}
/* Sam 11:51: dark theme menu row was still the old green */
html:root[data-mode="dark"] header.top{background:#1E40AF!important}
.story33 .ah42 .sv42h{font-weight:800;font-size:13px;letter-spacing:.06em;text-transform:uppercase;color:var(--tone);margin:2px 0 2px}
/* Q197 full-screen pop-up for LIVE, Real-Time and TIME-LINE: no banner, Close × top right */
html.fs42 header.top{display:none!important}
html.fs42 body{padding-top:0!important}
#x42{position:fixed;top:8px;right:10px;z-index:2000;display:inline-flex;align-items:center;gap:6px;padding:4px 12px;border-radius:999px;border:1px solid var(--blue42);background:#fff;color:var(--blue42);font:600 13px/1.4 inherit;letter-spacing:.04em;text-transform:uppercase;cursor:pointer;box-shadow:0 2px 8px rgba(0,0,0,.18)}
#x42 span{font-size:20px;line-height:1;font-weight:400}
#x42:hover{background:var(--blue42);color:#fff}
html[data-mode="dark"] #x42{background:#0f1218;color:#BFD0FF;border-color:#3B63D9}
#x42[hidden]{display:none}
html.fs42 .rt-strip,html.fs42 main.page.la .la-h,html.fs42 main.page.dy97 .dyh97{padding-right:120px!important}
/* Q199 Table view rows in their card colours */
.lvt26 tr.r42 > td:first-child{box-shadow:inset 4px 0 0 var(--rcc)}
.lvt26 tr.r42-warn > td{background:color-mix(in srgb,#f59e0b 16%,transparent)!important}
.lvt26 tr.r42-crit > td{background:color-mix(in srgb,#dc2626 14%,transparent)!important}
.lvt26 tr.r42-off > td{color:var(--muted)}
/* Q200 Oil and gas time */
td.fu42o,th.fu42o{color:#b45309;background:color-mix(in srgb,#f59e0b 10%,transparent)}
td.fu42g,th.fu42g{color:#15803d;background:color-mix(in srgb,#22c55e 9%,transparent)}
th.fu42o,th.fu42g{font-weight:700;white-space:nowrap}
td.fu42o,td.fu42g{text-align:center}
table td.fu42d,table th.fu42d{border-left:2px solid #64748b!important}
html[data-mode="dark"] table td.fu42d,html[data-mode="dark"] table th.fu42d{border-left-color:#94a3b8!important}
/* Q201 Metrics graph */
.g42bar{display:flex;align-items:center;gap:8px;margin:0 0 8px}
.g42{border:1px solid var(--line);border-radius:10px;padding:10px 12px;background:var(--surface)}
.g42 svg{width:100%;height:auto;display:block}
.g42g{stroke:var(--line);stroke-width:1}.g42t{font-size:12px;fill:var(--muted)}
.g42k{display:flex;flex-wrap:wrap;gap:6px 16px;margin-top:6px;font-size:13px}.g42k i{display:inline-block;width:14px;height:3px;border-radius:2px;margin-right:6px;vertical-align:middle}
/* Q204 (Sam 15 Oct 12:20 "the date must come as strong bold black clear"): Alert history day headings */
html body .story33 .fdv33:not(#z42){color:#000!important;font-weight:800!important;font-size:16px!important;opacity:1!important;letter-spacing:.04em}
html:root[data-mode="dark"] body .story33 .fdv33:not(#z42){color:#fff!important}
/* Q205 (Sam 15 Oct 12:31 "the closed button in this case must be coloured by default and on mouse over it shows white"):
   full-screen Live / Real-Time / TIME-LINE Close × is blue by default, white on mouse-over */
html body #x42:not(#z42){background:var(--blue42);color:#fff;border-color:var(--blue42)}
html body #x42:not(#z42):hover{background:#fff;color:var(--blue42);border-color:var(--blue42)}
html[data-mode="dark"] body #x42:not(#z42){background:#3B63D9;color:#fff;border-color:#3B63D9}
html[data-mode="dark"] body #x42:not(#z42):hover{background:#fff;color:#1E40AF;border-color:#fff}
/* Q206 import utility */
.im42 thead tr:nth-child(2) th{font-weight:400;text-transform:none;letter-spacing:0;padding:4px} .im42 select.in{font-size:13px;padding:4px 6px;height:auto}
tr.im42e td{background:var(--crit-soft)}
/* Q208 darker, bolder field labels */
html body .fld > span:not(#z42){color:#1f2937!important;font-weight:600!important;font-size:14px}
html[data-mode="dark"] body .fld > span:not(#z42){color:#e5e7eb!important}
/* Q210 no "Nothing today" line */
.aiclear{display:none!important}
/* Q211 Real-Time cards: royal blue border on every card */
html body article.rt-tile:not(#z42),html body article.rt-tile[class*="q45-"]:not(#z42){border-color:var(--blue42)!important;border-left-color:var(--blue42)!important}
html[data-mode="dark"] body article.rt-tile:not(#z42){border-color:#3B63D9!important}
/* Q209 sign-in page: two parts, no picture */
.login37.lg42{background:#fff}
.login37.lg42 .sky37,.login37.lg42 .lg37-shade{display:none}
.login37.lg42 .lg37-wrap{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);align-items:stretch;justify-items:center;padding:0;min-height:100vh}
.lg42-side{align-self:stretch;width:100%;box-sizing:border-box;background:linear-gradient(150deg,#1E40AF 0%,#1e3a8a 60%,#172554 100%);color:#fff;padding:64px 56px;display:flex;flex-direction:column;justify-content:center;gap:22px}
.lg42-logo{display:flex;align-items:center;gap:12px;font:700 22px var(--sans);letter-spacing:.12em}
.lg42-logo .lg37-mark{margin:0;background:#fff;color:#1E40AF}
.lg42-side h2{font:700 38px/1.2 var(--sans);margin:0;max-width:520px;color:#fff;letter-spacing:0;text-transform:none}
.lg42-side ul{margin:0;padding:0;list-style:none;display:grid;gap:14px;font-size:19px;line-height:1.4;color:#dbe4ff}
.lg42-side li{padding-left:30px;position:relative}
.lg42-side li::before{content:"";position:absolute;left:0;top:.45em;width:14px;height:14px;border-radius:50%;background:#93c5fd}
.login37.lg42 .lg37{align-self:center;background:#fff;box-shadow:none;backdrop-filter:none;border:1px solid #dbe3f0;width:min(460px,calc(100% - 32px));margin:40px 16px 8px;font-size:17px}
.login37.lg42 .lg37-mark{background:#1E40AF}
.login37.lg42 .lg37-brand h1{color:#1E40AF;font-size:30px}
.login37.lg42 .lg37-f span{font-size:14px;color:#1f2937}
.login37.lg42 .lg37-f .in{font-size:18px;padding:14px 16px;background:#f5f8ff;border-color:#b9c7e4}
.login37.lg42 .lg37-f .in:focus{outline-color:#1E40AF}
.login37.lg42 .lg37 a{color:#1E40AF}
.login37.lg42 .lg37-btn{background:#1E40AF!important;border-color:#1E40AF!important;font-size:18px!important;padding:15px!important}
.login37.lg42 .lg37-btn:hover{background:#1e3a8a!important}
.login37.lg42 .lg37-fg{display:flex;justify-content:space-between;align-items:center;text-align:left}
.lg42-rm{display:inline-flex;align-items:center;gap:8px;font-size:16px;color:#1f2937;cursor:pointer}
.lg42-rm input{width:20px;height:20px;accent-color:#1E40AF;margin:0}
.login37.lg42 .lg37-copy{grid-column:2;color:#64748b;margin:0 0 24px}
@media (max-width:860px){.login37.lg42 .lg37-wrap{grid-template-columns:1fr}.lg42-side{padding:32px 24px}.lg42-side h2{font-size:28px}.lg42-side ul{font-size:17px}.login37.lg42 .lg37-copy{grid-column:1}}
html body .login37.lg42:not(#z42){background:#f3f6fc!important}
.login37.lg42 .lg37{box-shadow:0 10px 30px rgba(30,64,175,.10)!important}
.login37.lg42 .lg37-wrap{grid-template-rows:1fr auto;min-height:100%}
.lg42-side{grid-row:1 / span 2;grid-column:1}
.login37.lg42 .lg37{grid-column:2;grid-row:1}
.login37.lg42 .lg37-copy{grid-row:2}
@media (max-width:860px){.lg42-side{grid-row:auto}.login37.lg42 .lg37,.login37.lg42 .lg37-copy{grid-column:1;grid-row:auto}}
/* Q213 Real-Time top bar blue */
html body .rt-strip:not(#z42){background:#1E40AF!important;color:#fff!important;border-color:#1E40AF!important}
html[data-mode="dark"] body .rt-strip:not(#z42){background:#1E40AF!important}
/* Q214 Boiler mode = a heading in the card menu */
html body .rt-pop .rth33:not(#z42){background:#eef2f7;color:#334155;cursor:default;pointer-events:none;user-select:none;margin:6px 0 2px;padding:7px 12px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);font-size:11.5px;font-weight:700}
html body .rt-pop .rth33:not(#z42)::after{content:" · select one";text-transform:none;letter-spacing:0;font-weight:500;color:#64748b}
html[data-mode="dark"] body .rt-pop .rth33:not(#z42){background:#1b2333;color:#cbd5e1}
.rt-pop .rth33 ~ button{padding-left:26px!important}
html body .rt-pop .rth33:not(#z42){white-space:nowrap}
/* Q216 Close × white border by default */
html body #x42:not(#z42){border:2px solid #fff!important;box-shadow:0 0 0 1px rgba(0,0,0,.08)}
html body #x42:not(#z42):hover{border-color:#fff!important}
/* Q217 TIME-LINE time bar navy, bold white times */
html body .ax97.tl42:not(#z42){background:#1a3768;border-radius:6px}
html body .ax97.tl42 .tk97:not(#z42){color:#fff!important;font-weight:800!important;font-size:13.5px}
html body .ax97.tl42 .tk97.nw:not(#z42){color:#fde047!important}
/* Q218 Real-Time card menu: no "Open" */
.rt-pop a[href$="-live-alarms"]{display:none!important}
/* Q219 reading time in the apartments pop-up title */
.swal2-title .rd42{font-size:14px;font-weight:500;color:var(--muted);margin-left:8px;letter-spacing:0;text-transform:none}
/* Q220 info icon with the "boxes are filled from" text as a tooltip */
.swal2-title .fi42{display:inline-grid;place-items:center;width:20px;height:20px;border-radius:50%;border:1.5px solid var(--blue42);color:var(--blue42);font:700 12px/1 Georgia,serif;font-style:italic;cursor:help;vertical-align:middle;margin-left:6px;text-transform:none}
/* Q221 time bar per building, thinner, no inner vertical scroll */
.ax97.tl42:not(.ax42r){display:none!important}
html body .ax97.ax42r:not(#z42){position:relative;top:auto;margin:10px -12px 0;border-radius:4px;z-index:1}
html body .ax97.ax42r .tr97:not(#z42){height:22px}
html body .ax97.ax42r .tk97:not(#z42){font-size:12.5px}
html body .sc97:not(#z42){max-height:none!important;overflow-y:hidden!important}
/* Q222 sideways scroll per building */
html body .sc97:not(#z42){overflow:visible!important}
.bw42{overflow-x:auto;overflow-y:hidden;max-width:100%;margin:0 0 6px;padding:0 12px;border-bottom:1px solid var(--line)}
html body .tl97:not(#z42){width:auto!important;max-width:100%}
.bw42 > *{width:var(--w42);min-width:var(--w42);box-sizing:border-box}
/* Q223 (Sam 15 Oct 13:14 "on open alert keep alert name and buildin name and aert value bigger"): Open alerts rows (main screen and
   the live pop-up use the same .te28 rows) */
html body .te28 .w28 > b:not(#z42),html body .te28 .w28 .bn28:not(#z42),html body .te28 .w28 .tv28:not(#z42){font-size:18px!important;line-height:1.3}
html body .te28 .w28 .tv28:not(#z42){font-weight:700}
html body .te28 .w28 > .muted:not(#z42){font-size:15px}
/* Q224 Details pop-up: actions at the top */
.act42{display:flex;flex-wrap:wrap;gap:8px 10px;align-items:center;padding:0 0 12px;margin:0 0 12px;border-bottom:1px solid var(--line)}
.act42 .n1-acts,.act42 .n1-note{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:0!important}
.act42 .n1-note{flex:1 1 380px}.act42 .n1-note .in{flex:1;min-width:200px}
.who42{margin:0 0 14px}
/* Q225 no Open button on alert rows */
.te28 [data-arep]{display:none!important}
/* Q226 one compact row */
.te28 .w28 .st42{font-size:13px;margin-left:10px;white-space:nowrap}
html body .te28 .row33:not(#z42){grid-template-columns:auto minmax(0,1fr) auto;gap:0 12px}
.te28 .row33 > span:nth-child(3):empty{display:none}
html body .te28 .row33 .lab28:not(#z42){grid-column:3;grid-row:1;height:auto;margin:0;display:flex;gap:10px;justify-content:flex-end}
html body .te28 .row33 .lab28 > span:not(#z42){position:static!important;width:auto!important;left:auto!important}
.te28 .row33 .lab28 > span:not(.tt33){display:none}
/* Q228 time line stops before the Live button; Q229 alert value in the top-bar blue */
html body .te28 .row33:not(#z42){margin-right:var(--aw42,180px)}
html body .te28 .w28 .tv28:not(#z42){color:#1E40AF!important}
html[data-mode="dark"] body .te28 .w28 .tv28:not(#z42){color:#93b4ff!important}
/* Q230 (Sam 15 Oct 13:22 "make time bar in light grey only on the time line screen"): TIME-LINE time bars light grey, dark bold times
   (replaces the Q217 navy) */
html body .ax97.tl42:not(#z42){background:#e5e7eb!important}
html body .ax97.tl42 .tk97:not(#z42){color:#111827!important}
html body .ax97.tl42 .tk97.nw:not(#z42){color:#1E40AF!important}
html[data-mode="dark"] body .ax97.tl42:not(#z42){background:#334155!important}
html[data-mode="dark"] body .ax97.tl42 .tk97:not(#z42){color:#f1f5f9!important}
html[data-mode="dark"] body .ax97.tl42 .tk97.nw:not(#z42){color:#93b4ff!important}
/* Q231 time bar under the building name bar */
html body .rw97 > .ax97.ax42r:not(#z42){margin:0 0 2px 14px;padding-left:0;padding-right:0;width:auto;min-width:0;box-sizing:border-box}
/* Q236 (Sam 13:29 "starting from same point and ending at same point") name bar, time bar, time line same left/right */
html body .rw97 > .ax97.ax42r:not(#z42) > .tr97{margin-left:-14px;background:transparent}
html body .rw97 > .nm97:not(#z42){margin-left:14px;padding-left:0!important;position:relative!important;width:auto!important;max-width:none!important;min-width:0!important;box-sizing:border-box}
html body .rw97 > .nm97:not(#z42) > .nm42{position:sticky;left:0;display:flex;flex-wrap:wrap;align-items:baseline;gap:inherit;max-width:calc(100vw - 120px)}
/* Q232 (Sam 13:28 "and building bar must have white back ground") */
html body .rw97 > .nm97:not(#z42),html body .rw97.sel97 > .nm97:not(#z42){background:#fff!important}
html[data-mode="dark"] body .rw97 > .nm97:not(#z42){background:var(--surface)!important}
/* Q233 brighter green building name on alert rows */
html body .te28 .w28 .bn28:not(#z42){color:#059669!important}
html[data-mode="dark"] body .te28 .w28 .bn28:not(#z42){color:#34d399!important}
/* Q234/Q235 Details pop-up sections as simple cards */
.swal2-popup .sec42{border:1px solid var(--line);border-radius:10px;padding:10px 14px;margin:0 0 12px;background:var(--surface);break-inside:avoid}
.swal2-popup .cause.sec42{background:var(--surface)}
.swal2-popup .fold42{margin-top:0}
.swal2-popup .fold42 .eff li{font-size:16.5px}
.swal2-popup .fold42 .lbl{font-size:13px}
.swal2-popup .who42 .trail{font-size:16px}
/* Q237 Details: fixed left (Do first, cause, who, what the app checked) and right (At the time + apartment temps, evidence) columns */
html body .swal2-popup .col37:has(> .cols42):not(#z42){column-count:1!important;columns:auto!important}
.cols42{display:grid;grid-template-columns:1fr 1fr;gap:0 32px;align-items:start}
.cols42 > .c42r{border-left:1px solid var(--line2);padding-left:16px;margin-left:-16px}
.cols42 > div{min-width:0}
@media (max-width:760px){.cols42{grid-template-columns:1fr}.cols42 > .c42r{border-left:0;padding-left:0;margin-left:0}}
/* Q239 Evidence at the top, full width */
.ev42 svg{max-height:110px;width:100%}
html body .ev42:not(#z42) > :not(.lbl):not(svg){font-size:15.5px!important}
/* Q242 clear calendar for every date field */
input.dpx42{display:none!important}
html body button.dp42:not(#z42){display:inline-flex;align-items:center;gap:8px;text-align:left;cursor:pointer;min-width:178px;font:inherit;font-size:15px;font-weight:600;color:#111827;background:var(--surface,#fff);text-transform:none;letter-spacing:0}
html body button.dp42:not(#z42) svg{color:#1E40AF;flex:none}
html body button.dp42.emp42:not(#z42){color:#6b7280;font-weight:500}
html body button.dp42:not(#z42):hover{border-color:#1E40AF}
.dp42pop{position:fixed;z-index:100000;background:#fff;border:1px solid #c7d2fe;border-radius:12px;box-shadow:0 12px 32px rgba(15,23,42,.22);padding:12px;width:304px;font-size:15px;color:#111827}
.dp42pop .hd42{display:flex;gap:6px;align-items:center;margin-bottom:8px}
.dp42pop select{flex:1;font:inherit;font-weight:700;padding:5px 6px;border:1px solid #d1d5db;border-radius:8px;background:#fff;color:#111827}
.dp42pop select.yr42{flex:.8}
.dp42pop .nv42{width:34px;height:34px;border:1px solid #d1d5db;border-radius:8px;background:#fff;font-size:20px;line-height:1;color:#1E40AF;cursor:pointer}
.dp42pop .nv42:hover{background:#eef2ff}
.dp42pop .wk42,.dp42pop .gd42{display:grid;grid-template-columns:repeat(7,1fr);gap:3px;text-align:center}
.dp42pop .wk42 b{font-size:12.5px;color:#4b5563;padding:4px 0}
.dp42pop .gd42 button{height:36px;border:0;border-radius:8px;background:transparent;font:inherit;font-weight:600;color:#111827;cursor:pointer}
.dp42pop .gd42 button:hover:not(:disabled){background:#eef2ff}
.dp42pop .gd42 button.td42{box-shadow:inset 0 0 0 2px #1E40AF}
.dp42pop .gd42 button.on42{background:#1E40AF;color:#fff}
.dp42pop button:disabled{color:#c4c9d2;cursor:default}
.dp42pop .qk42{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px;padding-top:10px;border-top:1px solid #e5e7eb}
.dp42pop .qk42 button{border:1px solid #1E40AF;border-radius:999px;background:#fff;color:#1E40AF;font:inherit;font-size:13px;font-weight:600;padding:4px 10px;cursor:pointer}
.dp42pop .qk42 button:hover:not(:disabled){background:#1E40AF;color:#fff}
.dp42pop .qk42 .cl42{border-color:#9ca3af;color:#4b5563}
html[data-mode="dark"] .dp42pop,html[data-mode="dark"] .dp42pop select,html[data-mode="dark"] .dp42pop .nv42,html[data-mode="dark"] .dp42pop .qk42 button{background:var(--surface);color:var(--fg);border-color:var(--line)}
html[data-mode="dark"] .dp42pop .gd42 button{color:var(--fg)}
html[data-mode="dark"] body button.dp42:not(#z42){color:var(--fg)}
html body .dp42pop .qk42 button:not(#z42){text-transform:none;letter-spacing:0}
/* Q243 (Sam 13:50 "Activity report -> we are wasting a lot of space in the column headers ... a lot of horizontal scrolling") report headers wrap onto 2 lines */
html body #lvrep table.rpt thead th:not(#z42){white-space:normal;vertical-align:bottom;line-height:1.2;letter-spacing:.03em;min-width:64px;padding-left:8px;padding-right:8px}
html body #lvrep table.rpt td:not(#z42){padding-left:8px;padding-right:8px}
/* Q244 Report > Trend: tabs, one clear legend, facts line, animations */
.tr42 .tbs42{display:flex;flex-wrap:wrap;gap:6px;margin:4px 0 8px;align-items:center}
.tr42 .tbs42 button{border:1px solid #1E40AF;border-radius:999px;background:#fff;color:#1E40AF;font:inherit;font-size:14px;font-weight:700;padding:6px 14px;cursor:pointer}
.tr42 .tbs42 button.on{background:#1E40AF;color:#fff}
.tr42 .tbs42 .shl42{margin-left:auto;border-color:#9ca3af;color:#374151;font-weight:600}
.tr42 .fx42{margin:2px 0 8px;font-size:15px;color:#1f2937}
.tr42 .bd42{display:block}
.tr42 .bd42.wl42{display:grid;grid-template-columns:minmax(0,1fr) 250px;gap:12px;align-items:start}
.tr42 .cw42{position:relative;border:1px solid var(--line);border-radius:10px;padding:6px;background:var(--surface)}
.tr42 .sv42{display:block;width:100%;height:auto}
.tr42 .gr42{stroke:var(--line);stroke-width:1} .tr42 .ax42{font:12px var(--sans);fill:#374151} .tr42 .u42{font-weight:700}
.tr42 .nt42{fill:#eef2f7} .tr42 .hv42{stroke:#6b7280;stroke-dasharray:3 3}
.tr42 .pl42{stroke-dasharray:1;stroke-dashoffset:1;animation:dr42 1.1s ease-out var(--d42,0ms) forwards}
@keyframes dr42{to{stroke-dashoffset:0}}
.tr42 .br42{transform-box:fill-box;transform-origin:bottom;transform:scaleY(0);animation:gw42 .6s cubic-bezier(.2,.8,.2,1) var(--d42,0ms) forwards}
@keyframes gw42{to{transform:scaleY(1)}}
.tr42 .tp42{position:absolute;top:8px;min-width:190px;padding:8px 10px;border-radius:8px;background:#fff;color:#111827;border:1px solid #c7d2fe;box-shadow:0 8px 22px #0000002e;font-size:13px;pointer-events:none;z-index:2}
.tr42 .tp42 div{display:flex;align-items:center;gap:6px;white-space:nowrap} .tr42 .tp42 i{width:9px;height:9px;border-radius:50%} .tr42 .tp42 div b{margin-left:auto;padding-left:12px}
.tr42 .lg42t{border:1px solid var(--line);border-radius:10px;padding:8px;background:var(--surface)}
.tr42 .lgh42{display:flex;align-items:center;justify-content:space-between;gap:6px;margin-bottom:6px;font-size:13px}
.tr42 .lgh42 span{display:flex;gap:4px}
.tr42 .lgh42 button{border:1px solid #d1d5db;border-radius:6px;background:#fff;font:inherit;font-size:12px;font-weight:600;padding:2px 6px;cursor:pointer;color:#1E40AF}
.tr42 .lgi42{display:grid;grid-template-columns:28px 1fr auto;gap:6px;align-items:center;width:100%;text-align:left;border:0;border-radius:6px;background:transparent;padding:5px 4px;font:inherit;font-size:14px;color:#111827;cursor:pointer}
.tr42 button.lgi42:hover{background:#eef2ff}
.tr42 .lgi42:not(.on){opacity:.42} .tr42 .lgi42:not(.on) .ln42{text-decoration:line-through}
.tr42 .lgi42 small{color:#6b7280;font-weight:500} .tr42 .lgi42 > b{font-variant-numeric:tabular-nums}
.tr42 .hk42{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-bottom:8px;font-size:13px}
.tr42 .hk42 > span:not(.hs42){padding:3px 8px;border-radius:6px;font-weight:600}
.tr42 .hs42{margin-left:auto;display:flex;gap:4px;align-items:center;color:#374151}
.tr42 .hs42 button{border:1px solid #1E40AF;border-radius:999px;background:#fff;color:#1E40AF;font:inherit;font-size:12.5px;font-weight:600;padding:3px 10px;cursor:pointer} .tr42 .hs42 button.on{background:#1E40AF;color:#fff}
.tr42 .hm42w{overflow:auto;max-height:560px;border:1px solid var(--line);border-radius:10px}
.tr42 .hm42{border-collapse:separate;border-spacing:2px;font-size:13.5px;min-width:100%}
.tr42 .hm42 th{position:sticky;top:0;background:var(--surface);font-weight:700;padding:4px 6px;white-space:nowrap;z-index:1;color:#374151;text-align:center}
.tr42 .hm42 th small{display:block;font-weight:500;color:#6b7280}
.tr42 .hm42 tbody th{position:sticky;left:0;z-index:1;text-align:left}
.tr42 .hm42 td{text-align:center;padding:5px 6px;border-radius:4px;font-weight:600;white-space:nowrap;opacity:0;animation:fi42 .4s ease-out var(--d42,0ms) forwards}
@keyframes fi42{to{opacity:1}}
.tr42 .c64{background:#1d4ed8;color:#fff} .tr42 .c67{background:#bfdbfe;color:#1e3a8a} .tr42 .c76{background:#d1fae5;color:#065f46}
.tr42 .c80{background:#fed7aa;color:#9a3412} .tr42 .c81{background:#dc2626;color:#fff} .tr42 .na42{background:#f3f4f6;color:#6b7280}
.tr42 .hm42 .sm42{background:transparent;color:#111827;font-weight:600}
@media (prefers-reduced-motion:reduce){.tr42 .pl42,.tr42 .br42,.tr42 .hm42 td{animation:none;stroke-dashoffset:0;transform:none;opacity:1}}
@media (max-width:900px){.tr42 .bd42.wl42{grid-template-columns:1fr}}
html[data-mode="dark"] .tr42 .tbs42 button:not(.on),html[data-mode="dark"] .tr42 .lgh42 button,html[data-mode="dark"] .tr42 .hs42 button:not(.on),html[data-mode="dark"] .tr42 .tp42{background:var(--surface);color:var(--fg)}
html[data-mode="dark"] .tr42 .ax42{fill:var(--muted)} html[data-mode="dark"] .tr42 .nt42{fill:#ffffff0d} html[data-mode="dark"] .tr42 .lgi42,html[data-mode="dark"] .tr42 .fx42{color:var(--fg)}
/* Q245 sensor box row under its main box */
.bx18 tr.sb45r td{background:color-mix(in srgb,#1E40AF 5%,var(--surface))}
.bx18 tr.sb45r td:nth-child(3){padding-left:26px}
/* Q206 fixed-format import */
.im2g{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:12px;align-items:start}
@media (max-width:1000px){.im2g{grid-template-columns:1fr}}
.im2l td,.im2l th{padding:4px 8px}
.im2r tr.im2s td{background:color-mix(in srgb,#f59e0b 8%,var(--surface))}
.apt33.sb45{outline:1px dashed #6b7280;outline-offset:-2px}
.apt33.sb45 .rd45{display:block;font-size:10.5px;color:#4b5563;font-weight:600;line-height:1.1}
.lv-apts .sb45n{margin:2px 0 6px;color:#374151}
/* Sam 15:35: Metrics toolbar compact, one row each, and it stays on screen while scrolling */
html body .mt-bar:not(#z42){gap:8px 10px!important;align-items:center;position:sticky;top:var(--hd42,100px);z-index:30;background:var(--pg42,#fff);padding:8px 0 6px!important;margin-top:-8px}
html body .mt-bar .mt-bp > summary:not(#z42){padding:6px 12px!important;font-size:12px!important;min-height:0!important}
html body .mt-tabs > button:not(#z42){font-size:13px!important;padding:6px 11px!important;line-height:1.25!important;min-height:0!important}
html body .mtr33:not(#z42){gap:8px!important}
html body .mt-ctl:not(#z42){position:sticky;top:calc(var(--hd42,100px) + var(--mb42,46px));z-index:29;background:var(--pg42,#fff);padding:4px 0 8px!important;margin:0!important;gap:8px 12px!important;flex-wrap:wrap;align-items:center}
html body .mt-ctl .g42bar:not(#z42){margin:0!important;display:flex;align-items:center;gap:6px!important;padding:0!important;border:0}
html body .mt-ctl .seg > button:not(#z42){font-size:13px!important;padding:6px 11px!important;line-height:1.25!important;min-height:0!important}
html body .mt-ctl .mt-dt:not(#z42){gap:6px!important;font-size:13px!important}
html body .mt-ctl button.dp42:not(#z42){font-size:13px!important;padding:6px 10px!important;min-height:0!important}
html body .mt-ctl .mtx20 .btn.sm:not(#z42){font-size:11px!important;padding:5px 10px!important;min-height:0!important}
html body .mt-ctl .mtx20:not(#z42){gap:6px!important;margin-left:auto!important}
html body .mt-ctl .mtx20 label:not(#z42){font-size:12.5px!important}
html body .mt-ctl.st42 , html body .mt-bar.st42{box-shadow:0 6px 8px -8px rgba(15,23,42,.35)}
/* Sam 15:43: Table / Graph far right; one scroll bar; Event column narrow; report graphs */
html body .mt-ctl .g42bar:not(#z42){order:99;margin-left:8px!important}
html body #mtout .mt-wrap:not(#z42){max-height:none;overflow:auto}
html body #mtout .mt-wrap.wx42:not(#z42){overflow-x:auto}
html body #mtout .mt-wrap:not(.wx42) thead th:not(#z42){position:sticky;top:0;z-index:5;background:var(--surface2,#f1f5f9)}
html body #mtout .ev42:not(#z42){width:1%;white-space:nowrap}
.g42r{display:grid;gap:10px}.g42h{margin:4px 0 2px;font-size:13.5px;font-weight:600}
html body #mtout .brp-ctl:not(#z42){position:sticky;top:0;z-index:29;background:var(--pg42,#fff);padding:4px 0 8px;margin:0}
html body #mtout .brp-ctl .g42bar:not(#z42){order:99;margin:0 0 0 auto!important;display:flex;align-items:center;gap:6px}
html body #mtout .brp-t:not(#z42){max-height:none;overflow:auto}
html body #mtout .brp-t.wx42:not(#z42){overflow-x:auto}
html body #mtout .brp-t:not(.wx42) thead th:not(#z42){position:sticky;top:0;z-index:5;background:var(--surface2,#f1f5f9)}
html body #mtout .brp-ctl:not(#z42){position:sticky;top:0;z-index:29;background:var(--pg42,#fff);padding:4px 0 8px;margin:0}
html body #mtout .brp-ctl .g42bar:not(#z42){order:99;margin:0 0 0 auto!important;display:flex;align-items:center;gap:6px}
html body #mtout .brp-t:not(#z42){max-height:none;overflow:auto}
html body #mtout .brp-t.wx42:not(#z42){overflow-x:auto}
html body #mtout .brp-t:not(.wx42) thead th:not(#z42){position:sticky;top:0;z-index:5;background:var(--surface2,#f1f5f9)}
/* Sam 15:52: More menu in the top bar; violations-only users lose the empty second row */
.mr42{position:relative;display:inline-flex}
.mr42c{font-size:10px;margin-left:4px;display:inline-block;transition:transform .15s}
.mr42.open .mr42c{transform:rotate(180deg)}
.mr42m{display:none;position:absolute;right:0;top:calc(100% + 6px);min-width:200px;background:var(--surface,#fff);border:1px solid var(--line);border-radius:12px;box-shadow:0 12px 28px -8px rgba(15,23,42,.35);padding:6px;z-index:200}
.mr42.open .mr42m{display:grid;gap:2px}
html body .mr42m a.mr42i:not(#z42){display:block;padding:9px 12px;border-radius:8px;color:var(--ink,#0f172a);text-decoration:none;font-weight:600;font-size:14px;letter-spacing:0;text-transform:none;background:transparent;border:0}
html body .mr42m a.mr42i:hover:not(#z42){background:var(--blue42s,#dbe4ff)}
html body .mr42m a.mr42i.on:not(#z42){background:#1E40AF;color:#fff}
html body .top2.nb42e:not(#z42){display:none}
/* Sam 16:02: building name bar with the top bar's blue line, Table / Graph on the same line; Oil days easier to read */
html body #mtout .tt42:not(#z42){display:flex;align-items:center;gap:10px 16px;flex-wrap:wrap;border-bottom:3px solid #1E40AF;padding:8px 4px 8px;margin:10px 0 0}
html body #mtout .tt42n:not(#z42){display:flex;align-items:baseline;gap:8px;font-weight:700;font-size:17px}
html body #mtout .tt42n small:not(#z42){font-weight:500;font-size:13px;color:var(--muted)}
html body #mtout .tt42 .g42bar:not(#z42){margin:0 0 0 auto!important;order:0;display:flex;align-items:center;gap:6px}
html body #mtout caption.cap42h:not(#z42){display:none}
html[data-mode="dark"] body #mtout .tt42:not(#z42){border-bottom-color:#3B63D9}
html body #mtout td.ol42:not(#z42),html body #mtout th.ol42:not(#z42){padding-left:9px;padding-right:9px;border-right:1px solid color-mix(in srgb,var(--line) 70%,transparent)}
html body #mtout .ol42b:not(#z42){background:color-mix(in srgb,#1E40AF 10%,transparent)}
html body #mtout thead th.ol42:not(#z42){white-space:nowrap}
.mt-k.m-lb i,.mt-t td.m-lb{background:color-mix(in srgb,var(--cold) 13%,var(--surface))}

/* Sam 16:34: one top bar + user menu */
html body header.top[data-one42] .top2:not(#z42){display:none!important}
html body header.top[data-one42] .top1:not(#z42){display:flex;align-items:center;gap:10px}
html body header.top[data-one42] .top-c:not(#z42){flex:1;display:flex;justify-content:flex-end;min-width:0}
html body header.top[data-one42] .top-c .navr:not(#z42){display:flex;flex-wrap:wrap;gap:8px;justify-content:flex-end;align-items:center}
html body header.top[data-one42] .top-me > .th-seg:not(#z42),html body header.top[data-one42] .top-me > #clk:not(#z42),html body header.top[data-one42] .top-me > #logout:not(#z42){display:none!important}
html body header.top[data-one42] .top-l:not(#z42){border-right:0}
.um42{position:relative;display:inline-flex}
html body .um42b:not(#z42){display:inline-flex;align-items:center;gap:7px;padding-left:5px}
.um42i{display:inline-grid;place-items:center;width:26px;height:26px;border-radius:50%;background:#fff;color:#1E40AF;font-weight:800;font-size:11px;letter-spacing:0}
.um42m{display:none;position:absolute;right:0;top:calc(100% + 8px);min-width:250px;background:#0f1f4d;color:#fff;border:1px solid rgba(255,255,255,.15);border-radius:14px;box-shadow:0 16px 36px -10px rgba(0,0,0,.5);padding:8px;z-index:200}
.um42.open .um42m{display:grid;gap:2px}
.um42h{padding:10px 12px 12px;border-bottom:1px solid rgba(255,255,255,.15);margin-bottom:6px;display:grid;gap:3px}
.um42h b{font-size:17px;letter-spacing:0;text-transform:none}.um42h span{font-size:12px;opacity:.75;letter-spacing:0;text-transform:none}
html body .um42m button:not(#z42){all:unset;cursor:pointer;display:block;padding:9px 12px;border-radius:8px;font-size:14px;font-weight:600;color:#fff;letter-spacing:0;text-transform:none}
html body .um42m button:hover:not(#z42),html body .um42m button.on:not(#z42){background:rgba(255,255,255,.14)}
.um42t{display:flex;align-items:center;gap:4px;padding:2px 0 2px 12px;font-size:13px;opacity:.95}.um42t span{flex:1}
html body .um42t button:not(#z42){padding:6px 10px}
html body .um42m .um42o:not(#z42){border-top:1px solid rgba(255,255,255,.15);border-radius:0 0 8px 8px;margin-top:4px}
.um42d{position:fixed;inset:0;background:rgba(15,23,42,.45);display:grid;place-items:center;z-index:500}
.um42c{background:var(--surface,#fff);color:var(--ink,#0f172a);border-radius:14px;padding:20px 22px;width:min(420px,92vw);box-shadow:0 20px 40px -12px rgba(0,0,0,.4)}
.um42c h3{margin:0 0 12px;border-bottom:3px solid #1E40AF;padding-bottom:8px}
.um42f{display:grid;gap:4px;margin-bottom:10px;font-size:13px;font-weight:600}.um42f input{padding:8px 10px;border:1px solid var(--line);border-radius:8px;font-size:14px}
.um42e{color:#b91c1c;font-size:13px;min-height:1em;margin:4px 0}.um42a{display:flex;justify-content:flex-end;gap:8px}
html body header.top[data-one42]:not(#z42){overflow:visible!important;z-index:300!important;position:sticky}
html body header.top[data-one42] .top1:not(#z42),html body header.top[data-one42] .top-c:not(#z42),html body header.top[data-one42] .navr:not(#z42),html body header.top[data-one42] .top-me:not(#z42){overflow:visible!important}
html body header.top[data-one42] .top1:not(#z42){clip-path:none!important;box-shadow:none!important}
html body header.top[data-one42]:not(#z42){background:#1E40AF!important}
html body .mr42m a.mr42i:not(#z42):not(.on){color:var(--ink,#0f172a)!important;background:transparent!important;border:0!important;box-shadow:none!important;font-family:inherit!important;letter-spacing:0!important}
html body .mr42m a.mr42i:not(#z42):not(.on):hover{background:var(--blue42s,#dbe4ff)!important}
/* Sam 16:39 Live: Close on the controls line, progress in the Columns row */
html body main.la .la-h.la42:not(#z42){padding-right:110px}
html body main.la .la29 .la-p.la42p:not(#z42){margin:0 0 0 auto;display:flex;align-items:center;gap:10px;padding:0}
html body main.la .la29:not(#z42){display:flex;align-items:center;gap:12px;flex-wrap:wrap}
/* Sam 16:43: Live as a main button, smaller More */
html body header.top[data-one42] .mr42.sm42 > button.nb:not(#z42){font-size:11px;padding:5px 10px;min-height:0}
html body header.top[data-one42] a.nb.lv42:not(#z42){display:inline-flex;align-items:center;gap:6px}
html body header.top[data-one42] a.nb.lv42:not(#z42){color:#065f46!important;letter-spacing:.06em!important;font-size:13px!important;padding:6px 14px!important}
html body header.top[data-one42] a.nb-ai.ai42:not(#z42){margin:0!important;align-self:center}
html body main.aip .ai-two.one42:not(#z42){grid-template-columns:1fr}
/* Sam 16:55: clear line icons in the user menu */
html body .um42m button[data-um42]:not(#z42){display:flex;align-items:center;gap:12px}
.um42s{width:20px;height:20px;flex:none;fill:none;stroke:#fff;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
/* Sam 16:55: Live, first row in the top-bar colour */
html body main.la .la-h.la42:not(#z42){background:#1E40AF;color:#fff;margin:-16px -16px 10px;padding:10px 120px 10px 16px;border-radius:0}
html body main.la .la-h.la42 h2:not(#z42),html body main.la .la-h.la42 label:not(#z42){color:#fff}
html body main.la .la-h.la42 #lapause:not(#z42){background:transparent;color:#fff;border-color:#fff}
html.fs42 body #x42:not(#z42){background:#fff;color:#1E40AF;border-color:#fff}
html body .um42m:not(#z42){background:#1E40AF;border-color:rgba(255,255,255,.25)}
html body main.la .la-h.la42 select:not(#z42),html body main.la .la-h.la42 input:not(#z42){color:#0f172a;background-color:#fff}
/* Sam 17:01: each building's action buttons smaller so they fit on one row */
html body main .acb27:not(#z42){gap:4px!important}
html body main .acb27 > .btn.sm:not(#z42){font-size:10.5px!important;padding:4px 8px!important;letter-spacing:.02em!important;min-height:0!important}
/* Sam 17:06/17:09: Report tab title line like Metrics; Save + View on the same line */
html body #lvrep .tt42:not(#z42){display:flex;align-items:center;gap:10px 16px;flex-wrap:wrap;border-bottom:3px solid #1E40AF;padding:8px 4px 8px;margin:10px 0 0}
html body #lvrep .tt42n:not(#z42){display:flex;align-items:baseline;gap:8px;font-weight:700;font-size:17px}
html body #lvrep .tt42n small:not(#z42){font-weight:500;font-size:13px;color:var(--muted)}
html body #lvrep .tt42 .g42bar:not(#z42),html body #mtout .tt42 .g42bar:not(#z42){margin:0!important;display:flex;align-items:center;gap:6px}
html body .tt42 .sv42r:not(#z42){margin:0 0 0 auto!important;display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:0!important;border:0!important}
html body #lvrep:not(.mt22rep) .rp-top .rpv33:not(#z42){display:none!important}
html[data-mode="dark"] body #lvrep .tt42:not(#z42){border-bottom-color:#3B63D9}
/* Sam 17:15: selected building readable in dark mode */
html[data-mode="dark"] body .li27[aria-current="true"]:not(#z42){background:rgba(59,99,217,.28)!important;border-color:#3B63D9!important}
/* Live: only the table box scrolls */
html.fs42 body main.la:not(#z42){padding-bottom:0!important}
/* Sam 17:15 (Amit thread): boiler data table lines in the BOILERS box */
.dg24-gl{stroke:rgba(5,150,105,.45);stroke-width:1}
.dg24-gl2{stroke:rgba(5,150,105,.2)}
html[data-mode="dark"] .dg24-gl{stroke:rgba(52,211,153,.4)} html[data-mode="dark"] .dg24-gl2{stroke:rgba(52,211,153,.18)}
/* Sam 17:20: More menu readable in dark mode (top-bar blue, white text, like the user menu) */
html[data-mode="dark"] body .mr42m:not(#z42){background:#1E40AF!important;border-color:rgba(255,255,255,.25)!important}
html[data-mode="dark"] body .mr42m a.mr42i:not(#z42):not(.on){color:#fff!important}
html[data-mode="dark"] body .mr42m a.mr42i:not(#z42):not(.on):hover{background:rgba(255,255,255,.14)!important}
html[data-mode="dark"] body .mr42m a.mr42i.on:not(#z42){background:#fff!important;color:#1E40AF!important}
html body .btn.sm.tl42b:not(#z42){background:#16a34a!important;border-color:#16a34a!important;color:#fff!important;margin-left:6px}
html body .btn.sm.tl42b:not(#z42):hover{background:#15803d!important}
html body .btn.tl42b.tl42b:not(.x1):not(.x2):not(.x3):not(#z42),html[data-mode] body .btn.tl42b:not(#z42):not(#z43){background:#16a34a!important;border-color:#16a34a!important;color:#fff!important;margin-left:8px}
html body .btn.tl42b.tl42b:not(.x1):not(.x2):not(.x3):not(#z42):hover,html[data-mode] body .btn.tl42b:not(#z42):not(#z43):hover{background:#15803d!important;border-color:#15803d!important}
/* Sam 17:24: TIME-LINE button exactly like Prediction(s), fluorescent green */
html body .btn.pd42.tl42b.tl42b:not(.x1):not(.x2):not(.x3):not(.x4):not(#z42),html[data-mode] body .btn.pd42.tl42b:not(#z42):not(#z43):not(#z44){background:#22E55E!important;border-color:#22E55E!important;color:#052e16!important;margin-left:8px;box-shadow:0 0 10px rgba(34,229,94,.55)}
html body .btn.pd42.tl42b.tl42b:not(.x1):not(.x2):not(.x3):not(.x4):not(#z42):hover,html[data-mode] body .btn.pd42.tl42b:not(#z42):not(#z43):not(#z44):hover{background:#4ade80!important;border-color:#4ade80!important}
/* Sam 17:25: less space between the top row and the building name (Report tab and Metrics) */
html body #mtout .tt42.tt42:not(#z42),html body #lvrep .tt42.tt42:not(#z42){margin-top:0!important;padding-top:2px!important}
html body #mtout .brp-ctl:not(#z42),html body #lvrep .brp-ctl:not(#z42){margin-bottom:2px!important}
/* Sam 17:27 (Amit thread): TIME-LINE first row on the Close × line; room on the right for Close */
html body main .dyh97.dyh42:not(#z42){padding-right:120px;flex-wrap:wrap}
html body main.la .note:not(#z42){display:none!important}
/* Sam 17:31 (Amit thread): TIME-LINE time bar thinner, very light bright green; Close blue like the nav, white on hover */
html body .ax97.ax42r:not(#z42){background:#F5F6F8!important;border:1px solid #E5E7EB!important;box-shadow:none!important}
html body .ax97.ax42r .tr97:not(#z42){height:16px!important;background:transparent!important}
html body .ax97.ax42r .tk97:not(#z42){font-size:11.5px!important;line-height:16px!important;color:#374151!important}
html.fs42:has(main .dyh97) body #x42:not(#z42){background:#1E40AF;color:#fff;border-color:#1E40AF!important}
html.fs42:has(main .dyh97) body #x42:not(#z42):hover{background:#fff;color:#1E40AF;border-color:#1E40AF!important}
/* Sam 17:35 (Q282): TIME-LINE building bar shows only the building name; Listen (Q147) withdrawn */
html body .nm97 .nm42 > :not(a):not(#z42){display:none!important}
html body .ls41:not(#z42){display:none!important}
/* Sam 17:38: space between buildings on TIME-LINE; time bar very light grey */
html body .tl97 > .bw42:not(#z42){margin-bottom:28px!important}
html body .rw97 .nm97:not(#z42){border-bottom-color:#E5E7EB!important}
/* Sam 17:39: the Report tab's period row is spaced and aligned as on Metrics; Activity / Current Status / Daily lines up with View below */
@media (min-width:981px){html body #lvrep .brp-ctl:not(#z42){padding:4px 420px 8px 0!important}
html body #lvrep > .rp-top:not(#z42){right:18px!important;top:21px!important}}
html body #lvrep .rp-top .seg button:not(#z42){padding-top:9px!important;padding-bottom:9px!important}
html body .one42:not(#z42){overflow:auto!important}
/* Sam 17:50: the one table uses the whole window height (no 64px gap under the page) */
html.one42m body main.page:not(#z42){padding-bottom:8px!important}
/* Sam 17:53: Metrics graphs draw in like the Activity / Status graphs; legend items toggle their line */
.g42 .pl42{stroke-dasharray:1;stroke-dashoffset:1;animation:dr42 1.1s ease-out var(--d42,0ms) forwards}
.g42 .pt42{opacity:0;animation:fi42 .35s ease-out calc(var(--d42,0ms) + .8s) forwards}
html body .g42k .g42s:not(#z42){display:inline-flex;align-items:center;gap:6px;border:1px solid transparent;background:none;border-radius:999px;padding:2px 8px;font:inherit;color:inherit;cursor:pointer}
html body .g42k .g42s:not(#z42):hover{border-color:var(--line,#d1d5db)}
html body .g42k .g42s:not(.on):not(#z42){opacity:.4;text-decoration:line-through}
.g42k .g42s i{display:inline-block;width:14px;height:3px;border-radius:2px}
html body .g42k .g42ka:not(#z42){display:inline-flex;gap:4px;margin-right:8px}
html body .g42k .g42ka button:not(#z42){border:1px solid #1E40AF;color:#1E40AF;background:#fff;border-radius:999px;padding:2px 10px;font:600 12px var(--sans,system-ui);cursor:pointer}
html body .g42k .g42ka button:not(#z42):hover{background:#1E40AF;color:#fff}
@media (prefers-reduced-motion:reduce){.g42 .pl42,.g42 .pt42{animation:none;stroke-dashoffset:0;opacity:1}}
/* Q295: Help toggle lives in the user menu; page help icon in the bar */
html body .hl42h:not(#z42){display:none!important}
html body .ph42:not(#z42){width:30px;height:30px;padding:0!important;border-radius:50%!important;display:inline-flex;align-items:center;justify-content:center;font-weight:800;font-size:15px;letter-spacing:0}
html body .um42m .hl42s:not(#z42){margin-left:auto;font-size:12px;opacity:.85}
.ph42c p{margin:0 0 10px;line-height:1.5}

/* ===== proto_s43.css ===== */
/* s43: batch of 16 Oct */
/* Q297 + Q309: no Live button on the pop-up's alert rows or on Alert Details */
html body #lvp [data-alive]:not(#z43), html body .swal2-popup [data-alive]:not(#z43), html body .swal2-popup a.btn[href^="#b-"][href$="-live"]:not(#z43) { display:none !important; }
/* Sam 16 Oct 12:24: the 4-choice "Weekday / weekend schedule mode" buttons as a neat 2 x 2 block of equal buttons, easy to read */
html body .set .grp .seg:has(> button:nth-child(4)):not(#z43) { display:inline-grid !important; grid-template-columns:repeat(2, minmax(190px, 1fr)); border-radius:10px !important; overflow:hidden; padding:0 !important; gap:0 !important; flex-wrap:nowrap !important; }
html body .set .grp .seg:has(> button:nth-child(4)) > button:not(#z43) { border-radius:0 !important; margin:0 !important; padding:10px 16px !important; text-align:center; justify-content:center; white-space:nowrap; border:0 !important; border-right:1px solid var(--blue42, #1E40AF) !important; border-bottom:1px solid var(--blue42, #1E40AF) !important; }
html body .set .grp .seg:has(> button:nth-child(4)) > button:nth-child(2n):not(#z43) { border-right:0 !important; }
html body .set .grp .seg:has(> button:nth-child(4)) > button:nth-last-child(-n+2):not(#z43) { border-bottom:0 !important; }
html body .set .grp .fld:has(> .seg > button:nth-child(4)):not(#z43) { grid-column:span 2; min-width:0; }
/* Q310: dialogs fit the window, buttons always visible */
html body .swal2-popup.fit43:not(#z43) { display:flex !important; flex-direction:column; overflow:hidden !important; }
html body .swal2-popup.fit43 > :not(.swal2-html-container):not(#z43) { flex:0 0 auto; }
html body .swal2-popup.fit43 > .swal2-html-container:not(#z43) { flex:1 1 auto; min-height:0; overflow:auto !important; max-height:none !important; }
html body .swal2-popup.fit43 > .swal2-actions:not(#z43) { margin-top:10px; padding-top:10px; border-top:1px solid #E5E7EB; }
html body .swal2-popup.fit43 > .swal2-close:not(#z43) { position:absolute !important; top:8px; right:10px; margin:0 !important; z-index:2; }
html body .login .cr43:not(#z43) { margin:16px 0 0; text-align:center; font-size:12px; color:#6B7280; }
html body main.la td.la-cfh43:not(#z43) { text-align:left; white-space:nowrap; font-size:13px; padding-left:8px; }
/* Q316: the Settings tab's DIT / Aquastat / DT blocks in the Set DITs / Set DTs layout */
html body main .g43:not(#z43) { margin-bottom:14px; }
html body main .g43 > section.grp:not(#z43) { margin:0 !important; min-width:0; }
html body main .g43 > section.grp > header:not(#z43) { flex-wrap:wrap; gap:6px 8px; }
html body main .g43 .scroll:not(#z43), html body main section.one43 .scroll:not(#z43) { overflow:visible; }
html body main section.grp .v43:not(#z43) { padding:8px 14px 12px; }
html body main section.one43 .v43 .t42:not(#z43) { font-size:15px; }
html body main .dts42.g43 .t42:not(#z43) { width:100%; }
/* Q307 Run a SQL file */
.sqf43p{background:#F8FAFC;border:1px solid #E5E7EB;border-radius:8px;padding:8px 10px;font-size:12.5px;max-height:160px;overflow:auto;white-space:pre-wrap;margin:0}
html body .sqf43 tr.sqf43e td:not(#z43){background:#FEF2F2;color:#991B1B}
html body .sqf43 tr.sqf43s td:not(#z43){color:#9CA3AF}
/* Q299 missing customer tables */
.ct43m{margin-top:12px;padding:12px 14px;border:2px solid #DC2626;border-radius:10px;background:#FEF2F2;color:#B91C1C;font-size:15px}
.ct43m b{font-weight:800}
/* Q63: Real-Time banner and tile alert lines */
.rt43{display:inline-flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.rt43 .rt43s{font-size:.85em;opacity:.9}
.rt43 .rt43n{font-size:.75em;opacity:.7;margin-left:4px}
.rt43r{display:inline-block;background:#DCFCE7;color:#166534;border-radius:999px;padding:1px 8px;font-size:.8em;font-weight:600}
#rtban .rt43.crit .rt-bx{color:#FCA5A5;font-weight:700} #rtban .rt43.warn .rt-bx{color:#FCD34D;font-weight:700} #rtban .rt43.info .rt-bx{color:#BFDBFE;font-weight:700}
#rtban .rt43.res .rt-bx{color:#CBD5E1;font-weight:400} #rtban .rt43 .rt43s{color:#E5E7EB}
html body .rt-tile .rt-al.rt43:not(#z43){display:flex;justify-content:center;gap:6px;align-items:baseline}
html body .rt-tile .rt-al.rt43.crit:not(#z43){background:#FEE2E2;color:#B91C1C}
html body .rt-tile .rt-al.rt43.warn:not(#z43){background:#FEF3C7;color:#92400E}
html body .rt-tile .rt-al.rt43.info:not(#z43){background:#DBEAFE;color:#1E40AF}
html body .rt-tile .rt-al.rt43.res:not(#z43){background:#F3F4F6;color:#6B7280}

/* ===== proto_s44.css ===== */
/* Sam 16 Oct 17:33 go: to-do items 26-59 */
/* Q335 (Sam 15:57): the bright blinking LIVE button is back: fluorescent green on every screen, blinking dot; stronger glow on the Live screen */
html body .top-in a.nb-live33:not(#z44){background:#39ff14!important;color:#06290a!important;border-color:#1fd100!important;font-weight:800;box-shadow:0 0 0 2px rgba(57,255,20,.2),0 0 8px rgba(57,255,20,.45)}
html body .top-in a.nb-live33:hover:not(#z44){background:#5cff3f!important}
html body .top-in a.nb-live33 i:not(#z44){background:#06290a;animation:lv33 1.4s ease-in-out infinite}
html body .top-in a.nb-live33.on:not(#z44){box-shadow:0 0 0 3px rgba(57,255,20,.3),0 0 16px rgba(57,255,20,.8)}
html:root[data-mode="dark"] body .top-in a.nb-live33:not(.on):not(#z44){background:#39ff14!important;border-color:#1fd100!important}
@media (prefers-reduced-motion:reduce){html body .top-in a.nb-live33 i:not(#z44){animation:none!important}}
/* Q348 (Sam 17:30): TIME-LINE top bar in the same blue as the Real-Time and Live pop-up bars */
html body main.dy97 .dyh97:not(#z44){background:#1E40AF;color:#fff;margin:-16px -12px 8px;padding:12px 132px 12px 16px!important;border-radius:0;position:relative}
html body:has(main.dy97) #x42#x42:not(#z44){background:transparent!important;color:#fff!important;border:1.5px solid #fff!important}
html body main.dy97 .dyh97 h2:not(#z44), html body main.dy97 .dyh97 .sub:not(#z44), html body main.dy97 .dyh97 .shw97:not(#z44), html body main.dy97 .dyh97 .small:not(#z44), html body main.dy97 .dyh97 label:not(#z44){color:#fff!important}
html body main.dy97 .dyh97 .btn:not(.pri):not(.on):not([aria-pressed="true"]):not(#z44){background:transparent!important;color:#fff!important;border-color:rgba(255,255,255,.85)!important}
html body main.dy97 .dyh97 .btn.on:not(#z44), html body main.dy97 .dyh97 .btn[aria-pressed="true"]:not(#z44){background:#fff!important;color:#1E40AF!important;border-color:#fff!important}
html body main.dy97 .dyh97 input:not(#z44){background:#fff;color:#111827}
/* Q318 */
html body .bt19-bar .dt-exp.exp44:not(#z44){margin-left:auto;display:flex;gap:6px;align-items:center;padding:0;border:0;background:none}
html body main.page:has(.bt19-bar .exp44) .card .dt-container > .dt-layout-row:first-child:empty:not(#z44){display:none}
/* Q320 */
html body main.la table.ng44:not(#z44){table-layout:fixed;width:100%!important;min-width:0!important}
html body main.la table.ng44 th:not(#z44){white-space:normal!important;line-height:1.15;vertical-align:bottom;overflow-wrap:anywhere;padding-left:4px;padding-right:4px}
html body main.la table.ng44 td:not(#z44){padding-left:4px;padding-right:4px;overflow:hidden;text-overflow:ellipsis}
html body main.la table.ng44 td.la-st:not(#z44), html body main.la table.ng44 td.la-cfh43:not(#z44){white-space:normal;font-size:12px;line-height:1.2}
html body main.la table.ng44 td:first-child a:first-child:not(#z44){white-space:normal}
html body main.la table.ng44 .la-b:not(#z44), html body main.la table.ng44 .la-st:not(#z44){left:auto!important}
/* Q321 */
html body .aq44:not(#z44){display:grid;grid-template-columns:max-content minmax(300px,1fr);gap:16px;align-items:start}
html body .aq44 > section:not(#z44){margin:0!important;min-width:0}
html body .aq44 > section:last-child .fgrid:not(#z44){grid-template-columns:1fr 1fr!important}
@media (max-width:1100px){html body .aq44:not(#z44){grid-template-columns:1fr}}
/* Q322 */
html body .dits42g.hc44 > .sw44:not(#z44){grid-column:1 / -1;justify-self:start;margin:0 0 8px}
html body .dits42g.hc44 > [hidden]:not(#z44){display:none!important}
html body .rpt thead th.rs44:not(#z44){vertical-align:bottom;border-bottom:1px solid var(--line)}
/* Q328 Export: narrower buildings list, more room on the right */
html body .exp-g:not(#z44){grid-template-columns:minmax(280px,420px) minmax(0,1fr)}
@media (max-width:900px){html body .exp-g:not(#z44){grid-template-columns:minmax(0,1fr)}}
/* Q332 range date picker */
html body .rgx44:not(#z44){display:none!important}
.dp42.rgb44 span{white-space:nowrap}
.rgp44{position:fixed;z-index:100000;background:#fff;color:#111827;border:1px solid var(--line);border-radius:8px;box-shadow:0 12px 32px rgba(15,23,42,.22);padding:14px;display:grid;gap:12px;width:min(640px,calc(100vw - 16px));font-size:14px}
.rgh44{display:flex;flex-wrap:wrap;gap:8px 18px;align-items:center;border-bottom:1px solid var(--line);padding-bottom:10px}
.rgh44 span{padding-bottom:3px;border-bottom:3px solid transparent;font-weight:600}
.rgh44 span.now{border-color:#1E40AF;color:#1E40AF}
.rgh44 i{margin-left:auto;font-style:normal;color:var(--muted);font-size:13px}
.rgms44{display:grid;grid-template-columns:1fr 1fr;gap:24px;position:relative}
.rgm44{display:flex;align-items:center;justify-content:center;font-weight:600;height:30px}
.rgn44{position:absolute;top:0;width:30px;height:30px;border:0;background:none;color:#1E40AF;font-size:20px;cursor:pointer;border-radius:6px;z-index:1}
.rgn44.p{left:0}.rgn44.n{right:0}.rgn44:disabled{opacity:.3;cursor:default}
.rgg44{display:grid;grid-template-columns:repeat(7,1fr);font-variant-numeric:tabular-nums}
.rgg44 b{text-align:center;color:var(--muted);font-size:12px;font-weight:500;padding:6px 0}
.rgd44{height:34px;border:0;background:none;color:inherit;font:inherit;cursor:pointer;position:relative}
.rgd44:hover:not(:disabled),.rgd44.in,.rgn44:hover:not(:disabled){background:rgba(30,64,175,.12)}
.rgd44:disabled{opacity:.35;cursor:default}
.rgd44.t::after{content:"";position:absolute;left:50%;bottom:4px;width:14px;height:2px;margin-left:-7px;background:#f59e0b}
.rgd44.s,.rgd44.e,.rgd44.s:hover,.rgd44.e:hover{background:#1E40AF!important;color:#fff;font-weight:600}
.rgd44.s{border-radius:6px 0 0 6px}.rgd44.e{border-radius:0 6px 6px 0}.rgd44.s.e{border-radius:6px}
.rgq44{display:flex;flex-wrap:wrap;gap:8px;border-top:1px solid var(--line);padding-top:10px}
.rgq44 span{flex:1}
@media (max-width:620px){.rgp44{left:8px!important;right:8px;top:auto!important;bottom:8px;width:auto}.rgms44{grid-template-columns:1fr}.rg2-44{display:none}}
/* Q334 one loader for the whole app: royal blue ring (approved picture loader-new-16oct.png) */
html body :is(.spn,.la-spin,.ld44-ring):not(#z44){border:0!important;border-radius:50%;background:conic-gradient(from 0deg,transparent 0 15%,#93B4FF 40%,#1E40AF 100%);
  -webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 2.5px),#000 calc(100% - 2px));mask:radial-gradient(farthest-side,transparent calc(100% - 2.5px),#000 calc(100% - 2px));animation:ld44 .9s linear infinite}
html body .spn.spn-xl:not(#z44),html body .ld44-ring:not(#z44){width:52px;height:52px;-webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 6px),#000 calc(100% - 5px));mask:radial-gradient(farthest-side,transparent calc(100% - 6px),#000 calc(100% - 5px))}
html body .la-spin:not(#z44){width:12px;height:12px}
@keyframes ld44{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){html body :is(.spn,.la-spin,.ld44-ring):not(#z44){animation-duration:2.4s}}
html body .ldg:not(#z44){display:flex;flex-direction:column;align-items:center;gap:12px;margin:24px auto;padding:22px 30px;width:max-content;max-width:100%;background:var(--surface,#fff);border-radius:12px;box-shadow:0 14px 40px rgba(15,23,42,.18);font-weight:600}
html body .ldg .spn:not(#z44){width:52px;height:52px;margin:0;-webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 6px),#000 calc(100% - 5px));mask:radial-gradient(farthest-side,transparent calc(100% - 6px),#000 calc(100% - 5px))}
.ld44{position:fixed;inset:0;z-index:99990;background:rgba(15,23,42,.30);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);display:grid;place-items:center}
.ld44 .ld44-box{background:#fff;color:#111827;border-radius:12px;padding:22px 30px;display:flex;flex-direction:column;align-items:center;gap:12px;box-shadow:0 14px 40px rgba(15,23,42,.25);min-width:200px;font-weight:600}
html[data-mode="dark"] .ld44 .ld44-box{background:var(--surface);color:var(--fg)}
.wid44{font-weight:600}
.wid44t{width:100%;font:inherit;line-height:1.5;white-space:pre-wrap}
.wid44t[readonly]{background:var(--surface2,#f5f7fb)}
/* Q336 cancelled apartment sensors on Live */
html body .apt33.can44:not(#z44){background:repeating-linear-gradient(135deg,#eef0f4 0 6px,#e1e5ec 6px 12px)!important;color:#6b7280!important;border-color:#cbd2dc!important}
html body .apt33.can44 .x:not(#z44){font-weight:700;color:#475569;text-transform:uppercase;font-size:10px;letter-spacing:.04em}
html body .lg33 i.can44{background:repeating-linear-gradient(135deg,#eef0f4 0 3px,#cbd2dc 3px 6px)}
html[data-mode="dark"] body .apt33.can44:not(#z44){background:repeating-linear-gradient(135deg,#1f2633 0 6px,#2a3344 6px 12px)!important;color:#9aa3b5!important}
html body .badge.nc44:not(#z44){background:#fde2e1!important;color:#b91c1c!important;border-color:#f5b5b2!important;font-weight:700}
html body .badge.nc44.nr44:not(#z44){background:#eef0f4!important;color:#475569!important;border-color:#d5dae3!important}
html[data-mode="dark"] body .badge.nc44:not(#z44){background:rgba(239,68,68,.18)!important;color:#fca5a5!important}
.cr44{display:flex;justify-content:flex-end;margin:0 0 8px}
.hd44{color:var(--muted);margin-top:2px;max-width:340px;line-height:1.35}.hd44 b{color:var(--fg);font-weight:600}

/* ===== proto_s45.css ===== */
/* Sam 17 Oct 11:42 GO: to-do items 61 to 76 (Q359 to Q381) */
/* 73 Q377: one dialog look: title left with x, short dialogs 440 px, forms 880 px with fields side by side */
html body .swal2-popup.swp.sm45:not(#z45){width:min(440px, calc(100vw - 24px))!important}
html body .swal2-popup.swp.sm45 .swal2-html-container:not(#z45){text-align:left}
html body .swal2-popup.swp .swal2-icon:not(#z45){display:none!important}
html body .swal2-popup.swp:not(#z45) .swal2-title{text-align:left}
html body .swal2-popup.swp.frm45:not(#z45){width:min(880px, calc(100vw - 24px))!important}
html body .swal2-popup.swp.frm45 #dlgB:not(#z45){display:grid;grid-template-columns:1fr 1fr;column-gap:20px;align-items:start}
html body .swal2-popup.swp.frm45 #dlgB > *:not(#z45){grid-column:1/-1}
html body .swal2-popup.swp.frm45 #dlgB > .fld:not(#z45){grid-column:auto}
@media (max-width:640px){html body .swal2-popup.swp.frm45 #dlgB:not(#z45){grid-template-columns:1fr}}
html body .swal2-popup .swal2-confirm.dng:not(#z45){background:var(--crit)!important;border-color:var(--crit)!important;color:#fff!important}
/* 67 Q371: mode button in the Live MODE cell, its menu and result */
html body #latbl button.la-mode.mcz:not(#z45){cursor:pointer;border:1px solid var(--line);background:var(--surface,#fff);border-radius:5px;padding:1px 4px;font:inherit;font-size:12px;font-weight:700;white-space:nowrap;color:inherit}
html body #latbl button.la-mode.mcz.byp:not(#z45){background:var(--warn-soft);color:var(--warn);border-color:var(--warn)}
html body #latbl button.la-mode.mcz:hover:not(#z45){border-color:#1E40AF;color:#1E40AF}
html body #latbl button.la-mode.mcz i:not(#z45){font-style:normal;font-size:10px;margin-left:3px;color:var(--muted)}
.mrz{display:block;font-size:11px;font-weight:700;white-space:nowrap;margin-top:2px}.mrz.ok{color:#059669}.mrz.bad{color:var(--crit)}
.ldz{display:inline-block;width:16px;height:16px;border-radius:50%;background:conic-gradient(from 0deg,transparent 0 15%,#93B4FF 40%,#1E40AF 100%);
  -webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 2.5px),#000 calc(100% - 2px));mask:radial-gradient(farthest-side,transparent calc(100% - 2.5px),#000 calc(100% - 2px));animation:spz .9s linear infinite;vertical-align:middle}
@keyframes spz{to{transform:rotate(360deg)}}
.mmz{position:fixed;z-index:1000;background:var(--surface,#fff);border:1px solid var(--line);border-radius:8px;box-shadow:0 10px 28px rgba(15,23,42,.2);padding:4px;min-width:160px}
.mmz button{display:flex;gap:8px;align-items:center;width:100%;border:0;background:none;color:inherit;font:inherit;padding:8px 10px;border-radius:6px;cursor:pointer;text-align:left}
.mmz button:hover:not(:disabled){background:rgba(30,64,175,.1)}.mmz button:disabled{opacity:.55;cursor:default}
.mmz svg{width:16px;height:16px;flex:none;display:block}.mmz .i-AUTO{color:#1E40AF}.mmz .i-BYP_ON{color:#059669}.mmz .i-BYP_OFF{color:var(--crit)}.mmz b{margin-left:auto;color:#059669}
/* 62 Q360 */
.clz{margin-left:auto}
/* 65 Q363 */
.cnz{display:flex;flex-wrap:wrap;gap:6px 16px;align-items:center;margin:12px 0 0;padding:10px 12px;border:1px solid var(--line);border-radius:8px;font-size:13px}
.cnz .lbl{margin:0}
/* 66/68 Q369 */
.bcz-top{display:flex;flex-wrap:wrap;gap:8px 14px;align-items:center;margin-bottom:10px}
.bcz-w{max-height:calc(100vh - 260px)}
/* 71 Q374: dots by the standard limits, value tinted */
.dot.dz-cold{background:#2563eb}
html body .card.dev.tz-crit:not(#z45){background:#fdecec}html body .card.dev.tz-crit .val:not(#z45){color:var(--crit)}
html body .card.dev.tz-warn:not(#z45){background:#fff4e0}html body .card.dev.tz-warn .val:not(#z45){color:#b45309}
html body .card.dev.tz-cold:not(#z45){background:#e8efff}html body .card.dev.tz-cold .val:not(#z45){color:#1d4ed8}
html[data-mode="dark"] body .card.dev.tz-crit:not(#z45){background:rgba(185,28,28,.18)}html[data-mode="dark"] body .card.dev.tz-warn:not(#z45){background:rgba(180,83,9,.18)}html[data-mode="dark"] body .card.dev.tz-cold:not(#z45){background:rgba(37,99,235,.18)}
/* 72 Q375 */
html body .aic-r .aic-u:not(#z45){max-width:none;white-space:nowrap}
.moz{border:0;background:none;color:#1E40AF;font:inherit;font-weight:700;cursor:pointer;padding:0 0 0 2px;text-decoration:underline}
.clz2{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.moz-l{display:flex;flex-wrap:wrap;gap:6px}.moz-l span{border:1px solid var(--line);border-radius:6px;padding:3px 8px;font-variant-numeric:tabular-nums}
/* 75 Q379 */
.pz-l{display:grid;gap:10px;margin-top:10px}.pz-r{border-top:1px solid var(--line);padding-top:8px}.pz-t{margin-bottom:2px}
/* 76 Q381: TIME-LINE time bar fluorescent green, like the LIVE button */
html body .ax97.tl42:not(#z45){background:#39ff14!important}
html body .ax97.tl42 .tk97:not(#z45){color:#06290a!important}
html body .ax97.tl42 .tk97.nw:not(#z45){color:#06290a!important;text-decoration:underline}
html[data-mode="dark"] body .ax97.tl42:not(#z45){background:#39ff14!important}
/* 77 Q386: failed live read, status in red */
html body .lvp-rt.blz:not(#z45){background:#dc2626!important;color:#fff!important;font-weight:700;border-radius:5px;padding:2px 8px}
html body .rt-wait.blz b:not(#z45){color:var(--crit)!important;font-weight:700}
html body .rt-wait.blz:not(#z45){border:1px solid var(--crit);border-radius:8px;padding:8px 10px;background:var(--crit-soft,#fdecec)}
html body .rt-c.wlz b:not(#z45){color:#b45309!important}

/* Q240 (Sam 15 Oct 13:45 "ChangeOff, On, Clear etc to be in the propercase"): pills show their words as written, in Proper Case,
   not forced to capitals (the old shared .pill rule in app.css). The first letter is a capital for any pill text that starts lower case. */
.pill:not(#z240){text-transform:none;letter-spacing:.02em}
.pill:not(#z240)::first-letter{text-transform:uppercase}

/* Q349 Analysis > Charts: the Metrics > Reports trend chart, legend on the right, night shaded */
.an349b{display:flex;gap:12px;align-items:flex-start}
.an349b .tr33-wrap{flex:1;min-width:0}
.an349l{display:flex;flex-direction:column;gap:6px;min-width:170px}
.an349l .tr33-c b{margin-left:auto;padding-left:8px}
.an349a{display:flex;gap:6px}
.an349n{fill:color-mix(in srgb,var(--muted) 10%,transparent)}
.an349 .ch-shade{fill:color-mix(in srgb,var(--crit) 10%,transparent)}
@media (max-width:760px){.an349b{flex-direction:column}.an349l{flex-direction:row;flex-wrap:wrap;min-width:0}}

/* Q299 (Sam 16 Oct 08:44): missing customer tables, bold red on the Customers screen */
.ct299m{margin-top:10px;padding:10px 12px;border:1px solid var(--crit);border-radius:8px;color:var(--crit);background:color-mix(in srgb,var(--crit) 8%,transparent)}
.ct299n{color:inherit;text-decoration:none}.ct299n:hover b{text-decoration:underline}
/* phone width: the blue Live bar stays inside the 16px page gutter (no sideways scroll at 390 px) */
@media (max-width:640px){html body main.la .la-h.la42:not(#z42){padding-right:16px;flex-wrap:wrap}}

/* ===== 19 Oct build (weba) ===== */
/* standing rule (Sam): no mono font anywhere; numbers keep their even width */
:root{--mono:var(--sans)}
/* Q443 / Q417 loader option "F with a label" (downloads/loader-examples/favicon-loader-test.html, card "F with a label"): the Anagha mark with
   two thin rings turning opposite ways, a line under it saying what is loading, its dots fading in turn. Full screen on plain white; in a box scaled down. */
.ldf{display:flex;flex-direction:column;align-items:center;gap:10px;--ldf:84px}
.ldf.ldf-xl{--ldf:150px;gap:34px}
.ldf-e{position:relative;width:var(--ldf);height:var(--ldf);display:flex;align-items:center;justify-content:center}
.ldf-rings{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.ldf-rings circle{fill:none;transform-origin:100px 100px}
.ldf-rings .r1{stroke:#3d5a8a;stroke-width:1.3;stroke-dasharray:420 183;animation:ldfspin 2.4s linear infinite}
.ldf-rings .r2{stroke:#8aa0c4;stroke-width:.8;stroke-dasharray:330 236;animation:ldfspin 3.2s linear infinite reverse}
.ldf-in{animation:ldfbr 2.4s ease-in-out infinite;line-height:0}
.ldf-mk{width:calc(var(--ldf) * .47);height:calc(var(--ldf) * .47);display:block}
.ldf-lbl{font-size:13px;font-weight:500;color:#3d5a8a;letter-spacing:.02em;text-align:center}
.ldf.ldf-xl .ldf-lbl{font-size:18px}
.ldf-dots i{font-style:normal;animation:ldfdot 1.2s infinite;opacity:.2}
.ldf-dots i:nth-child(2){animation-delay:.2s}.ldf-dots i:nth-child(3){animation-delay:.4s}
@keyframes ldfspin{to{transform:rotate(360deg)}}
@keyframes ldfbr{0%,100%{opacity:.75}50%{opacity:1}}
@keyframes ldfdot{0%,80%,100%{opacity:.2}40%{opacity:1}}
@media (prefers-reduced-motion:reduce){.ldf-rings circle,.ldf-in,.ldf-dots i{animation-duration:4s!important}}
html body .ld44.ldf44:not(#z44){position:fixed;inset:0;z-index:99990;background:#fff;backdrop-filter:none;-webkit-backdrop-filter:none;display:flex;align-items:center;justify-content:center}
html[data-mode="dark"] body .ld44.ldf44:not(#z44){background:var(--bg)}
html[data-mode="dark"] .ldf-lbl{color:#9db4da}
.ldf-box{display:flex;align-items:center;justify-content:center;padding:28px 12px;min-height:150px;width:100%}
.ldf-box.ldf-over{position:absolute;inset:0;min-height:0;padding:8px;background:rgba(255,255,255,.86);z-index:5}
html[data-mode="dark"] .ldf-box.ldf-over{background:rgba(12,19,26,.86)}
.swal2-popup .ldf-box{min-height:120px}
/* Q421 / Q442 / Q488 / Q489 alerts Tree layout (js/app/alerttree.js), Open alerts + Live pop-up > All alerts */
.at21-top{display:flex;flex-wrap:wrap;gap:8px 12px;align-items:center;margin:0 0 10px}
.at21-top .sp{flex:1}
.at21-top .q98r{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.at21-srow{display:flex;flex-wrap:wrap;gap:8px 12px;align-items:center;justify-content:flex-start;margin:0 0 10px}
html body .at21-q:not(#z44){width:240px;max-width:100%;border-radius:999px;padding:6px 14px}
.at21-empty{width:100%}
.at21-nomatch{text-align:center;color:var(--muted)}
.at21-sec{margin-bottom:14px}
.at21-sec>header{display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px}
.at21-sv{white-space:nowrap}
.at21-list{display:flex;flex-direction:column;padding:4px 0 2px}
.at21-ti{--sevc:var(--info);position:relative;margin-left:86px;padding-left:26px;border-left:3px solid var(--sevc)}
.at21-ti.sv-crit{--sevc:var(--crit)}.at21-ti.sv-warn{--sevc:var(--warn)}.at21-ti.sv-info{--sevc:var(--info)}
.at21-r,.at21-gh{position:relative;display:grid;grid-template-columns:18px minmax(0,1fr) auto;gap:3px 10px;align-items:center;padding:9px 4px;border-bottom:1px solid var(--line2)}
.at21-gh{grid-template-columns:18px 14px auto minmax(0,1fr);cursor:pointer;border-bottom-color:var(--line)}
.at21-gh:focus-visible{outline:2px solid var(--info);outline-offset:-2px}
.at21-nd{position:absolute;left:-118px;top:20px;transform:translateY(-50%);width:80px;text-align:right;font-size:13px;font-weight:600;color:var(--fg);white-space:nowrap;font-variant-numeric:tabular-nums}
.at21-kid .at21-nd{left:-153px}
.at21-sg::before,.at21-gh::before{content:"";position:absolute;left:-35px;top:20px;transform:translateY(-50%);width:14px;height:14px;border-radius:50%;border:2px solid var(--sevc);background:var(--surface);box-sizing:border-box}
.at21-kids{position:relative;margin-left:10px;padding-left:24px;border-left:1px dashed var(--line)}
.at21-kid::before{content:"";position:absolute;left:-24px;top:20px;width:18px;border-top:1px dashed var(--line)}
.at21-kid::after{content:"";position:absolute;left:-30px;top:20px;transform:translateY(-50%);width:10px;height:10px;border-radius:50%;background:var(--sevc)}
.at21-folded .at21-kids{display:none}
.at21-chev{display:inline-block;color:var(--muted);transition:transform .15s}
.at21-folded .at21-chev{transform:rotate(-90deg)}
.at21-nm{font-size:15px;font-weight:600;color:var(--an33)}
.at21-gc{grid-column:auto}
.at21-nochk{display:inline-block;width:16px}
.at21-ttl{min-width:0;font-size:14.5px}
.at21-an{color:var(--an33);font-weight:600}
.at21-bn{color:var(--bn33);font-weight:600}
.at21-v{color:var(--av33);font-weight:700;margin-left:4px}
.at21-st{white-space:nowrap;margin-left:4px}
.at21-flap{color:var(--warn)}
.at21-acts{grid-column:3;grid-row:1/3;align-self:center;margin-left:28px;display:flex;gap:6px;white-space:nowrap}
.at21-meta{grid-column:2;display:flex;align-items:center;gap:10px;min-width:0;font-size:13px}
.at21-t{font-size:12.5px;font-weight:700;color:#7a8794;background:var(--line2);padding:0 3px;white-space:nowrap;font-variant-numeric:tabular-nums}
.at21-dur{flex:1;position:relative;height:3px;min-width:40px;background:var(--line2);border-radius:2px;overflow:hidden}
.at21-dur i{position:absolute;top:0;bottom:0;border-radius:2px;background:color-mix(in srgb,var(--sevc) 42%,var(--surface))}
.at21-so{font-weight:600;white-space:nowrap;font-variant-numeric:tabular-nums}
.at21-pop .at21-ttl .tv28{margin-left:0}
@media (max-width:640px){.at21-ti{margin-left:6px;padding-left:16px}.at21-nd{position:static;transform:none;width:auto;text-align:left;grid-column:1/-1}
  .at21-sg::before,.at21-gh::before,.at21-kid::after,.at21-kid::before{display:none}.at21-r{grid-template-columns:18px minmax(0,1fr)}.at21-acts{grid-column:1/-1;grid-row:auto;margin-left:0}.at21-meta{grid-column:1/-1}}
@media (prefers-reduced-motion:reduce){.at21-chev{transition:none}}

/* Q440 CHANGED (Sam 19 Oct): one row per alert per building, its latest record; dot left of the time = red open / dark green closed */
.aic-tm{display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.d440{display:inline-block;width:8px;height:8px;border-radius:50%;flex:0 0 8px}
.d440.op{background:#d92d20}
.d440.cl{background:#146c43}
.ch-v413{fill:var(--fg);font-weight:600;font-size:11px}
/* Q474 FINAL + Q469 (Sam 19 Oct 08:48-09:06 UTC): the Alert details pop-up in the alert email's layout; Q474 font sizes (09:47): body + tables
   14 px, title 18, section headings 16, meta 13 */
.ad74{font-size:14px;line-height:1.45;color:var(--fg);text-align:left}
.ad74-t1{font-size:18px;font-weight:700;margin:0 0 4px}
.ad74-sv.sv-c{color:var(--crit)} .ad74-sv.sv-w{color:var(--warn)} .ad74-sv.sv-i{color:var(--info)}
.ad74-tm{font-weight:400;color:var(--muted)}
.ad74-meta{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px;font-size:13px;color:var(--muted);margin:0 0 8px}
.ad74-tr{padding:5px 0;border-bottom:1px solid var(--line2)}
.ad74-bad{color:var(--crit)}
.ad74-ok{color:#1a7f37;font-weight:700}
html[data-mode="dark"] .ad74-ok{color:#4ade80}
.ad74-mu{color:var(--muted);font-weight:400}
.ad74-s{margin:20px 0 0}
.ad74-h{font-size:16px;font-weight:700;color:var(--pri,#1E40AF);margin:0 0 6px;padding-bottom:3px;border-bottom:2px solid color-mix(in srgb,var(--pri,#1E40AF) 14%,transparent);letter-spacing:0;text-transform:none}
html[data-mode="dark"] .ad74-h{color:var(--fg)}
.ad74-h5{font-size:14px;font-weight:700;margin:12px 0 4px}
.ad74-p{margin:0 0 6px}
.ad74-pre{white-space:pre-wrap}
.ad74-ol{margin:0 0 0 20px;padding:0}
.ad74-sc{overflow-x:auto;max-width:100%}
.ad74-t{border-collapse:collapse;font-size:14px;margin:4px 0}
.ad74-t th,.ad74-t td{padding:5px 8px;border:1px solid var(--line);text-align:left;white-space:nowrap;vertical-align:top}
.ad74-t thead th{background:var(--surface2);color:var(--pri,#1E40AF);font-weight:700}
html[data-mode="dark"] .ad74-t thead th{color:var(--fg)}
.ad74-t .n{text-align:center}
.ad74-st th,.ad74-st td{text-align:center}
.ad74-st tbody th{font-weight:700}
.ad74-st thead .ad74-tm{color:var(--muted)}
.ad74-u th{color:var(--muted)}
.apt74 span{display:block;font-size:12px;color:var(--muted);font-weight:400}
.apt74.b-cold{color:var(--cold33);background:color-mix(in srgb,var(--cold33) 12%,var(--surface));font-weight:700}
.apt74.b-cool{background:color-mix(in srgb,var(--cool33) 14%,var(--surface))}
.apt74.b-warm{background:color-mix(in srgb,var(--warm33) 14%,var(--surface))}
.apt74.b-hot{color:var(--hot33);background:color-mix(in srgb,var(--hot33) 12%,var(--surface));font-weight:700}
.ad74-who{width:100%} .ad74-who .ad74-wr,.ad74-ca td{white-space:normal}
.ad74-ca{width:100%} .ad74-ca td:nth-child(1),.ad74-ca td:nth-child(2){width:30%}
.ad74-lk{font-weight:700}
.ad74-why{background:color-mix(in srgb,var(--pri,#1E40AF) 6%,var(--surface));border-left:4px solid var(--pri,#1E40AF);padding:10px 12px;line-height:1.6}
.ad74-full{margin:8px 0 0} .ad74-full summary{cursor:pointer;color:var(--muted);font-size:13px}
.ad74-acts{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0 0 12px}
.ad74-acts .n1-note{flex:1;min-width:240px;display:flex;gap:8px}
.ad74-acts .n1-note .in{flex:1}
.ad74-m{background:var(--surface2);border:1px solid var(--line2);border-radius:8px;padding:8px 12px;margin:0 0 12px;min-height:60px;text-align:left}
.sb446{margin:8px 12px 12px;position:static;box-shadow:none}
/* Q418 (Sam 18 Oct 15:41): TIME-LINE Buildings picker: normal dark text on the white panel (it took the header bar's white text, ui326a
   s44 rules); All / Clear all keep the normal button look; the stray Close in the list is gone (the screen has its own Close) */
html body main.dy97 .dyh97 .pkm97:not(#z45), html body main.dy97 .dyh97 .pkm97 label:not(#z45), html body main.dy97 .dyh97 .pkm97 .pki97:not(#z45){color:var(--fg)!important;font-weight:400;text-transform:none;letter-spacing:0;text-align:left}
html body main.dy97 .dyh97 .pkm97 .small:not(#z45){color:var(--muted)!important}
html body main.dy97 .dyh97 .pkm97 .pkh97 .btn:not(.pri):not(.on):not([aria-pressed="true"]):not(#z45){background:var(--surface)!important;color:var(--blue42)!important;border-color:var(--blue42)!important}
/* Q450 Cron jobs */
.cj450 td{vertical-align:top}
.cj450o{margin:0;padding-left:18px}.cj450o li{margin:0 0 4px}
.cj450s{display:inline-flex;align-items:center;gap:4px;margin:2px 6px 0 0;font-size:12px;color:var(--muted)}

/* Q459 (Sam 18 Oct 19:23): summary lines - words dark normal text, values bold in the alert's colour */
html body .inc .sm459:not(#z45){color:var(--fg);font-weight:400}
html body .inc .v459:not(#z45){font-weight:700;color:var(--fg)}
html body .inc.crit .v459:not(#z45){color:var(--crit)}
html body .inc.warn .v459:not(#z45){color:var(--warn)}

/* v329 (Sam 19 Oct): Settings Auto DIT adjustments: + green, - red (js/app/settings.js adj29) */
html body .in.adjp29:not(#z44){color:var(--acc);font-weight:700}
html body .in.adjn29:not(#z44){color:var(--crit);font-weight:700}