:root{--bg:#f4f3ef;--panel:#fbfaf7;--ink:#1a1d21;--ink-2:#4a5058;--ink-3:#868c94;--line:#dedcd5;--line-2:#ebe9e3;--accent:#0e6b6b;--accent-ink:#fff;--accent-soft:#e2efed;--ok:#2d7a4b;--warn:#a8670f;--bad:#b3261e;--ok-soft:#e4f1e8;--warn-soft:#f6ecd9;--bad-soft:#f6e1df;--radius:6px;--sans:"IBM Plex Sans", system-ui, -apple-system, "Segoe UI", sans-serif;--mono:"IBM Plex Mono", ui-monospace, "SFMono-Regular", Menlo, monospace}@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--bg:#111416;--panel:#171b1e;--ink:#e8e6e1;--ink-2:#b4b8bd;--ink-3:#7b8188;--line:#2a3035;--line-2:#22272b;--accent:#4fb3ad;--accent-ink:#0b1414;--accent-soft:#19302f;--ok:#5fbf84;--warn:#e0a24a;--bad:#ef6b62;--ok-soft:#18291f;--warn-soft:#2e2416;--bad-soft:#321b19}}:root[data-theme=dark]{--bg:#111416;--panel:#171b1e;--ink:#e8e6e1;--ink-2:#b4b8bd;--ink-3:#7b8188;--line:#2a3035;--line-2:#22272b;--accent:#4fb3ad;--accent-ink:#0b1414;--accent-soft:#19302f;--ok:#5fbf84;--warn:#e0a24a;--bad:#ef6b62;--ok-soft:#18291f;--warn-soft:#2e2416;--bad-soft:#321b19}*{box-sizing:border-box}html,body{margin:0}body{background:var(--bg);color:var(--ink);font:14px/1.45 var(--sans);-webkit-font-smoothing:antialiased}button,input,select{font:inherit;color:inherit}.num{font-family:var(--mono);font-variant-numeric:tabular-nums}.muted{color:var(--ink-3)}.sr-only{clip:rect(0 0 0 0);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.topbar{border-bottom:1px solid var(--line);background:var(--panel);z-index:10;align-items:center;gap:24px;height:56px;padding:0 24px;display:flex;position:sticky;top:0}.brand{letter-spacing:-.01em;align-items:baseline;gap:10px;font-size:16px;font-weight:600;display:flex}.brand small{color:var(--ink-3);letter-spacing:.04em;text-transform:uppercase;font-size:12px;font-weight:400}.conn{color:var(--ink-2);flex:1;gap:18px;font-size:13px;display:flex}.conn span{white-space:nowrap;align-items:center;gap:7px;display:inline-flex}.dot{background:var(--ink-3);border-radius:50%;flex:none;width:7px;height:7px}.dot.on{background:var(--ink-3)}.dot.off{background:var(--bad)}.topbar .right{align-items:center;gap:14px;margin-left:auto;display:flex}.theme-toggle{border:1px solid var(--line);border-radius:4px;display:inline-flex;overflow:hidden}.theme-toggle button{border:0;border-right:1px solid var(--line);height:26px;color:var(--ink-3);cursor:pointer;background:0 0;padding:0 9px;font-size:12px}.theme-toggle button:last-child{border-right:0}.theme-toggle button:hover{color:var(--ink);background:var(--line-2)}.theme-toggle button[aria-pressed=true]{color:var(--accent);background:var(--accent-soft)}.tag{font:500 11px/1 var(--mono);letter-spacing:.06em;text-transform:uppercase;border:1px solid var(--line);color:var(--ink-2);border-radius:4px;padding:5px 7px}.tag.accent{border-color:var(--accent);color:var(--accent)}.tag.bad{border-color:var(--bad);color:var(--bad)}.linkbtn{color:var(--ink-2);cursor:pointer;background:0 0;border:0;padding:0;font-size:13px}.linkbtn:hover{color:var(--ink);text-underline-offset:3px;text-decoration:underline}.wrap{gap:16px;max-width:1280px;margin:0 auto;padding:20px 24px 48px;display:grid}.panel{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius)}.panel>header{border-bottom:1px solid var(--line-2);justify-content:space-between;align-items:center;gap:12px;padding:12px 16px;display:flex}h2{letter-spacing:.06em;text-transform:uppercase;color:var(--ink-2);margin:0;font-size:12px;font-weight:600}.body{padding:16px}.overview{grid-template-columns:300px 1fr;gap:16px;display:grid}.split{grid-template-columns:1.4fr 1fr;gap:16px;display:grid}.score .body{gap:14px;display:grid}.score-row{align-items:baseline;gap:12px;display:flex}.score-value{font:500 64px/.9 var(--mono);letter-spacing:-.04em}.score-word{font-size:15px;font-weight:600}.score.ok .score-word{color:var(--ink-2)}.score.warn .score-word{color:var(--warn)}.score.bad .score-word{color:var(--bad)}.meter{background:var(--line-2);border-radius:2px;height:8px;position:relative;overflow:hidden}.meter i{background:var(--ink-2);width:0;transition:width .4s;position:absolute;inset:0 auto 0 0}.score.ok .meter i{background:var(--ink-3)}.score.warn .meter i{background:var(--warn)}.score.bad .meter i{background:var(--bad)}.meter b{background:var(--ink);width:1px;position:absolute;top:-3px;bottom:-3px;left:60%}.meter-scale{height:14px;font:11px var(--mono);color:var(--ink-3);margin-top:-8px;position:relative}.meter-scale span{position:absolute;top:0}.meter-scale span[style*="60%"]{transform:translate(-50%)}.kv{grid-template-columns:auto 1fr;gap:6px 14px;margin:0;font-size:13px;display:grid}.kv dt{color:var(--ink-3)}.kv dd{text-align:right;margin:0}.readings{grid-template-columns:repeat(5,1fr);display:grid}.reading{border-right:1px solid var(--line-2);align-content:start;gap:4px;min-width:0;padding:16px;display:grid}.reading:last-child{border-right:0}.reading .label{color:var(--ink-2);font-size:12px}.reading .value{align-items:baseline;gap:5px;margin-top:4px;display:flex}.reading .value .num{letter-spacing:-.03em;font-size:30px;font-weight:500}.reading .unit{color:var(--ink-3);font-size:13px}.reading .sub{font:12px var(--mono);color:var(--ink-3)}.reading canvas{width:100%;height:30px;margin-top:6px;display:block}.reading.warn .value .num{color:var(--warn)}.reading.bad .value .num{color:var(--bad)}.range{margin-top:10px}.range-track{height:10px;position:relative}.range-track:before{content:"";background:var(--line);height:2px;position:absolute;top:4px;left:0;right:0}.range-band{background:var(--ink-3);opacity:.35;border-radius:1px;height:6px;position:absolute;top:2px}.range-marker{background:var(--ink);border-radius:1px;width:3px;height:10px;margin-left:-1px;position:absolute;top:0}.range.warn .range-marker{background:var(--warn)}.range.bad .range-marker{background:var(--bad)}.range-scale{font:10px var(--mono);color:var(--ink-3);justify-content:space-between;margin-top:3px;display:flex}.reading.model .value .word{letter-spacing:-.01em;text-transform:capitalize;font-size:22px;font-weight:600}.reading.model.clear .word{color:var(--ok)}.reading.model.slightly_turbid .word{color:var(--warn)}.reading.model.dirty .word{color:var(--bad)}.actuators{border:1px solid var(--line-2);border-radius:4px;grid-template-columns:repeat(4,1fr);display:grid}.actuator{border-right:1px solid var(--line-2);gap:3px;padding:10px 12px;display:grid}.actuator:last-child{border-right:0}.actuator span{color:var(--ink-3);font-size:12px}.actuator strong{font:500 13px var(--mono);letter-spacing:.04em;text-transform:uppercase;align-items:center;gap:7px;display:flex}.actuator.on strong{color:var(--accent)}.actuator.on .dot{background:var(--accent)}.actuator.fault strong{color:var(--bad)}.actuator.waiting strong{color:var(--warn)}.actuator.waiting .dot{background:var(--warn)}.offline-note{background:var(--warn-soft);color:var(--warn);border-radius:4px;margin-top:14px;padding:10px 12px;font-size:13px}.panel-error{color:var(--bad);background:var(--bad-soft);border-radius:4px;margin:0;padding:10px 16px;font-size:13px}.small{font-size:12px}.control-group{gap:8px;margin-top:18px;display:grid}.control-group>.title{color:var(--ink-2);font-size:12px}.row{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.btn{cursor:pointer;border:1px solid var(--line);background:var(--panel);height:34px;color:var(--ink);border-radius:4px;padding:0 14px;font-size:13px;font-weight:500;transition:background .12s,border-color .12s}.btn:hover{border-color:var(--ink-3)}.btn:active{transform:translateY(1px)}.btn:disabled{opacity:.5;cursor:not-allowed}.btn.primary{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}.btn.primary:hover{filter:brightness(1.08)}.btn.danger{color:var(--bad);border-color:var(--bad)}.btn.danger:hover{background:var(--bad-soft)}.btn.quiet{color:var(--ink-2);border-color:#0000;padding:0 10px}.btn.quiet:hover{background:var(--line-2)}.btn.active{border-color:var(--accent);color:var(--accent);background:var(--accent-soft)}.btn.is-pending,.segmented button.is-pending{border-color:var(--accent);color:var(--accent);background:var(--accent-soft);animation:1.2s ease-in-out infinite pulse}.btn:disabled.is-pending,.segmented button:disabled.is-pending{opacity:1;cursor:progress}.segmented button:disabled{cursor:not-allowed;opacity:.55}.segmented button:disabled:hover{color:var(--ink-2);background:0 0}.switch.is-pending{opacity:.6;cursor:progress}.switch input:disabled+i{cursor:not-allowed}@keyframes pulse{50%{opacity:.55}}@media (prefers-reduced-motion:reduce){.btn.is-pending,.segmented button.is-pending{animation:none}}.segmented{border:1px solid var(--line);border-radius:4px;display:inline-flex;overflow:hidden}.segmented button,.segmented label{border:0;border-right:1px solid var(--line);cursor:pointer;height:32px;color:var(--ink-2);background:0 0;align-items:center;padding:0 12px;font-size:13px;display:inline-flex}.segmented>:last-child{border-right:0}.segmented button:hover,.segmented label:hover{background:var(--line-2);color:var(--ink)}.segmented .active,.segmented button.active:hover,.segmented input:checked+span{background:var(--accent-soft);color:var(--accent)}.segmented input{opacity:0;pointer-events:none;position:absolute}.segmented label{padding:0}.segmented label span{align-items:center;height:100%;padding:0 12px;display:inline-flex}.switch{cursor:pointer;-webkit-user-select:none;user-select:none;align-items:center;gap:10px;font-size:13px;display:inline-flex}.switch input{opacity:0;position:absolute}.switch i{background:var(--line);border-radius:9px;flex:none;width:32px;height:18px;transition:background .15s;position:relative}.switch i:after{content:"";background:var(--panel);border-radius:50%;width:14px;height:14px;transition:transform .15s;position:absolute;top:2px;left:2px}.switch input:checked+i{background:var(--accent)}.switch input:checked+i:after{transform:translate(14px)}.switch input:focus-visible+i{outline:2px solid var(--accent);outline-offset:2px}.feedback{min-height:20px;color:var(--ink-2);margin-top:14px;font-size:13px}.feedback.error{color:var(--bad)}.feedback.ok{color:var(--ok)}.fault-banner{background:var(--bad-soft);color:var(--bad);border-radius:4px;margin-top:14px;padding:10px 12px;font-size:13px;display:none}.fault-banner.show{display:block}.dataset .count{align-items:baseline;gap:8px;display:flex}.dataset .count .num{letter-spacing:-.03em;font-size:34px;font-weight:500}.progress{background:var(--line-2);border-radius:2px;height:4px;margin:10px 0 6px;overflow:hidden}.progress i{background:var(--accent);width:0;height:100%;transition:width .4s;display:block}.downloads{flex-wrap:wrap;gap:16px;margin-top:14px;font-size:13px;display:flex}.downloads a{color:var(--accent);border-bottom:1px solid;padding-bottom:1px;text-decoration:none}.help{color:var(--ink-3);max-width:46ch;margin:8px 0 0;font-size:12px}.charts{grid-template-columns:1fr 1fr;display:grid}.chart{border-right:1px solid var(--line-2);border-bottom:1px solid var(--line-2);min-width:0;padding:14px 16px 10px}.chart:nth-child(2n){border-right:0}.chart:nth-last-child(-n+2){border-bottom:0}.chart h3{color:var(--ink-2);align-items:center;gap:14px;margin:0 0 8px;font-size:13px;font-weight:500;display:flex}.chart h3 .key{color:var(--ink-3);align-items:center;gap:6px;font-size:12px;font-weight:400;display:inline-flex}.chart h3 .key i{width:12px;height:2px;display:inline-block}.chart .box{height:210px;position:relative}.log{max-height:320px;overflow:auto}.log table{border-collapse:collapse;width:100%;font-size:13px}.log td{border-bottom:1px solid var(--line-2);vertical-align:top;padding:7px 16px}.log tr:last-child td{border-bottom:0}.log td.time{font-family:var(--mono);color:var(--ink-3);white-space:nowrap;width:1%}.log td.type{white-space:nowrap;width:1%}.log td.type span{font:500 11px var(--mono);text-transform:uppercase;letter-spacing:.05em;color:var(--ink-2)}.log td.type .t-rule,.log td.type .t-state{color:var(--accent)}.log td.type .t-alert{color:var(--bad)}.log .empty{color:var(--ink-3);padding:20px 16px}.login-page{place-items:center;min-height:100vh;padding:24px;display:grid}.login{width:100%;max-width:360px}.login .brand{margin-bottom:28px}.login form{gap:16px;padding:24px;display:grid}.field{gap:6px;display:grid}.field label{color:var(--ink-2);font-size:13px;font-weight:500}.field input{border:1px solid var(--line);background:var(--bg);border-radius:4px;height:40px;padding:0 12px}.field input:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft);outline:none}.login .btn{width:100%;height:40px;margin-top:4px}.login .error{background:var(--bad-soft);color:var(--bad);border-radius:4px;padding:10px 12px;font-size:13px;display:none}.login .error.show{display:block}.login footer{color:var(--ink-3);text-align:center;margin-top:16px;font-size:12px}@media (max-width:1100px){.overview{grid-template-columns:1fr}.readings{grid-template-columns:repeat(3,1fr)}.reading:nth-child(3){border-right:0}.reading:nth-child(-n+3){border-bottom:1px solid var(--line-2)}}@media (max-width:860px){.split,.charts{grid-template-columns:1fr}.chart{border-right:0}.chart:nth-last-child(2){border-bottom:1px solid var(--line-2)}.conn .hide-sm{display:none}}@media (max-width:620px){.panel>header{flex-wrap:wrap}#labels{grid-template-columns:1fr 1fr;width:100%;display:grid}#labels label{border-right:1px solid var(--line);border-bottom:1px solid var(--line)}#labels label span{justify-content:center;width:100%}#labels label:nth-child(2n){border-right:0}#labels label:nth-last-child(-n+2){border-bottom:0}#range{grid-template-columns:repeat(6,1fr);width:100%;display:grid}#range button{justify-content:center;padding:0}.topbar{gap:14px;padding:0 16px}.conn{display:none}.wrap{padding:16px}.readings{grid-template-columns:1fr 1fr}.reading{border-right:1px solid var(--line-2)!important;border-bottom:1px solid var(--line-2)!important}.reading:nth-child(2n){border-right:0!important}.actuators{grid-template-columns:1fr 1fr}.actuator:nth-child(2){border-right:0}.actuator:nth-child(-n+2){border-bottom:1px solid var(--line-2)}}
