:root{font-family:Inter,Segoe UI,system-ui,sans-serif;color:#203d36;background:#f5f7f3;font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button,a,input,select{outline-offset:4px}button{cursor:pointer}button:disabled{opacity:.55;cursor:wait}[hidden]{display:none!important}.topbar{height:84px;border-bottom:1px solid #dfe6dd;display:flex;align-items:center;justify-content:space-between;padding:0 5vw;background:#fafbf8}.brand{display:flex;gap:12px;align-items:center;font-size:12px;letter-spacing:2px;font-weight:750;text-decoration:none;color:#203d36}.brandmark{display:grid;place-items:center;width:32px;height:32px;border-radius:10px;background:#294d40;color:#e9f3dc;font-size:26px;font-style:italic;letter-spacing:-3px;padding-right:4px}nav{display:flex;height:100%;gap:36px}.nav{border:0;background:transparent;color:#77867b;font-size:14px;padding:0 4px;border-bottom:3px solid transparent}.nav.active{border-color:#294d40;color:#203d36;font-weight:650}.private-badge{font-size:12px;display:flex;gap:8px;align-items:center;color:#687e70}.dot{display:inline-block;width:7px;height:7px;background:#75a088;border-radius:50%;margin-right:5px}main{max-width:1450px;margin:auto;padding:40px 5vw 0}.page-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:28px}.eyebrow{font-size:10px;letter-spacing:2.2px;font-weight:650;color:#83917b;margin:0 0 10px}h1{font-size:40px;letter-spacing:-1.7px;font-weight:500;margin:0 0 9px}.title-dot{color:#9bb47b}#page-subtitle{color:#7b8b7e;font-size:13px;margin:0}.heading-actions{display:flex;align-items:center;gap:12px}.badge{font-size:10px;font-weight:600;padding:7px 10px;border:1px solid #dce5d8;border-radius:20px;background:#f6f8f2;color:#6c7f68;white-space:nowrap}.icon-button{font-size:23px;border:1px solid #dce5d8;border-radius:50%;width:36px;height:36px;color:#496451;background:transparent}.access{background:#eaf0e3;display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:16px 20px;border-radius:12px;margin-bottom:24px}.access strong{font-size:13px;display:block}.access span{display:block;color:#73836d;font-size:11px;margin-top:4px}.access input{margin-left:auto;max-width:270px;font-size:12px;background:#f9fcf6}.access p{margin:0;font-size:12px;width:100%;color:#a24e32}.primary,.secondary,.danger-button{border:0;border-radius:7px;padding:11px 18px;font-size:12px}.primary{background:#294d40;color:#f2f6ec}.secondary{background:#edf2e8;color:#456047}.danger-button{background:#964b39;color:white}.overview-layout{display:grid;grid-template-columns:minmax(0,1fr) 290px;gap:24px}.scene-panel{background:radial-gradient(ellipse at 45% 45%,#f6f8ea 0%,#e7eee2 52%,#dce8df 100%);border:1px solid #dae4d6;border-radius:16px;overflow:hidden;display:flex;flex-direction:column;min-height:620px}.scene-top{display:flex;align-items:center;justify-content:space-between;padding:22px 24px;color:#657e69;font-size:11px;gap:10px}.scene-caption{font-size:9px;letter-spacing:2px;color:#98a58e}.energy-scene{position:relative;flex:1;min-height:500px}.house{width:100%;height:100%;position:absolute;inset:0}.track{stroke:#8caa94;opacity:.4}.flow{stroke:#4e9576;stroke-dasharray:6 12;opacity:0}.flow.active{opacity:.85;animation:flow 1.8s linear infinite}.flow.reverse{animation-direction:reverse}@keyframes flow{to{stroke-dashoffset:-36}}.scene-reading{position:absolute;display:flex;flex-direction:column;gap:4px;z-index:1}.metric-label{font-size:9px;letter-spacing:1.3px;font-weight:650;color:#70836e}.scene-reading strong{font-size:29px;font-weight:500;letter-spacing:-1.2px;line-height:1.1}.scene-reading small{font-size:15px;font-weight:400;letter-spacing:0;color:#7b8a73}.scene-reading>span:last-child{font-size:10px;color:#84917d;max-width:170px}.solar-reading{left:35%;top:3%}.solar-reading strong{color:#4d7450}.home-reading{left:5%;top:47%}.grid-reading{right:4%;top:30%}.battery-reading{left:47%;bottom:0}.car-reading{right:4%;bottom:1%}.scene-footer{display:flex;justify-content:space-between;padding:20px 24px;font-size:10px;color:#7d8e7b;gap:12px}.status-sidebar{display:flex;flex-direction:column;gap:17px}.status-sidebar section{border-radius:12px;border:1px solid #e0e7dc;background:#fcfdf9;padding:20px}h2{font-size:13px;font-weight:600;margin:0}.card-top{display:flex;align-items:center;justify-content:space-between;gap:8px}.battery-card{background:#f0f3e9!important}.battery-summary{display:flex;align-items:center;justify-content:space-between;margin:16px 0}.battery-summary strong{font-size:50px;font-weight:450;letter-spacing:-2px}.battery-summary small{font-size:22px;color:#92a185;margin-left:4px}.battery-summary svg{height:72px;width:50px;color:#7a9e6b;fill:currentColor}.battery-bottom{display:flex;justify-content:space-between;font-size:10px;color:#7a8b70}.muted{font-size:9px;color:#8a9882}.solar-input{padding:14px 0;border-bottom:1px solid #e9eee3;display:grid;grid-template-columns:26px 1fr auto;align-items:center;gap:8px}.solar-input:last-child{border-bottom:0;padding-bottom:2px}.solar-icon{font-size:17px;color:#a5ae73}.solar-input strong{font-size:11px;font-weight:500}.solar-input small{display:block;font-size:9px;color:#909b88;margin-top:3px}.solar-input .input-value{font-size:13px;font-weight:600;color:#54744e}.card-note{font-size:9px;line-height:1.6;color:#96a08d;margin:15px 0 0}.snapshot-card>div{display:flex;justify-content:space-between;font-size:11px;margin-top:17px;color:#85917d}.snapshot-card strong{font-size:12px;color:#456449;font-weight:500}.overview-note{font-size:10px;color:#91a088;line-height:1.7;margin:17px 0 28px}.report-section{padding:24px;background:#fcfdf9;border:1px solid #e0e7dc;border-radius:12px;margin-bottom:20px}.filters,.actions{display:flex;align-items:center;gap:16px;flex-wrap:wrap}label{font-size:12px;display:flex;flex-direction:column;gap:7px}input,select{border:1px solid #d6e1d0;border-radius:6px;background:#fff;padding:10px;color:#3f5c43}#load{align-self:end}.report-status{font-size:12px;color:#75836b;padding:10px 0}.actions h2{margin-right:auto}.hint{color:#8a9680;font-size:11px;line-height:1.7}.scroll{overflow:auto}table{border-collapse:collapse;width:100%;font-size:11px}td,th{text-align:left;padding:14px 10px;border-bottom:1px solid #e7eddf}th{white-space:nowrap;font-weight:600;background:#f2f5ec}.danger{font-size:12px;color:#8c6d56}.danger summary{cursor:pointer;font-weight:600}.danger p{line-height:1.7}#confirmation{max-width:220px;margin:10px 0}footer{border-top:1px solid #e0e6db;padding:24px 0;display:flex;justify-content:space-between;font-size:9px;letter-spacing:1.4px;color:#a0ab93}footer span{letter-spacing:0}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@media(min-width:1400px){.scene-panel{min-height:710px}.energy-scene{min-height:590px}.scene-reading strong{font-size:34px}}@media(max-width:1000px){main{padding:28px 24px 0}.topbar{padding:0 24px}.overview-layout{grid-template-columns:minmax(0,1fr) 245px;gap:16px}.scene-panel{min-height:570px}.energy-scene{min-height:465px}.scene-reading strong{font-size:25px}.scene-reading>span:last-child{font-size:9px;max-width:125px}.metric-label{font-size:8px}.status-sidebar section{padding:16px}}@media(max-width:760px){.topbar{height:70px;padding:0 20px}.brand{font-size:9px;letter-spacing:1px}.private-badge{display:none}nav{gap:20px}main{padding:26px 16px 0}h1{font-size:33px}.overview-layout{grid-template-columns:1fr}.scene-panel{min-height:560px}.energy-scene{min-height:460px}.status-sidebar{display:grid;grid-template-columns:1fr 1fr}.solar-card{grid-row:span 2}.battery-summary strong{font-size:40px}.snapshot-card>div{font-size:10px}.scene-reading strong{font-size:27px}.scene-reading>span:last-child{max-width:120px}.scene-top,.scene-footer{padding:18px}.access input{margin-left:0;max-width:none;flex:1;min-width:130px}.access>div{width:100%}.heading-actions .badge{font-size:8px}.page-heading{gap:10px}#page-subtitle{font-size:11px}.solar-reading{left:35%;top:2%}.home-reading{left:4%;top:40%}.grid-reading{right:3%;top:25%}.battery-reading{left:37%;bottom:1%}.car-reading{right:3%;bottom:1%}footer{font-size:8px;letter-spacing:.5px}}@media(prefers-reduced-motion:reduce){.flow.active{animation:none}}

/* Approved scene: artwork stays unchanged; routes and readings are live overlays. */
.overview-layout{align-items:start;grid-template-columns:minmax(0,1fr) 270px}
.scene-panel{min-height:0;background:#eeeede}.scene-scroll{overflow-x:auto}.energy-scene{width:100%;min-width:680px;min-height:0;aspect-ratio:3/2;flex:none}.house{width:100%;height:100%}
.connection-underlay{fill:none;stroke:#fff;stroke-width:7;opacity:.82;stroke-linejoin:round;stroke-linecap:round}
.connection-track{fill:none;stroke-width:3;opacity:.57;stroke-linejoin:round;stroke-linecap:round}
.solar-line{stroke:#c29335}.grid-line{stroke:#5989ad}.battery-line{stroke:#9574b8}.car-line{stroke:#348b7b}.home-line{stroke:#547b55}
.flow{fill:none;stroke-width:3.5;stroke-dasharray:6 13;stroke-linejoin:round;stroke-linecap:round}.flow.active{opacity:1;animation:flow 1.6s linear infinite}.flow.reverse{animation-direction:reverse}
@keyframes flow{to{stroke-dashoffset:-38}}
.inverter-node{fill:#fff;stroke:#547b55;stroke-width:3}.inverter-caption{position:absolute;left:10.5%;top:40%;font-size:9px;letter-spacing:1px;color:#3d594a;background:#fffffff0;border:1px solid #dbe2d2;padding:5px 8px;border-radius:5px}
.scene-reading{background:#fffffff0;border:1px solid #dde2d2;border-radius:8px;padding:9px 11px;box-shadow:0 4px 14px #34472b08;gap:3px;max-width:190px}.scene-reading strong{font-size:clamp(19px,1.9vw,28px)}.scene-reading small{font-size:12px}.scene-reading .metric-label{font-size:8px}.scene-reading>span:last-child{font-size:9px;max-width:170px}
.solar-reading{left:52%;top:9%}.home-reading{left:30%;top:68%}.grid-reading{left:2%;right:auto;top:12%}.battery-reading{left:12%;top:64%;bottom:auto}.car-reading{left:60%;right:auto;top:85%;bottom:auto}
.array-label{position:absolute;z-index:2;display:flex;flex-direction:column;gap:3px;padding:6px 8px;border-radius:6px;background:#fffffff0;border:1px solid #e2dec7;box-shadow:0 3px 10px #34472b06;white-space:nowrap}.array-label>span{font-size:7px;letter-spacing:.8px;color:#8f895c;font-weight:650}.array-label>strong{font-size:14px;color:#786c36;font-weight:550}
.array-0{left:26%;top:19%}.array-1{left:39%;top:42%}.array-2{left:57%;top:46%}.array-3{left:82%;top:27%}.scene-footer{background:#f2f2e6;font-size:9px}
.account-menu{display:flex;gap:16px;align-items:center}.logout-button{border:1px solid #d9e2d0;background:transparent;color:#6b7e64;border-radius:6px;padding:7px 12px;font-size:11px}
@media(max-width:1000px){.overview-layout{grid-template-columns:minmax(0,1fr) 230px}.scene-reading strong{font-size:21px}}
@media(max-width:760px){.overview-layout{grid-template-columns:1fr}.energy-scene{min-width:680px}.scene-reading strong{font-size:21px}.private-badge{display:none}.account-menu{gap:0}.logout-button{padding:6px;font-size:10px}.topbar{gap:15px}.brand{font-size:8px}nav{gap:15px}.scene-top{font-size:10px}.scene-caption{font-size:8px}.status-sidebar{grid-template-columns:1fr 1fr}}
@media(prefers-reduced-motion:reduce){.flow.active{animation:none}}

/* Keep the lower readings in separate columns, clear of the Tesla. */
.battery-reading{left:2%;top:65%;width:19%;max-width:none}
.home-reading{left:23%;top:73%;width:18.5%;max-width:none}
.battery-reading>span:last-child,.home-reading>span:last-child{max-width:100%;overflow-wrap:anywhere}
.scene-reading #solar-power{font-size:10px;color:#70836e}
/* Connection overlays are removed for this version; readings stay visible. */
.energy-overview{margin-bottom:32px}.energy-heading{display:flex;justify-content:space-between;gap:24px;align-items:flex-start}.energy-heading h2{font-size:27px;letter-spacing:-.8px;font-weight:500}.energy-heading p{font-size:13px;color:#70806f}.energy-summary{text-align:right;display:flex;flex-direction:column;gap:5px}.energy-summary strong{font-size:28px;font-weight:500;white-space:nowrap}.energy-summary span{font-size:11px;color:#70806f}.energy-controls{display:flex;gap:10px;align-items:flex-end;flex-wrap:wrap;margin:24px 0 12px}.energy-controls label{font-size:11px;color:#64755e;display:flex;flex-direction:column;gap:7px}.energy-controls select,.energy-controls input:not([type=checkbox]){background:#fff;border:1px solid #dbe3d5;color:#294d40;padding:10px;border-radius:6px;min-height:39px}.energy-controls input[type=number]{max-width:105px}.energy-controls .energy-check{flex-direction:row;align-items:center;align-self:center;margin-left:auto;gap:7px}.energy-quality{background:#f3f1e5;padding:11px 14px;border-radius:7px;font-size:12px;color:#776537;line-height:1.6}.energy-legend{display:flex;flex-wrap:wrap;gap:8px;margin:17px 0}.energy-legend-button{background:transparent;border:1px solid #dce5d8;border-radius:20px;color:#496047;padding:7px 11px;font-size:11px}.energy-legend-button::before{content:'';display:inline-block;width:8px;height:8px;border-radius:3px;margin-right:6px;background:#d3a847}.energy-colour-1::before{background:#467b63}.energy-colour-2::before{background:#7999b7}.energy-colour-3::before{background:#b38f9a}.energy-legend-button[aria-pressed=false]{opacity:.45;text-decoration:line-through}.energy-chart-scroll{overflow-x:auto;margin-left:-4px}#energy-chart{min-width:660px}#energy-chart svg{display:block;width:100%;min-height:250px}.energy-grid{stroke:#e5eae0;stroke-width:1}.energy-axis{fill:#788772;font-size:10px}.energy-future{opacity:.45}.energy-missing{fill:#fafbf8;stroke:#b0baaa;stroke-width:1.2}.energy-bar-group{cursor:pointer}.energy-bar-group:focus{outline:2px solid #547b55;outline-offset:2px}.energy-detail{white-space:pre-line;background:#f3f6ef;border:1px solid #e1e7da;padding:14px 16px;border-radius:8px;font-size:12px;line-height:1.7;min-height:55px}.energy-data-table{font-size:12px;margin:18px 0}.energy-data-table summary{cursor:pointer;color:#496451}.energy-report-heading{font-size:25px;font-weight:500;letter-spacing:-.6px;margin:26px 0 18px}.energy-scroll-hint{margin-top:0}@media(max-width:760px){.energy-heading{flex-direction:column;gap:10px}.energy-summary{text-align:left}.energy-controls .energy-check{margin-left:0;width:100%}.energy-overview{padding:18px!important}.energy-heading h2{font-size:24px}}
.configuration-card{max-width:850px}.configuration-card p{line-height:1.65;color:#65735e}.configuration-card form{display:grid;gap:16px;max-width:360px;margin:25px 0}.configuration-card label{display:block;margin-bottom:8px}.configuration-card select,.configuration-card input{width:100%;box-sizing:border-box;padding:12px;border:1px solid #d5dfcd;border-radius:6px;background:#fff;color:#34472b}.collection-details{display:grid;grid-template-columns:190px 1fr;gap:12px;font-size:13px;margin:30px 0}.collection-details dt{color:#65735e}.collection-details dd{margin:0;overflow-wrap:anywhere}#fetch-status{max-width:65%;line-height:1.5}button:disabled{opacity:.6;cursor:wait}@media(max-width:760px){nav{gap:10px}.topbar{flex-wrap:wrap;height:auto;min-height:80px;padding:12px}.collection-details{grid-template-columns:1fr}.collection-details dd{margin-bottom:10px}.heading-actions{flex-wrap:wrap}}
/* Keep navigation accessible while the document scrolls. */
html{scroll-padding-top:100px}
.topbar{position:sticky;top:0;z-index:20;box-shadow:0 2px 8px #203d360d}
footer{flex-wrap:wrap;gap:10px}
#app-version{overflow-wrap:anywhere;letter-spacing:0}
@media(max-width:760px){
 html{scroll-padding-top:150px}
 .topbar nav{order:3;flex-basis:100%;height:44px;justify-content:center;gap:24px}
 .topbar .nav{min-height:44px;white-space:nowrap}
}