/* Individual site dashboard: inherits Customer Zone colours and typography. */
.site-dashboard{display:grid;gap:16px;color:var(--ink)}
.site-dashboard-head{display:flex;justify-content:space-between;align-items:start;gap:14px}
.site-dashboard-head h3{margin:5px 0 8px;font-size:clamp(22px,2.5vw,31px)}
.site-dashboard-head p:not(.eyebrow){color:var(--muted);font-size:12px;margin:0}
.site-dashboard-head button{background:#eff7f8;border:1px solid var(--line);color:var(--ink);white-space:nowrap}
.site-dashboard-toolbar{display:flex;gap:14px;justify-content:space-between;align-items:center;flex-wrap:wrap;border-bottom:1px solid var(--line);padding-bottom:12px}
.site-dashboard-tabs{display:flex;gap:6px;flex-wrap:wrap}
.site-dashboard-tabs button{background:#fff;border:1px solid var(--line);color:var(--ink);padding:9px 12px;font-size:12px}
.site-dashboard-tabs button.active{color:#fff;background:var(--teal);border-color:var(--teal)}
.site-dashboard-toolbar label{display:flex;align-items:center;gap:9px;margin:0;font-size:12px}
.site-dashboard-toolbar select{width:auto;min-width:130px;margin:0}
.site-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.site-kpi{min-width:0;background:var(--pale);border:1px solid var(--line);border-radius:4px;padding:15px}
.site-kpi span,.site-kpi small{display:block;font-size:11px;color:var(--muted);line-height:1.4}
.site-kpi strong{display:block;margin:10px 0;font:600 clamp(16px,1.7vw,24px) 'Space Grotesk',sans-serif;overflow-wrap:anywhere}
.site-section{border:1px solid var(--line);background:#fff;padding:17px;border-radius:5px;margin-top:14px;line-height:1.6}
.site-section h3{margin:0 0 15px;font-size:18px}
.site-section p{font-size:13px;color:var(--muted)}
.site-flow{display:grid;grid-template-columns:minmax(0,1fr) 22px minmax(0,1fr) 22px minmax(0,1fr);align-items:center;gap:6px}
.site-flow-node{background:#f4f8f9;padding:14px;border:1px solid var(--line);border-radius:5px;min-width:0}
.site-flow-node span,.site-flow-node small{display:block;font-size:11px;color:var(--muted)}
.site-flow-node strong{font:600 clamp(14px,2vw,22px) 'Space Grotesk',sans-serif;display:block;margin:10px 0;overflow-wrap:anywhere}
.site-flow-arrows{text-align:center;font-size:25px;color:#0e7180}
.site-flow-battery{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:10px}
.site-bar-chart{display:block;width:100%;max-height:290px}
.site-bar-chart text{font:11px 'DM Sans',sans-serif;fill:#738a91}
.site-bar-solar{fill:#17a59c}
.site-bar-load{fill:#287b99}
.site-bar-grid{fill:#e8ac62}
.site-chart-legend{display:flex;gap:16px;font-size:11px;color:var(--muted);margin-top:6px;flex-wrap:wrap}
.site-chart-legend span:before{content:'■';margin-right:5px}
.site-chart-legend span:first-child:before{color:#17a59c}
.site-chart-legend span:nth-child(2):before{color:#287b99}
.site-chart-legend span:nth-child(3):before{color:#e8ac62}
.site-muted,.site-disclaimer{font-size:12px;color:var(--muted);line-height:1.65}
.site-disclaimer{margin:3px 0}
.site-preview-warning,.site-error{padding:13px;background:#fff5df;border:1px solid #e2c78a;color:#765522;font-size:12px}
.site-error{background:#fff0ed;border-color:#deaa9b;color:#974435}
.site-empty-chart{padding:38px 15px;text-align:center;background:var(--pale);color:var(--muted);font-size:13px}
.site-two{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.site-dl{display:grid;grid-template-columns:1fr 1fr;gap:10px;font-size:12px}
.site-dl dt{color:var(--muted)}
.site-dl dd{margin:0;text-align:right;overflow-wrap:anywhere}
.site-coverage{display:grid;gap:9px}
.site-coverage>div{display:flex;justify-content:space-between;gap:12px;padding-bottom:8px;border-bottom:1px solid var(--line);font-size:12px}
.site-yes{color:#16794c}
.site-no{color:#9b5b3b}
.site-alert{border-left:3px solid var(--teal);padding:8px 12px;background:var(--pale)}
.portfolio-aside:has(.site-dashboard){grid-column:1/-1}
.portfolio-content:has(.site-dashboard){grid-template-columns:minmax(250px,.7fr) minmax(0,1.8fr)}
@media(max-width:1040px){.portfolio-content:has(.site-dashboard){grid-template-columns:1fr}.site-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:680px){.site-dashboard-head{flex-wrap:wrap}.site-kpis,.site-two{grid-template-columns:1fr 1fr}.site-flow{grid-template-columns:1fr}.site-flow-arrows{transform:rotate(90deg)}.site-dashboard-toolbar label{width:100%;justify-content:space-between}.site-dashboard-toolbar select{flex:1}.site-flow-node strong{font-size:18px}}
@media(max-width:420px){.site-kpis,.site-two{grid-template-columns:1fr}.site-kpi{padding:11px}.site-dl{grid-template-columns:1fr}}

/* Customer Zone white energy flow: no dark-surface dependencies. */
.wf-layout{display:grid;grid-template-columns:minmax(0,2.4fr) minmax(275px,.95fr);border:1px solid #dbe6ec;border-radius:18px;overflow:hidden;background:#fff;box-shadow:0 12px 36px #173b4a09;margin:12px 0 20px;color:#142b38}
.wf-panel{position:relative;min-width:0;padding:22px;background:radial-gradient(circle at 49% 45%,#ebf9f1 0%,#fff 53%);overflow:hidden}
.wf-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:14px}
.wf-heading h3{margin:0 0 4px;font:700 clamp(18px,2vw,24px) 'Space Grotesk',sans-serif}
.wf-heading p,.wf-footnote{font-size:11px;line-height:1.55;color:#647987;margin:0}
.wf-status{font-size:10px;color:#0e796e;background:#e7f8f0;border:1px solid #cbeadd;padding:5px 9px;border-radius:100px;white-space:nowrap}
.wf-top-grid{display:grid;grid-template-columns:1fr 1.3fr 1fr;align-items:center;gap:6px;position:relative;z-index:1;margin-top:20px}
.wf-zone{min-width:0;text-align:center}
.wf-source>span{font-size:11px;letter-spacing:1.3px;font-weight:700;display:block}
.wf-source>strong{font:650 clamp(18px,2.65vw,36px) 'Space Grotesk',sans-serif;display:block;margin:7px 0}
.wf-source>small,.wf-site>small{font-size:10px;color:#627888;display:block;line-height:1.5}
.wf-solar .wf-source>span{color:#188544}.wf-grid .wf-source>span{color:#217fc5}.wf-battery .wf-source>span{color:#a66c0d}
.wf-zone img{display:block;width:100%;max-width:250px;height:160px;object-fit:contain;margin:5px auto;filter:drop-shadow(0 12px 12px #142e3420)}
.wf-site{align-self:center}.wf-site .wf-halo{border-radius:50%;background:radial-gradient(ellipse,#dcf8e9,transparent 75%)}.wf-site img{max-width:320px;height:200px}
.wf-site>strong{font-size:13px;display:block;margin-top:4px}.wf-site>span{font-size:10px;letter-spacing:1.5px;display:block;margin:5px 0}.wf-site>b{font:700 clamp(21px,3vw,40px) 'Space Grotesk',sans-serif;display:block}
.wf-daily{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:10px 12px;border:1px solid #dce9e9;background:#f8fbfc;border-radius:10px;font-size:11px;line-height:1.4}.wf-daily strong{font-size:12px;text-align:right}.wf-solar .wf-daily{background:#f0fcf3;border-color:#d8f0db}.wf-grid .wf-daily{background:#eff8ff;border-color:#d5eaf9}
.wf-lines{position:absolute;inset:0;pointer-events:none;z-index:0}.wf-lines span{position:absolute;border-radius:20px;opacity:.5}.wf-line-solar{top:39%;left:22%;width:16%;border-top:3px dashed #32bc68}.wf-line-grid{top:39%;right:21%;width:14%;border-top:3px dashed #299de0}.wf-line-battery{top:74%;left:24%;width:13%;border-top:3px dashed #e5ac39}
.wf-bottom-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:center;margin-top:12px;position:relative;z-index:1}.wf-battery{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:2px;text-align:left}.wf-battery .wf-source{grid-column:1/-1}.wf-battery img{height:120px;max-width:170px;margin:0}.wf-soc{font-size:11px;color:#627888}.wf-soc strong{font:700 22px 'Space Grotesk',sans-serif;display:block;color:#174b34;margin-top:5px}
.wf-counter-stack{display:grid;gap:7px}.wf-footnote{margin-top:15px;border-top:1px solid #e5edef;padding-top:12px}
.wf-side{border-left:1px solid #e0e9ec;background:#fbfdfd;padding:24px 22px;display:flex;flex-direction:column;gap:20px}
.wf-live>span{font-size:11px;font-weight:800;letter-spacing:1.4px}.wf-live>strong{display:block;font:700 clamp(26px,3vw,46px) 'Space Grotesk',sans-serif;color:#087d72;margin:6px 0}.wf-live>p,.wf-share>p,.wf-billing>p,.wf-billing small{font-size:11px;color:#556c77;line-height:1.6;margin:6px 0}
.wf-share{padding-top:17px;border-top:1px solid #e0e8eb}.wf-share-head{display:flex;justify-content:space-between;gap:8px;align-items:baseline}.wf-share-head strong{font-size:12px;line-height:1.4}.wf-share-head b{font-size:13px;color:#126d56;white-space:nowrap}
.wf-meter{height:8px;border-radius:30px;background:#e3ebed;overflow:hidden;margin:10px 0}.wf-meter span{height:100%;display:block;border-radius:30px;transition:width .3s ease}
.wf-peak .wf-share-head b{color:#a66c0d}.wf-billing{margin-top:auto;border:1px solid #d2ebd9;background:#f0faf3;padding:17px;border-radius:12px}.wf-billing>strong{font-size:14px}.wf-billing button{border-radius:8px;background:#0d766a!important;color:#fff!important;border:none;padding:10px 13px;font-size:12px;font-weight:700;cursor:pointer;margin:8px 0}.wf-billing small{display:block}
@media(max-width:1100px){.wf-layout{grid-template-columns:1fr}.wf-side{border-left:0;border-top:1px solid #e0e9ec;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.wf-billing{margin-top:0}}
@media(max-width:650px){.wf-panel{padding:15px}.wf-top-grid{grid-template-columns:1fr 1fr;row-gap:20px}.wf-site{grid-column:1/-1;grid-row:1}.wf-site img{height:155px}.wf-zone img{height:105px}.wf-site .wf-halo img{height:170px}.wf-line-solar,.wf-line-grid,.wf-line-battery{display:none}.wf-bottom-grid{grid-template-columns:1fr}.wf-side{grid-template-columns:1fr;padding:16px}.wf-heading{flex-wrap:wrap}.wf-source>strong{font-size:23px}.wf-daily{display:grid;gap:4px}.wf-daily strong{text-align:left}}
@media(prefers-reduced-motion:reduce){.wf-meter span{transition:none}}

/* Timestamped time-series and discreet commissioning access */
.site-line-chart{display:block;width:100%;height:auto;max-height:320px;overflow:visible}
.site-line-chart text{font:11px 'DM Sans',sans-serif;fill:#667d89}
.site-trend-head{display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:12px}
.site-trend-head strong{font-size:14px}
.site-trend-head span{font-size:11px;color:#607984}
.site-trend-legend{display:flex;flex-wrap:wrap;gap:15px;margin:10px 0}
.site-trend-legend span{display:inline-flex;align-items:center;gap:6px;font-size:11px;color:#526b75}
.site-trend-legend i{width:18px;height:3px;display:inline-block;border-radius:4px}
.site-diagnostic-actions{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.site-debug{font-size:11px;color:#728791}
.site-debug summary{cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.site-debug button{display:block;margin:8px 0;font-size:11px;background:#eff4f5;color:#385767;border:1px solid #d3e0e5;padding:6px 9px}
.site-debug pre{white-space:pre-wrap;overflow-wrap:anywhere;max-width:100%;font-size:10px;max-height:260px;overflow:auto;background:#f6f8f9;padding:10px;border-radius:6px}
/* Discrete moving energy in a white surface; zero/unknown readings stay idle */
.wf-line-solar,.wf-line-grid,.wf-line-battery{border:0!important;height:4px;opacity:.25!important;background:repeating-linear-gradient(90deg,#a1adb1 0 7px,transparent 7px 20px)}
.wf-line-solar.wf-active{opacity:.9!important;background:repeating-linear-gradient(90deg,#21bc69 0 8px,transparent 8px 23px)}
.wf-line-grid.wf-active{opacity:.9!important;background:repeating-linear-gradient(90deg,#2c9ce5 0 8px,transparent 8px 23px)}
.wf-line-battery.wf-active{opacity:.9!important;background:repeating-linear-gradient(90deg,#e5a826 0 8px,transparent 8px 23px)}
.wf-lines .wf-active{background-size:23px 4px;animation:wf-electric-flow 1.5s linear infinite}
.wf-lines .wf-reverse{animation-direction:reverse}
@keyframes wf-electric-flow{to{background-position:23px 0}}
@media(prefers-reduced-motion:reduce){.wf-lines .wf-active{animation:none}}

.site-auto-collect{display:inline-flex!important;align-items:center;gap:8px;font-size:11px!important;color:#526c77;cursor:pointer}
.site-auto-collect input{width:15px;height:15px;accent-color:#127c74;margin:0!important}
.wf-insight{background:#eff7fa;border:1px solid #d4e8ed;border-radius:12px;padding:15px}
.wf-insight strong{font-size:13px}
.wf-insight p{font-size:11px;line-height:1.6;margin:7px 0 0;color:#566b79}
