:root{color-scheme:light;--green:#173f35;--green-2:#276451;--ink:#172b23;--muted:#5e7067;--bg:#eff2ec;--line:#d9e0d8;--gold:#c4a865;--white:#fcfdf9;font-family:"Segoe UI",system-ui,sans-serif}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink)}[hidden]{display:none!important}button,input,select{font:inherit}button,select{cursor:pointer}button:disabled{cursor:default;opacity:.55}button:focus-visible,select:focus-visible,input:focus-visible{outline:3px solid #b58c35;outline-offset:2px}button{border:1px solid var(--line);border-radius:8px;background:white;color:var(--green);padding:.7rem 1rem;font-weight:650}.primary{background:var(--green);border-color:var(--green);color:white}.primary:hover:enabled{background:var(--green-2)}h1,h2,h3,p{margin:0}h1{font-weight:650;font-size:clamp(1.8rem,3.3vw,3.15rem);letter-spacing:-.045em;line-height:1.05}h2{font-size:1.22rem;letter-spacing:-.02em}h3{font-size:.86rem;color:var(--muted);margin:0 0 12px}.eyebrow{font-size:.71rem;text-transform:uppercase;letter-spacing:.13em;font-weight:750;color:var(--muted)}.muted,.panel-head p,.chart-footer{color:var(--muted);font-size:.86rem}.login{min-height:100vh;display:grid;grid-template-columns:1fr 1fr;align-items:center}.login-brand{min-height:100vh;display:grid;place-items:center;background:radial-gradient(ellipse at 25% 20%,#f9f5e4,#d6e2d7 72%);border-right:1px solid var(--line)}.login-brand img{width:min(68%,310px)}.login form{width:min(390px,85%);margin:auto;display:grid;gap:16px}.login form .muted{margin:0 0 12px}.login form button{margin-top:6px}label{display:grid;gap:7px;font-size:.85rem;font-weight:650}input,select{background:white;color:var(--ink);border:1px solid #b9c8bd;border-radius:7px;padding:.65rem .75rem;min-width:0}#login-error{min-height:1.2rem;color:#8e2b25;font-size:.86rem}
#app{min-height:100vh;display:grid;grid-template-columns:224px minmax(0,1fr)}.sidebar{background:#f9faf5;border-right:1px solid var(--line);padding:27px 15px 17px;display:flex;flex-direction:column;gap:31px;position:sticky;top:0;height:100vh}.sidebar img{width:148px;margin:0 auto}.sidebar nav{display:grid;gap:6px}.sidebar nav button{background:transparent;text-align:left;border-color:transparent;font-size:.85rem}.sidebar nav [aria-current]{background:var(--green);color:white}.sidebar-foot{margin-top:auto;display:flex;align-items:center;justify-content:space-between;padding:0 3px;font-size:.73rem;letter-spacing:.12em;color:var(--green);font-weight:800}.sidebar-foot button{font-size:.78rem}
main{width:100%;max-width:1680px;margin:auto;padding:32px clamp(16px,3vw,46px) 44px}.top{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:23px}.top .eyebrow{margin-bottom:9px}.mode,.pill{font-size:.73rem;font-weight:700;border-radius:100px;padding:.38rem .65rem;background:#e2e8df;white-space:nowrap}.mode.demo{background:#f2e7ca;color:#6f541b}.system{display:grid;grid-template-columns:minmax(160px,1fr) minmax(160px,1.25fr) auto;gap:16px;align-items:center;border:1px solid var(--line);background:var(--white);padding:14px 17px;border-radius:12px}.system-state{display:grid;gap:4px}.connection{display:flex;flex-wrap:wrap;gap:6px}.notice{min-height:36px;font-size:.85rem;padding:8px 2px;color:var(--muted)}.notice.error{color:#982b23}.pill.on{color:#175743;background:#def0e5}.pill.bad{color:#8e2b25;background:#f5e3df}
.page{display:grid;gap:15px}.metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:11px}.metric,.panel{background:var(--white);border:1px solid var(--line);border-radius:12px}.metric{padding:14px 15px;border-top:3px solid #4798bb}.metric:nth-child(even){border-top-color:#cb6650}.metric p{color:var(--muted);font-size:.79rem}.metric strong{display:block;font-size:1.55rem;margin-top:5px}.panel-head{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:17px 19px;border-bottom:1px solid var(--line)}.panel-head p{margin-top:4px}.legend{display:flex;align-items:center;gap:7px;white-space:nowrap;font-size:.74rem;color:var(--muted)}.legend span{width:12px;height:4px;border-radius:4px}.blue{background:#4798bb}.red{background:#cb6650}.circuit{padding:18px 20px;display:grid;grid-template-columns:1fr minmax(25px,12%) 1fr;align-items:stretch;gap:12px}.equipment-list{display:grid;gap:6px}.equipment{min-height:54px;display:grid;grid-template-columns:52px 1fr auto;align-items:center;gap:8px;background:#f3f6ef;border-radius:8px;padding:4px 8px;font-size:.83rem}.equipment img{width:45px;height:40px;object-fit:contain}.equipment small{display:block;color:var(--muted);margin-top:3px}.pipe{display:flex;align-items:center;justify-content:center;gap:10px}.pipe i{height:84%;width:5px;background:#4798bb;border-radius:5px}.pipe i+i{background:#cb6650}
.hall-layout{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(300px,1fr);gap:15px;align-items:start}.map{display:block;width:100%;padding:13px;background:#eaf0e9;border-radius:0 0 12px 12px}.uta-row{display:grid;grid-template-columns:1fr auto;align-items:center;gap:10px;padding:10px 13px;border-bottom:1px solid var(--line);font-size:.85rem}.uta-row:last-child{border-bottom:0}.uta-row p{font-size:.77rem;color:var(--muted);margin-top:4px}.uta-row button{padding:.35rem .55rem;font-size:.78rem}.uta-row .pill{margin-left:5px}.filters{display:flex;gap:12px;flex-wrap:wrap;padding:17px 19px}.filters label:first-child{min-width:min(290px,100%)}.chart-wrap{margin:0 15px;position:relative;height:360px}.chart-wrap canvas{width:100%;height:100%;display:block}.chart-wrap p{position:absolute;inset:45% 0 auto;text-align:center;color:var(--muted)}.chart-footer{padding:10px 19px 18px;display:flex;justify-content:space-between;gap:8px;flex-wrap:wrap}
dialog{border:1px solid var(--line);border-radius:12px;width:min(440px,92%);color:var(--ink);padding:22px}dialog::backdrop{background:#10281f9e}dialog p{margin:10px 0 17px;color:var(--muted)}.dialog-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:18px}
@media(max-width:1040px){#app{grid-template-columns:185px 1fr}.hall-layout{grid-template-columns:1fr}}
@media(max-width:740px){.login{grid-template-columns:1fr}.login-brand{min-height:auto;padding:28px;border:0}.login-brand img{width:125px}.login form{margin:28px auto}#app{display:block}.sidebar{height:auto;position:static;border:0;border-bottom:1px solid var(--line);padding:10px;gap:8px}.sidebar img{width:76px}.sidebar nav{display:flex;justify-content:center;flex-wrap:wrap}.sidebar-foot{justify-content:flex-end;gap:10px}.top{align-items:flex-start}.system{grid-template-columns:1fr auto}.connection{grid-row:2;grid-column:1/-1}.metrics{grid-template-columns:1fr 1fr}.circuit{grid-template-columns:1fr}.pipe{display:none}.panel-head{flex-wrap:wrap}.chart-wrap{height:280px}}

.schematic-scroll{overflow-x:auto;border-radius:0 0 12px 12px}
.hydraulic,.hall-map{position:relative;isolation:isolate;background-color:#edf1ee;background-position:center;background-size:cover}
.hydraulic{min-width:620px;aspect-ratio:3/2;max-height:630px;background-image:url('/assets/cag-fundo.png')}
#hydraulic-pipes,#hydraulic-points,#hall-points{position:absolute;inset:0;width:100%;height:100%}
.machine,.hall-unit{position:absolute;left:var(--x);top:var(--y);transform:translate(-50%,-50%);background:#fcfdf9;border:1px solid #a9b9b0;box-shadow:0 4px 14px #1f3c3024;border-radius:8px}
.machine{min-width:96px;display:grid;justify-items:center;gap:3px;padding:6px 9px;color:#173f35;font-size:.78rem}
.machine-face{display:flex;align-items:center;gap:7px;font-size:.9rem;letter-spacing:.06em}
.machine-value{font-variant-numeric:tabular-nums;white-space:nowrap}
.machine .pill{padding:2px 5px;font-size:.65rem}
.indicator{height:8px;width:8px;border-radius:100%;background:#a3aaa4}
.indicator.on{background:#3d9269}
.pipe-caption,.bypass{position:absolute;background:#fcfdf9;border:1px solid #c2d0c8;border-radius:5px;padding:3px 7px;font-size:clamp(.64rem,1.1vw,.79rem);font-weight:750;white-space:nowrap}
.pipe-caption{right:6%;transform:translateY(-115%)}
.pipe-caption.cold{top:12%;color:#1b6285}
.pipe-caption.warm{top:29%;color:#843f30}
.bypass{left:47.7%;top:53%;transform:translate(-50%,-50%);color:#274d40}
.hall-map{aspect-ratio:3/2;background-image:url('/assets/salao-fundo.png');border-radius:0 0 12px 12px}
.hall-unit{padding:.25rem .38rem;display:grid;gap:2px;justify-items:start;line-height:1.05;white-space:nowrap;font-size:clamp(.59rem,1vw,.8rem);border-left:4px solid #9daaa3;color:#234a3c}
.hall-unit span{font-size:.86em;font-variant-numeric:tabular-nums;color:#506b5e}
.hall-unit[data-status=on]{border-left-color:#3d9269}
.hall-unit[data-status=fault]{border-left-color:#b8473c}
.hall-unit:disabled{opacity:1}
.hall-unit:enabled:hover{background:#e4f1e7}
@media(max-width:740px){.schematic-scroll{scrollbar-width:thin}.hydraulic{min-width:560px}.machine{min-width:77px;padding:4px 6px;font-size:.65rem}.machine-face{font-size:.77rem}}
.page{grid-template-columns:minmax(0,1fr)}
.panel{min-width:0}
@media(max-width:740px){
  .hydraulic{min-width:0;min-height:420px}
  .machine{min-width:66px;padding:4px;font-size:.61rem}
  .machine .pill{font-size:.58rem}
  .pipe-caption,.bypass{font-size:.59rem;padding:2px 4px}
}
#hall-pipes{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
#hall-points{pointer-events:none}
.hall-unit{pointer-events:auto;width:clamp(55px,13%,94px);justify-items:center;padding:3px 4px}
.hall-unit img{display:block;width:100%;height:clamp(20px,3.5vw,38px);object-fit:contain}
.machine.chiller{display:grid;grid-template-columns:minmax(34px,1fr) auto;align-items:center;gap:6px;width:clamp(102px,17%,165px);padding:5px}
.chiller-art{display:block;width:100%;max-height:55px;object-fit:contain}
.chiller-data{display:grid;gap:2px;justify-items:start}
.chiller-data .machine-face{font-size:.76rem}
.chiller-data .pill{font-size:.57rem}
@media(max-width:420px){.machine.chiller{width:88px;min-width:0;grid-template-columns:29px auto;gap:2px;padding:3px}.chiller-data .machine-face{font-size:.64rem}.chiller-data .pill{font-size:.51rem}.chiller-data .indicator{width:5px;height:5px}}
.login-footer{margin-top:6px;padding-top:15px;border-top:1px solid var(--line);color:var(--muted);font-size:.76rem;line-height:1.55}
.chiller-setpoint-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(114px,1fr));gap:10px;padding:13px 19px}
.chiller-setpoint-grid button{display:grid;justify-items:start;gap:4px;background:#f3f6ef;color:var(--ink);text-align:left}
.chiller-setpoint-grid button:enabled:hover{background:#e4f1e7;border-color:var(--green-2)}
.chiller-setpoint-grid button:disabled{opacity:1;color:var(--muted)}
.chiller-setpoint-grid strong{font-size:1.05rem;color:var(--green)}
.system.status-only{grid-template-columns:repeat(2,minmax(0,1fr))}
@media(max-width:740px){.system.status-only{grid-template-columns:minmax(0,1fr)}}
#app{grid-template-columns:244px minmax(0,1fr)}
.sidebar{background:#153b31;color:#f5f8ef;border-right:1px solid #24483e;padding:18px 14px 14px;gap:24px}
.side-brand{display:flex;align-items:center;gap:10px;padding:7px 4px}
.side-brand img{width:72px;height:54px;object-fit:contain;padding:6px;background:#f9faf3;border-radius:8px;margin:0}
.side-brand span{font-size:1.03rem;font-weight:750;letter-spacing:.015em}
.sidebar nav{display:grid;gap:4px}
.sidebar .nav-label{color:#b3c8bb;font-size:.67rem;letter-spacing:.11em;text-transform:uppercase;font-weight:750;padding:7px 10px 4px}
.sidebar .nav-label:not(:first-child){margin-top:13px}
.sidebar nav button{display:flex;align-items:center;gap:10px;min-height:44px;color:#e5efe7;border-color:transparent;border-radius:8px;padding:7px 9px;font-size:.84rem}
.sidebar nav button:hover{background:#245045}
.sidebar nav button[aria-current]{background:#2b5849;color:white;border-color:#527367;box-shadow:inset 3px 0 #c9ad6a}
.nav-icon{display:grid;place-items:center;flex:0 0 26px;height:26px;border-radius:6px;background:#285047;color:#e4ca8a;font-size:1.05rem}
.sidebar-foot{color:#edf4ed;border-top:1px solid #47665c;letter-spacing:0;gap:8px;padding:12px 0 0;align-items:center}
.side-profile{display:flex;align-items:center;gap:8px;min-width:0}
#profile-initial{display:grid;place-items:center;background:#d9e8da;color:#204a3c;border-radius:50%;width:32px;height:32px;flex:0 0 32px;font-size:.85rem}
.side-profile div{min-width:0}
.side-profile strong,.side-profile small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.side-profile small{color:#b3c8bb;margin-top:3px;font-weight:550}
.sidebar-foot button{background:#214d40;color:#edf4ed;border-color:#58786d;padding:.45rem .6rem}
.accounts-table{overflow-x:auto}
.accounts-table table{border-collapse:collapse;width:100%;min-width:490px;text-align:left;font-size:.88rem}
.accounts-table th,.accounts-table td{padding:12px 16px;border-bottom:1px solid var(--line)}
.accounts-table th{color:var(--muted);font-size:.76rem}
.accounts-table small{display:block;color:var(--muted);margin-top:3px}
.accounts-table button{padding:.38rem .65rem}
.accounts-status{padding:10px 16px;color:var(--muted);min-height:32px;font-size:.86rem}
.account-fields{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:16px}
.account-password{grid-column:1/-1}
.account-password small{color:var(--muted);font-weight:450}
#user-error{color:#982b23;margin:8px 0 0}
@media(max-width:1040px){#app{grid-template-columns:205px minmax(0,1fr)}}
@media(max-width:740px){
 .sidebar{gap:7px;padding:8px 12px}
 .side-brand{justify-content:center;padding:2px}
 .side-brand img{width:59px;height:39px}
 .sidebar nav{display:flex;gap:4px;justify-content:center;flex-wrap:wrap}
 .sidebar .nav-label{display:none}
 .sidebar nav button{font-size:.74rem;min-height:36px;gap:5px;padding:4px 6px}
 .nav-icon{flex-basis:19px;height:19px;font-size:.8rem}
 .sidebar-foot{justify-content:space-between;padding-top:6px}
}
main{margin:0 auto}