:root{font-family:Arial,sans-serif;color:#25303b;background:#eef2f5}*{box-sizing:border-box}body{margin:0}.top{background:linear-gradient(#fff,#e8edf1);padding:18px 4%;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #c8d0d7}.top h1{margin:0;font-size:25px}.top p{margin:5px 0 0;color:#65717c}#clock{font-weight:bold;font-size:17px}nav{display:flex;gap:4px;padding:8px 4%;background:#263746;flex-wrap:wrap}nav a{color:#eaf2f7;text-decoration:none;padding:9px 12px;border-radius:7px}nav a:hover,nav a.active{background:#fff;color:#263746}.admin{margin-left:auto;background:#526674}main{max-width:1450px;margin:auto;padding:18px 3%}.statusbar{display:flex;gap:28px;background:#fff;border:1px solid #d3dbe1;border-radius:12px;padding:12px 18px;box-shadow:0 2px 7px #0001;flex-wrap:wrap}.statusbar span{flex:1;min-width:150px;text-align:center}h2{font-size:22px}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.card{background:linear-gradient(145deg,#fff,#f2f4f6);border:1px solid #d0d7dd;border-radius:14px;padding:18px;box-shadow:0 3px 10px #00000012;min-height:170px}.wide{grid-column:span 2}.cardhead{display:flex;align-items:center;gap:9px;border-bottom:1px solid #dbe1e5;padding-bottom:10px}.cardhead span{font-size:25px}.card h3{margin:0}.big{font-size:40px;font-weight:bold;margin:18px 0}.big small{font-size:18px}.metrics{display:flex;gap:12px}.metrics div{flex:1;background:#edf1f4;border-radius:8px;padding:9px}.metrics small,.metrics b{display:block}.hint,small{color:#6b7780}.twostate{display:flex;justify-content:space-between;font-size:21px;margin:25px 0}.good{color:#237a45}.rooms{display:grid;grid-template-columns:repeat(5,1fr);gap:9px;margin-top:15px}.rooms div{background:#edf1f4;border-radius:9px;padding:12px}.rooms b,.rooms strong,.rooms span,.rooms em{display:block;margin:3px 0}.rooms strong{font-size:21px}.rooms em{font-style:normal;color:#237a45}footer{text-align:center;padding:18px;color:#6b7780}.demo{font-weight:bold}@media(max-width:900px){.grid{grid-template-columns:1fr}.wide{grid-column:auto}.rooms{grid-template-columns:1fr 1fr}.admin{margin-left:0}}
/* v0.2 instruments */
main{max-width:1650px}.energy-layout{display:grid;grid-template-columns:230px 1fr;gap:18px;align-items:center}.instrument{text-align:center}.instrument .ival{font-weight:800}.instrument.digital .ival{font-size:48px}.instrument.digital .unit{font-size:18px}.dial{position:relative;width:190px;height:150px;margin:0 auto;background:radial-gradient(circle at 50% 68%,#fff 0 38%,#e5e9ec 39% 43%,#c8d0d6 44% 46%,#f8fafb 47% 100%);border:1px solid #bfc8cf;border-radius:50% 50% 16px 16px;box-shadow:inset 0 2px 8px #0002,0 3px 8px #0001;overflow:hidden}.dial:before{content:"";position:absolute;left:18px;right:18px;top:18px;height:105px;border-radius:50% 50% 0 0;background:conic-gradient(from 240deg,#dfe6ea 0 66%,#f1c45c 66% 83%,#df6b5d 83% 100%);opacity:.7}.needle{position:absolute;left:50%;top:66%;width:72px;height:3px;background:#263746;transform-origin:0 50%;transform:rotate(-120deg);transition:transform .7s cubic-bezier(.2,.8,.2,1);border-radius:3px;z-index:3}.needle:after{content:"";position:absolute;left:-6px;top:-5px;width:13px;height:13px;background:#263746;border-radius:50%}.dial-readout{position:absolute;left:0;right:0;bottom:12px;z-index:4}.dial-readout .ival{font-size:30px}.dial-readout .unit{font-size:14px}.dial-label{font-size:12px;color:#65717c;margin-top:6px}.bar-track{height:16px;background:#dfe5e9;border-radius:9px;overflow:hidden;box-shadow:inset 0 1px 3px #0002;margin:10px 0}.bar-fill{height:100%;width:0;background:linear-gradient(90deg,#9fb6c5,#5e7d90);transition:width .7s}.instrument.bar .ival{font-size:28px}.instrument.compact .dial{width:160px;height:125px}.instrument.compact .needle{top:66%;width:58px}.instrument.compact .dial-readout .ival{font-size:25px}@media(max-width:800px){.energy-layout{grid-template-columns:1fr}.dial{width:175px}}



/* v0.3.2 genuine seven-segment display - robust version */
.seven-display{--seg:#ff3b30;--glow:#ff3b30;display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:78px;padding:12px 16px;border-radius:10px;border:1px solid #11171b;background:linear-gradient(180deg,#070a0c,#151a1e);box-shadow:inset 0 2px 10px rgba(0,0,0,.9),0 3px 7px rgba(0,0,0,.25)}
.seven-display.theme-light{background:linear-gradient(180deg,#f2f4ef,#d8ddd5);border-color:#aeb5ad;box-shadow:inset 0 2px 7px rgba(0,0,0,.16),0 2px 5px rgba(0,0,0,.12)}
.seg-digit{position:relative;display:inline-block;flex:0 0 36px;width:36px;height:64px}
.seg-digit .seg{position:absolute;display:block;box-sizing:border-box;background:var(--seg);opacity:.055;box-shadow:none}
.seg-digit .seg.is-on{opacity:1;box-shadow:0 0 5px var(--glow),0 0 11px var(--glow)}
.seg-a,.seg-g,.seg-d{left:7px;width:22px;height:7px;clip-path:polygon(16% 0,84% 0,100% 50%,84% 100%,16% 100%,0 50%)}
.seg-a{top:0}.seg-g{top:28px}.seg-d{bottom:0}
.seg-b,.seg-c,.seg-e,.seg-f{width:7px;height:27px;clip-path:polygon(50% 0,100% 15%,100% 85%,50% 100%,0 85%,0 15%)}
.seg-f{left:0;top:5px}.seg-b{right:0;top:5px}.seg-e{left:0;bottom:5px}.seg-c{right:0;bottom:5px}
.seg-dot{display:inline-block;flex:0 0 8px;width:8px;height:8px;border-radius:50%;background:var(--seg);opacity:.06;align-self:flex-end;margin:0 0 5px -3px}
.seg-dot.on{opacity:1;box-shadow:0 0 5px var(--glow),0 0 10px var(--glow)}
.seven-display .seg-unit{display:inline-block;margin-left:4px;color:var(--seg);font:700 17px/1 Arial,sans-serif;text-shadow:0 0 5px var(--glow),0 0 9px var(--glow)}
.seg-red{--seg:#ff3b30;--glow:#ff3b30}.seg-green{--seg:#39ff78;--glow:#20e860}.seg-blue{--seg:#48a8ff;--glow:#2b8fff}.seg-amber{--seg:#ffb51b;--glow:#ff9d00}.seg-white{--seg:#f5f7f8;--glow:#dcecff}.seg-cyan{--seg:#36f0ef;--glow:#18cfd1}
@media(max-width:600px){.seg-digit{flex-basis:30px;width:30px;height:54px}.seg-a,.seg-g,.seg-d{left:6px;width:18px;height:6px}.seg-g{top:24px}.seg-b,.seg-c,.seg-e,.seg-f{width:6px;height:23px}}

/* v0.3.3 cache-bust diagnostic */
.seven-display{position:relative}
.seven-display[data-display-version="0.3.3"]::after{
 content:"7SEG";
 position:absolute;right:4px;bottom:2px;
 font:7px Arial,sans-serif;letter-spacing:.3px;
 color:var(--seg);opacity:.28;text-shadow:none
}

/* v0.4.0 login / account */
.userbox{display:flex;align-items:center;gap:12px;flex-wrap:wrap;justify-content:flex-end}.userbox a{color:inherit;text-decoration:none;padding:6px 10px;border:1px solid rgba(255,255,255,.35);border-radius:7px}.login-page{min-height:100vh;background:linear-gradient(145deg,#e8edf1,#cfd7dc);display:grid;place-items:center}.login-wrap{width:min(430px,calc(100% - 30px));margin:0}.login-card{background:#fff;padding:30px;border-radius:16px;box-shadow:0 12px 35px rgba(0,0,0,.18)}.login-card h1{margin-top:0}.login-card form{display:grid;gap:15px}.login-card label{display:grid;gap:6px;font-weight:600}.login-card input{font:inherit;padding:11px;border:1px solid #b9c2c8;border-radius:8px}.login-card button{font:inherit;font-weight:700;padding:11px;border:0;border-radius:8px;cursor:pointer}.login-error{padding:10px 12px;margin:12px 0;background:#ffe8e8;border:1px solid #e2a5a5;border-radius:8px}


/* v0.4.1 password strength */
.password-field{display:grid;gap:6px}
.password-strength{height:8px;background:#d9dee2;border-radius:999px;overflow:hidden;box-shadow:inset 0 1px 2px rgba(0,0,0,.12)}
.password-strength-fill{display:block;width:0;height:100%;border-radius:999px;background:#cfd5d9;transition:width .22s ease,background .22s ease}
.password-strength-text{font-size:12px;font-weight:700;color:#69757e}
.password-field.pw-weak .password-strength-fill{background:#d64545}
.password-field.pw-medium .password-strength-fill{background:#e4932f}
.password-field.pw-good .password-strength-fill{background:#d1b12d}
.password-field.pw-strong .password-strength-fill{background:#2f9a58}
.password-field.pw-weak .password-strength-text{color:#b73535}
.password-field.pw-medium .password-strength-text{color:#b96d1c}
.password-field.pw-good .password-strength-text{color:#8b7419}
.password-field.pw-strong .password-strength-text{color:#247b46}
.password-hint{font-size:11px;font-weight:400;color:#74808a}


/* v0.7.3 modern login + password reset */
.login-page.login-modern{min-height:100vh;background:radial-gradient(circle at 20% 10%,#f9fcff 0,#eaf2f8 32%,transparent 55%),linear-gradient(145deg,#e9f0f5,#cfdbe4);font-family:Arial,sans-serif;color:#1d2d3d}.login-modern .login-wrap{width:min(470px,calc(100% - 30px));padding:28px 0}.login-card-modern{position:relative;padding:38px 38px 30px;border:1px solid rgba(117,145,167,.28);border-radius:24px;box-shadow:0 24px 55px rgba(38,61,78,.22),inset 0 1px 0 rgba(255,255,255,.9);background:rgba(255,255,255,.94);backdrop-filter:blur(10px)}.login-brand{display:flex;align-items:center;gap:17px;margin-bottom:30px}.login-logo{width:70px;height:70px;flex:0 0 70px;border-radius:20px;background:linear-gradient(145deg,#f7fbff,#dbeafb);display:grid;place-items:center;box-shadow:inset 0 1px 0 #fff,0 8px 18px rgba(54,108,157,.15)}.login-logo svg{width:47px;height:47px;fill:none;stroke:#2d74b7;stroke-width:4;stroke-linejoin:round;stroke-linecap:round}.login-logo.small{font-size:34px;color:#2d74b7}.login-brand h1{font-size:30px;line-height:1.05;margin:0;color:#1c2e40;letter-spacing:-.6px}.login-brand p{margin:7px 0 0;color:#6f8090;font-size:15px}.modern-login-form{display:grid;gap:17px}.modern-login-form label{display:grid;gap:7px;font-weight:700;color:#293b4b;font-size:14px}.modern-login-form input{box-sizing:border-box;width:100%;font:inherit;font-weight:400;padding:14px 15px;border:1px solid #b8c7d3;border-radius:11px;background:#fff;color:#1c2d3d;outline:none;transition:.18s box-shadow,.18s border-color}.modern-login-form input:focus{border-color:#3488d2;box-shadow:0 0 0 3px rgba(52,136,210,.14)}.login-input-wrap{position:relative}.login-input-wrap input{padding-left:43px;padding-right:46px}.login-field-icon{position:absolute;left:16px;top:50%;transform:translateY(-50%);z-index:2;color:#71879a;font-size:13px}.password-eye{position:absolute!important;right:7px;top:50%;transform:translateY(-50%);width:37px;height:37px!important;padding:0!important;border:0!important;border-radius:9px!important;background:transparent!important;color:#5d7488!important;box-shadow:none!important;font-size:20px!important}.password-eye:hover{background:#edf4f9!important}.login-actions{display:flex;justify-content:space-between;align-items:center;margin-top:-5px}.login-actions a,.login-back{color:#246fae;text-decoration:none;font-size:14px;font-weight:700}.login-actions a:hover,.login-back:hover{text-decoration:underline}.login-submit{display:flex!important;align-items:center;justify-content:center;gap:10px;margin-top:2px;padding:14px!important;border:1px solid #1768aa!important;border-radius:11px!important;background:linear-gradient(#3b96df,#1975bd)!important;color:#fff!important;font-size:17px!important;font-weight:700!important;box-shadow:0 7px 16px rgba(31,119,187,.24),inset 0 1px 0 rgba(255,255,255,.35)!important}.login-submit:hover{filter:brightness(1.04)}.login-security{display:flex;align-items:center;gap:13px;margin-top:26px;padding:15px 17px;border-radius:13px;background:linear-gradient(135deg,#eef6fd,#e4f0fa);border:1px solid #d5e7f5;color:#245a86}.login-security>span{display:grid;place-items:center;width:31px;height:31px;border:2px solid #2d74b7;border-radius:50%;font-weight:800}.login-security div{display:grid;gap:2px}.login-security strong{font-size:14px}.login-security small{font-size:12px;color:#647b8e}.login-version{text-align:center;margin-top:22px;color:#8997a4;font-size:12px}.login-success{padding:11px 13px;margin:12px 0 18px;background:#e8f6ed;border:1px solid #9dcfb0;border-radius:9px;color:#25623d}.compact-reset .login-brand{margin-bottom:22px}.compact-reset .reset-help{color:#617486;line-height:1.5;margin:0 0 18px}.compact-reset .login-back{display:inline-block;margin-top:20px}.compact-reset .primary-link{display:block;text-align:center;padding:13px;border-radius:10px;background:#267dc1;color:#fff;text-decoration:none}.reset-note{margin:22px 0 0;padding-top:16px;border-top:1px solid #dce5eb;color:#7a8995;font-size:12px;line-height:1.45}@media(max-width:520px){.login-card-modern{padding:28px 22px 24px;border-radius:19px}.login-brand h1{font-size:26px}.login-logo{width:58px;height:58px;flex-basis:58px}.login-logo svg{width:39px;height:39px}}
