#live-panel{margin:6px 0 28px;--solar:#b68a0d;--storage:#167c79;--ac:#286bd2}.energy-panel,.battery-panel{border:1px solid #dce5ed;border-radius:14px;background:#fff;overflow:hidden;margin-bottom:18px}.energy-heading{padding:25px 26px 18px;display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}.energy-heading h2{font-size:1.3rem;margin:8px 0 0;letter-spacing:-.03em}.energy-heading .eyebrow{color:#6d8296;font-size:.7rem}.energy-heading #live-status{font-size:.8rem;color:#377166}.live-note{margin:0 26px 16px;padding:12px 15px;border-radius:7px;background:#f3f6fa;color:#596c80;font-size:.8rem;line-height:1.55}.live-note[hidden]{display:none}.energy-map{height:310px;position:relative;margin:0 26px 20px;background:radial-gradient(ellipse at center,#eff5f9 0,white 70%);border-radius:12px}.energy-lines{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.wire{stroke:#e2e9ed;stroke-width:4;fill:none}.flow{stroke-width:4;fill:none;stroke-dasharray:7 15;opacity:0;stroke-linecap:round}.pv-flow{stroke:#c89e29}.ac-flow{stroke:#377fe0}.battery-flow{stroke:#20a198}.flow-moving{opacity:1;animation:energy-flow 1.1s linear infinite}.flow-reverse{animation-direction:reverse}.live-stale .flow{animation-play-state:paused;opacity:.2}.energy-node{position:absolute;display:flex;flex-direction:column;gap:8px;justify-content:center;border:1px solid #dfe8ec;border-radius:12px;background:white;box-shadow:0 6px 16px #19364806;padding:18px 20px;width:24%;min-height:112px}.node-label{text-transform:uppercase;font-size:.69rem;letter-spacing:.07em;color:#698193;font-weight:650}.energy-node>strong{font-size:clamp(1.2rem,2.5vw,2.1rem);letter-spacing:-.055em;font-variant-numeric:tabular-nums;line-height:1.15}.energy-node>span:not(.node-label),.energy-node>small{font-size:.78rem;color:#687d8f}.node-pv{top:12px;left:0;border-top:3px solid #d4ab41}.node-pv>strong{color:#947010}.node-ac{top:12px;right:0;border-top:3px solid #5084d3}.node-ac>strong{color:#2867bc}.node-inverter{top:28px;left:42%;width:16%;min-height:94px;background:#152b40;border-color:#152b40;align-items:center;padding:15px 5px}.node-inverter>strong{font-size:1.35rem;color:#fff;letter-spacing:.03em}.node-inverter .node-label,.node-inverter>span:not(.node-label){color:#b5cbdc;font-size:.7rem}.node-battery{bottom:0;left:37%;width:26%;border-top:3px solid #32a39d}.node-battery>strong{color:#197f79}.grid-summary,.ac-summary{position:absolute;bottom:0;display:grid;gap:7px;font-size:.8rem;line-height:1.3;width:29%;padding:8px}.grid-summary{left:0}.ac-summary{right:0;text-align:right}.grid-summary small,.ac-summary small{font-size:.7rem;color:#7c8c9a;line-height:1.5}.grid-summary div span,.ac-summary div span{font-weight:650;margin-left:10px}.pv-details{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));background:#f8fafc;border-top:1px solid #e7edf1;padding:22px 26px;gap:20px}.pv-details>div{display:flex;flex-direction:column;gap:9px}.pv-details strong{font-size:1.15rem}.pv-details>div>span:last-child{font-size:.82rem;color:#687c8e}.battery-panel{border-top:3px solid #2c928c}.battery-soc{display:flex;align-items:center;gap:16px}.battery-soc strong{color:#187f78;font-size:1.7rem;letter-spacing:-.04em}.battery-soc meter{width:110px;height:15px}.battery-metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));padding:8px 26px 24px;gap:20px}.live-metric{display:grid;gap:10px}.live-metric>span{font-size:.8rem;color:#718494}.live-metric>strong{font-size:1.7rem;letter-spacing:-.045em;font-variant-numeric:tabular-nums}.battery-facts{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px;padding:20px 26px;border-top:1px solid #e7edf1;border-bottom:1px solid #e7edf1;background:#fbfcfd}.battery-facts strong{font-size:1.05rem;letter-spacing:-.02em}.bms-state{padding:20px 26px;display:flex;gap:20px;flex-wrap:wrap;font-size:.8rem;color:#778899}.bms-state b{display:inline-block;padding:5px 8px;border-radius:5px;background:#f1f3f6;color:#697886;margin-left:6px;font-size:.75rem}.bms-state b.state-on{color:#197c70;background:#e9f6f1}.cell-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;padding:0 26px 24px}.cell{position:relative;border:1px solid #e1e8ed;border-radius:8px;padding:13px 14px;display:grid;grid-template-columns:1fr auto;gap:10px;background:#fff}.cell[hidden]{display:none}.cell-name{font-size:.75rem;color:#728796}.cell strong{font-size:.88rem;font-variant-numeric:tabular-nums}.cell meter{grid-column:1/-1;width:100%;height:7px}.cell-balance{position:absolute;top:-5px;right:-5px;border-radius:50%;background:#137f7c;color:white;font-size:.65rem;width:17px;height:17px;text-align:center;line-height:17px}.cell-balance[hidden]{display:none}.cell-min{border-color:#d9b66b;background:#fffdf8}.cell-max{border-color:#83b9b0;background:#f8fdfb}.bms-temperatures{padding:0 26px 24px;color:#7a8d9b;font-size:.8rem;display:flex;gap:18px;flex-wrap:wrap}.bms-temperatures>span{color:#486377}.live-footer{display:grid;grid-template-columns:1fr 1fr 2fr 1fr 1fr;gap:18px;padding:20px 22px;background:#eaf0f5;border-radius:10px}.live-footer>div{display:grid;gap:8px;align-content:start}.live-footer>div>span{font-size:.7rem;color:#6f8292}.live-footer strong{font-size:.78rem;font-weight:600;line-height:1.65}.live-footer small{font-weight:400;color:#748493}.live-disconnected .battery-panel,.live-disconnected .live-footer{opacity:.7}meter{accent-color:#37a092}meter::-webkit-meter-optimum-value{background:#37a092}meter::-webkit-meter-bar{background:#e6edf0;border:0;border-radius:6px}@keyframes energy-flow{to{stroke-dashoffset:-44}}@media(prefers-reduced-motion:reduce){.flow-moving{animation:none}}
@media(max-width:1150px){.battery-facts{grid-template-columns:repeat(3,minmax(0,1fr))}.cell-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.live-footer{grid-template-columns:1fr 1fr}.energy-node{padding:15px 12px}.energy-heading{padding:20px}.energy-map{margin:0 18px 20px}}
@media(max-width:650px){.energy-map{height:auto;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px;background:none}.energy-lines{display:none}.energy-node,.grid-summary,.ac-summary{position:static;width:auto;min-width:0;min-height:110px;text-align:left}.node-inverter{grid-column:1/-1;grid-row:1;min-height:64px;flex-direction:row;justify-content:space-between;padding:16px}.node-battery{grid-column:1/-1}.node-battery>strong{font-size:1.7rem}.energy-node>strong{font-size:1.5rem}.pv-details{grid-template-columns:1fr 1fr;padding:18px}.battery-metrics{grid-template-columns:1fr 1fr;padding:8px 18px 22px}.battery-facts{grid-template-columns:1fr 1fr;padding:18px}.cell-grid{padding:0 18px 20px}.cell{padding:12px 9px}.live-metric>strong{font-size:1.4rem}.battery-facts strong{font-size:1rem}.bms-state{padding:18px;gap:12px}.bms-state .right{margin-left:0}.live-footer{padding:18px}.energy-heading h2{font-size:1.2rem}.bms-temperatures{padding:0 18px 20px}}
