*{box-sizing:border-box}body{margin:0;font-family:Segoe UI,Arial,sans-serif;color:#18312b;background:#f3f6f4;font-size:14px}button,input,select,textarea{font:inherit}button,a,input,select{outline-offset:4px}button{cursor:pointer}button:disabled{opacity:.5;cursor:wait}[hidden]{display:none!important}.shell{display:flex;min-height:100vh}.sidebar{width:240px;background:#102922;color:#d3e0da;padding:32px 20px;position:fixed;inset:0 auto 0 0;display:flex;flex-direction:column;z-index:20}.brand{display:flex;align-items:center;gap:10px;font-size:24px;font-weight:750;letter-spacing:1px}.brand small{font-size:8px;color:#9bac9f;letter-spacing:2px}.brand-mark{display:grid;place-items:center;width:37px;height:37px;border:1px solid #547164;border-radius:10px;background:#254b3e;color:#b5e2b8;font-size:24px}.nav-label{font-size:9px;letter-spacing:1.5px;color:#7b998c;margin:48px 10px 15px}.nav-item{display:flex;align-items:center;gap:13px;border:0;width:100%;border-radius:8px;background:transparent;color:#b0c5ba;padding:13px 15px;text-align:left;margin-bottom:5px}.nav-item span{font-size:21px;width:22px}.nav-item:hover{background:#1b3a2e}.nav-item.active{background:#294b3b;color:#e5f3df;box-shadow:inset 3px 0 #b4d79b}.nav-divider{height:1px;background:#294035;margin:22px 10px}.sidebar-bottom{margin-top:auto;display:flex;gap:12px;align-items:center;padding:18px 8px;font-size:12px}.sidebar-bottom small{display:block;color:#7f9e8d;margin-top:4px}.dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:#7cbe81;flex:none}.workspace{margin-left:240px;width:calc(100% - 240px)}.topbar{height:84px;background:#fff;border-bottom:1px solid #e0e8e2;display:flex;align-items:center;justify-content:space-between;padding:0 38px}.breadcrumb{font-size:12px;color:#84978d}.breadcrumb span{padding:0 13px;color:#c2cfc6}.breadcrumb b{color:#3a5246;font-weight:500}.account{display:flex;align-items:center;gap:10px}.account strong{font-size:12px;font-weight:600}.account small{display:block;color:#8b9c91;font-size:10px;margin-top:3px}.avatar{width:34px;height:34px;display:grid;place-items:center;background:#edf2e8;border:1px solid #dce7d2;border-radius:50%;font-weight:600;color:#5d784e}.text-btn,.icon-btn{background:none;border:0;color:#6b8073;padding:8px}.text-btn{font-size:11px}.icon-btn{font-size:22px}#menu{display:none}main{max-width:1540px;margin:auto;padding:37px 38px 0}.page-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:27px;gap:15px}.eyebrow{font-size:9px;letter-spacing:2px;color:#879d8a;font-weight:700}h1{font-size:30px;font-weight:600;letter-spacing:-1px;margin:9px 0}p{color:#829287;line-height:1.7;margin:6px 0 18px}h2{font-size:15px;font-weight:650;margin:0 0 10px}h3{font-size:13px}.heading-actions{display:flex;align-items:center;gap:16px;color:#87988d;font-size:11px}.primary,.secondary{border-radius:7px;padding:10px 15px;font-weight:600;font-size:12px;border:1px solid transparent;display:inline-flex;align-items:center;justify-content:center;gap:10px}.primary{background:#254d3d;color:#fff}.primary:hover{background:#163629}.secondary{background:#fff;border-color:#dbe5dc;color:#4b6756}.secondary:hover{background:#f0f5ed}.summary{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid #dde6df;background:#fff;border-radius:12px;margin-bottom:32px;padding:21px 0}.summary>div{padding:0 22px;border-right:1px solid #e7ede8}.summary>div:last-child{border:0}.summary span{font-size:11px;color:#819285}.summary strong{display:block;font-size:29px;font-weight:600;margin:9px 0}.summary small{font-size:10px;color:#99a69b}.summary .summary-local{font-size:23px;display:flex;align-items:center;gap:10px;padding:4px 0}.section-heading{display:flex;justify-content:space-between;align-items:center;gap:15px;margin-bottom:19px}.section-heading h2{margin:0}.section-heading>span{font-size:10px;color:#92a095}.device-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.device-card,.panel{border:1px solid #dce6de;background:#fff;border-radius:12px;padding:23px;box-shadow:0 3px 8px #132a1d03}.device-card{padding:22px 23px 0;overflow:hidden}.card-top{display:flex;justify-content:space-between;align-items:center}.system-icon{height:39px;width:39px;border:1px solid #e3eadd;border-radius:10px;display:grid;place-items:center;background:#f4f7ef;color:#799657;font-size:21px}.system-icon.water{background:#eff6f7;color:#608d95;border-color:#e0ecee}.system-icon.power{background:#f7f3ec;color:#b39466;border-color:#eee6dc}.badge{font-size:9px;font-weight:650;padding:5px 9px;border-radius:20px;display:inline-flex;gap:5px;align-items:center;background:#eef3ef;color:#85958a}.badge.online{color:#53805e;background:#eff6ed}.badge.alarm{background:#fff3e5;color:#ad7b35}.badge.offline .dot{background:#aebcb3}.card-title{margin-top:19px;font-size:16px;font-weight:600}.card-location{color:#9aa79e;font-size:10px;margin:6px 0}.card-reading{height:155px;display:flex;align-items:center;justify-content:center;flex-direction:column;position:relative}.value{font-size:42px;font-weight:550;letter-spacing:-2px;color:#284b39}.value small{font-size:14px;letter-spacing:0;color:#92a493;font-weight:400;margin-left:5px}.reading-label{color:#97a59c;font-size:10px;margin-top:5px}.gauge{position:absolute;top:15px;width:190px;height:100px;border:12px solid #edf1eb;border-bottom:0;border-radius:110px 110px 0 0}.gas-reading .value{margin-top:40px;z-index:1}.gauge.active{border-color:#d4dfbf}.water-tank{position:absolute;inset:18px calc(50% - 40px) 15px;width:80px;border:2px solid #dce8e9;border-radius:8px;overflow:hidden;background:#f9fbfb}.water-fill{position:absolute;bottom:0;width:100%;background:#c9e0e2}.water-reading .value{z-index:1;font-size:30px;letter-spacing:-1px}.water-reading .reading-label{z-index:1}.source-row{border-top:1px solid #f0f3ef;padding-top:11px;display:flex;justify-content:space-between;font-size:10px;color:#96a49b;margin-bottom:15px}.card-footer{margin:0 -23px;background:#fafcf9;border-top:1px solid #eaf0e8;padding:12px 23px;display:flex;justify-content:space-between;align-items:center;color:#86967e;font-size:10px}.card-footer button{border:0;background:none;color:#5e7e4f;font-size:11px;font-weight:600}.lower-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:20px;margin-top:25px}.signal{display:flex;gap:12px;align-items:center;padding:13px 0;border-top:1px solid #edf1eb}.signal:first-child{border:0}.signal-mark{background:#f9f3e9;color:#ac9267;border-radius:8px;width:31px;height:31px;display:grid;place-items:center}.signal strong{display:block;font-weight:550;font-size:12px}.signal small{color:#96a498;font-size:10px}.architecture{background:linear-gradient(130deg,#f8faf5,#edf2e7);border-color:#dfe6d6}.architecture h2{font-size:21px;line-height:1.4;letter-spacing:-.5px;margin:14px 0 10px}.architecture p{font-size:11px;max-width:360px}.architecture-steps{display:flex;align-items:center;gap:10px;margin-top:22px}.architecture-steps span{border:1px solid #d9e3d1;border-radius:5px;background:#fff8;padding:7px 10px;font-size:10px;color:#6b8659}.architecture-steps i{font-style:normal;color:#a8b69a}footer{display:flex;justify-content:space-between;gap:20px;border-top:1px solid #e0e8df;margin-top:35px;padding:22px 0;color:#99a69c;font-size:9px}.notice{background:#eef4ec;border:1px solid #dbe8d4;padding:14px 17px;border-radius:8px;line-height:1.7;color:#638352;margin-bottom:20px;font-size:12px}.notice.danger{background:#fff0ed;color:#9e4f43;border-color:#ecd7d0}table{width:100%;border-collapse:collapse;text-align:left}th{font-size:9px;color:#94a296;letter-spacing:1px;text-transform:uppercase;padding:10px;border-bottom:1px solid #e5ece4}td{padding:16px 10px;border-bottom:1px solid #edf1eb;font-size:12px}td small{display:block;color:#98a49b;margin-top:5px}label{display:block;color:#657a6b;font-size:11px;font-weight:600;margin:16px 0}input,select,textarea{display:block;width:100%;border:1px solid #d8e3d8;border-radius:7px;background:#fbfdfb;color:#2b4a35;padding:11px 12px;margin-top:7px;min-height:41px}input:focus,select:focus,textarea:focus{outline:2px solid #93b889}small,.muted{color:#8f9f92;font-size:11px;line-height:1.7}.inline-form{display:flex;align-items:end;gap:10px;flex-wrap:wrap}.inline-form label{margin:0;flex:1}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px}.setup-steps{padding-left:18px;color:#839486;font-size:12px;line-height:2}.setup-steps a{color:#41684a}.chart-panel{margin-top:20px}.chart{width:100%;height:200px}.chart-empty{text-align:center;color:#8c9e90;padding:65px 20px}.detail-metric{font-size:55px;letter-spacing:-2px;color:#375e42}.detail-metric small{font-size:17px;letter-spacing:0}.detail-header{display:flex;align-items:center;justify-content:space-between}.detail-status{font-size:12px;margin-top:15px;color:#8e9f92}dialog{width:min(550px,94vw);border:1px solid #dde8d9;border-radius:15px;padding:26px;max-height:90vh;color:#243e2c;box-shadow:0 25px 100px #061b1840}dialog::backdrop{background:#152b2560;backdrop-filter:blur(3px)}.dialog-actions{display:flex;gap:10px;margin:20px 0}hr{border:0;border-top:1px solid #e5ece3;margin:25px 0}.toast{position:fixed;right:25px;bottom:25px;z-index:100;background:#234732;color:#fff;padding:16px 22px;border-radius:10px;box-shadow:0 5px 25px #0002;max-width:90vw}.login-screen{display:grid;grid-template-columns:1.05fr 1fr;min-height:100vh}.login-story{background:#102922;color:#f1f6ed;padding:60px 10%;display:flex;flex-direction:column;justify-content:center;position:relative;overflow:hidden}.login-story:after{content:"";position:absolute;width:500px;height:500px;border:1px solid #436041;border-radius:50%;right:-260px;bottom:-170px;box-shadow:0 0 0 60px #ffffff03,0 0 0 120px #ffffff02}.login-story .brand{position:absolute;top:40px}.login-story .eyebrow{color:#91b27e;margin-bottom:20px}.login-story h1{font-size:55px;line-height:1.15;letter-spacing:-2px}.login-story p{color:#96b39f;max-width:340px;font-size:15px;margin:22px 0}.story-line{margin-top:40px;font-size:11px;color:#abc4a5;display:flex;gap:9px;align-items:center}.login-form{align-self:center;max-width:370px;width:80%;margin:auto}.login-form h2{font-size:29px;letter-spacing:-1px;margin:15px 0 8px}.login-form .primary{width:100%;justify-content:space-between;margin:12px 0}.login-form>small{display:block;margin-top:25px}.error{color:#b05c49;font-size:12px}.empty{padding:25px 0;color:#8f9f91}.table-scroll{overflow:auto}@media(max-width:1100px){.sidebar{width:210px}.workspace{margin-left:210px;width:calc(100% - 210px)}main{padding:28px 24px 0}.topbar{padding:0 24px}.device-cards{gap:12px}.summary>div{padding:0 14px}.heading-actions #clock{display:none}}@media(max-width:850px){.sidebar{transform:translate(-100%);transition:transform .2s}.sidebar.open{transform:none}.workspace{margin:0;width:100%}#menu{display:block}.breadcrumb{margin-right:auto;padding-left:12px}.device-cards{grid-template-columns:1fr 1fr}.device-card:last-child{grid-column:1/-1}.lower-grid{grid-template-columns:1fr}.summary{grid-template-columns:1fr 1fr;gap:22px}.summary>div:nth-child(2){border:0}.page-heading{align-items:start}.login-story h1{font-size:40px}}@media(max-width:550px){main{padding:25px 16px 0}.topbar{height:70px;padding:0 12px}.breadcrumb{font-size:10px}.breadcrumb>b,.breadcrumb>span{display:none}.account strong{max-width:85px;display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.account .avatar{display:none}.device-cards{grid-template-columns:1fr}.device-card:last-child{grid-column:auto}.page-heading h1{font-size:26px}.heading-actions{padding-top:20px}.section-heading>span{display:none}.panel{padding:20px}.form-grid,.login-screen{grid-template-columns:1fr}.login-story{display:none}.login-form{max-width:360px}.inline-form{align-items:center}.inline-form label{flex-basis:100%}footer{flex-direction:column;gap:8px}}.device-card{display:flex;flex-direction:column}.card-reading{flex:1;min-height:155px}.gas-reading{min-height:215px;height:auto;justify-content:flex-start;padding-top:8px}.gas-reading .value{margin-top:0}.gas-gauge{display:block;width:100%;max-width:260px;height:145px;flex:none;overflow:visible}.gauge-base,.gauge-zone{fill:none;stroke-width:13;stroke-linecap:butt}.gauge-base{stroke:#edf1eb}.gauge-zone.reserve{stroke:#ef4444}.gauge-zone.alert{stroke:#facc15}.gauge-zone.normal{stroke:#22c55e}.gauge-tick{stroke:#9aa89f;stroke-width:1}.gauge-number{fill:#718178;font-size:10px}.gauge-needle{stroke:#294b3b;stroke-width:3;stroke-linecap:round}.gauge-hub{fill:#294b3b}.gas-gauge.is-offline{opacity:.45}.value.reserve{color:#b91c1c}.value.alert{color:#a16207}.value.normal{color:#15803d}.value.above{color:#657a6b}.badge.reserve{background:#fef2f2;color:#b91c1c}.badge.reserve .dot{background:#ef4444}.badge.alert,.badge.above{background:#fef9c3;color:#854d0e}.badge.alert .dot,.badge.above .dot{background:#eab308}.badge.normal{background:#f0fdf4;color:#15803d}.badge.normal .dot{background:#22c55e}.gas-limits{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;margin:6px 0 16px;padding-top:12px;border-top:1px solid #edf1eb}.gas-limits>span{font-size:10px;color:#657a6b}.gas-limits b{display:block;font-size:9px;font-weight:500;line-height:1.6}.gas-limits i{display:inline-block;width:6px;height:6px;border-radius:50%;margin-right:4px}.gas-limits .reserve i{background:#ef4444}.gas-limits .alert i{background:#eab308}.gas-limits .normal i{background:#22c55e}.gas-limits>small{grid-column:1/-1;font-size:9px}.source-row{margin-top:auto}.card-footer{gap:8px;flex-wrap:wrap}.card-actions{display:flex;gap:6px;flex-wrap:wrap}.card-actions button{padding:5px 0;white-space:nowrap}.gas-settings-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.gauge-preview{display:flex;justify-content:center;padding:10px 0}.gauge-preview .gas-gauge{height:160px;opacity:1}@media(max-width:550px){.gas-settings-grid{grid-template-columns:1fr}.gas-settings-grid label{margin:8px 0}.gas-reading{min-height:225px}}.bench-box{border:1px solid #dce6de;border-radius:9px;padding:12px;margin:0 0 16px;background:#f9fbf8}.bench-box.is-active{border-color:#e5b554;background:#fff9e9}.bench-switch{display:flex;align-items:center;gap:8px;margin:0;font-size:12px;color:#294b3b;flex-wrap:wrap}.bench-switch input{display:inline-block;width:17px;min-height:17px;margin:0}.bench-switch small{font-size:9px}.bench-status{font-size:10px;line-height:1.5;margin:9px 0;color:#87601d}.bench-box label:not(.bench-switch){margin:10px 0}.bench-box output{float:right}.bench-box input[type=range]{padding:0;border:0;accent-color:#294b3b;min-height:28px;background:transparent}.bench-real{font-size:10px;margin:8px 0}.bench-box>small{font-size:9px}.bench-box .secondary{font-size:10px;margin-top:6px}.device-card:has(.bench-box.is-active) .gas-gauge{touch-action:none;cursor:ew-resize}