/* ES01C: one continuous energy scene, scoped to Environmental HHO Details. */
.hes{--hes-line:#28576b;--hes-bg:#031c2a;--hes-muted:#a7c6d6;--hes-cyan:#7be6fd;--hes-gold:#f5c466;--hes-green:#81eab3;color:#e6f6ff;border:1px solid var(--hes-line);background:var(--hes-bg);margin:22px 0;container:hes / inline-size;font-family:var(--eco-font-body,'Chakra Petch','Segoe UI',sans-serif);overflow:hidden}
.hes *{box-sizing:border-box}.hes [hidden]{display:none!important}.hes button,.hes input{font:inherit}.hes button{cursor:pointer}.hes button:disabled{cursor:default;opacity:.55}.hes button:focus-visible,.hes a:focus-visible,.hes summary:focus-visible,.hes input:focus-visible{outline:2px solid #c1f5ff;outline-offset:3px}.hes button,.hes input,.hes a{touch-action:manipulation}.hes p{line-height:1.5}.hes h2,.hes h3{font-family:var(--eco-font-body,'Chakra Petch','Segoe UI',sans-serif)!important;color:#eefaff!important}
.hes-heading{display:flex;justify-content:space-between;align-items:center;gap:18px;padding:22px 24px;background:linear-gradient(110deg,#10384b,#052131);border-top:2px solid #6cdcee;border-bottom:1px solid var(--hes-line)}.hes-eyebrow{color:var(--hes-cyan);font-size:10px;font-weight:650;letter-spacing:.12em}.hes-heading h2{font-size:27px!important;line-height:1.2!important;margin:6px 0!important;font-weight:600!important}.hes-heading p{margin:0;font-size:13px;color:var(--hes-muted)}
.hes-toolbar{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 24px;border-bottom:1px solid #28576b77;background:#072230}.hes-apps{display:flex;gap:4px;border:1px solid #35687b;padding:4px}.hes-apps button{border:1px solid transparent;background:transparent;padding:8px 20px;text-align:left;color:#9cc1d3;font-weight:600;min-height:44px;white-space:nowrap}.hes-apps button[aria-selected=true]{border-color:#65c5d7;background:linear-gradient(115deg,#195266,#0c3446);color:#f1fcff}.hes-apps small{display:block;font-weight:400;font-size:10px;color:#abd4e3;margin-top:3px}.hes-legend{display:flex;gap:14px;flex-wrap:wrap;color:#b5d1de;font-size:11px}.hes-legend span{display:flex;align-items:center;gap:6px;white-space:nowrap}.hes-legend i{width:14px;height:3px;background:var(--tone)}.hes [data-tone=fuel]{--tone:#f5c466}.hes [data-tone=power]{--tone:#78d9ff}.hes [data-tone=hho]{--tone:#81eab3}.hes [data-tone=work]{--tone:#f2f6f8}.hes-playback{display:flex;gap:6px;flex:none}.hes-playback button{border:1px solid #3d7086;background:#082c3d;color:#caefff;padding:9px 12px;min-height:40px;font-size:12px}
.hes-story{display:flex;align-items:center;gap:14px;padding:16px 24px 0;min-height:77px;background:#031c2a}.hes-story>span:first-child{font:500 19px Orbitron,monospace;color:var(--hes-gold);border-left:2px solid var(--hes-gold);padding:7px 10px}.hes-story h3{font-size:18px!important;margin:0 0 4px!important;line-height:1.2!important;font-weight:500!important}.hes-story p{margin:0;font-size:12px;color:var(--hes-muted)}.hes-motion-note{margin-left:auto;font-size:10px;color:#7ba2b5;white-space:nowrap;align-self:flex-start;padding-top:5px}
.hes-scene{position:relative;background:#031c2a;isolation:isolate}.hes-scene canvas{display:block;width:100%;aspect-ratio:1600/680}.hes-art-status{position:absolute;inset:0;display:grid;place-items:center;pointer-events:none;color:#a6cada;background:#031c2a}.hes-hotspots{position:absolute;inset:0;pointer-events:none}.hes-hotspots button{position:absolute;pointer-events:auto;min-width:28px;min-height:28px;border:1px solid transparent;background:transparent;color:#d8f5ff;border-radius:5px;outline-offset:-2px}.hes-hotspots button:hover,.hes-hotspots button:focus-visible,.hes-hotspots button[aria-expanded=true]{border-color:#9ee9f6;background:#99e8fa0b;box-shadow:0 0 18px -9px #98eaf6}.hes-hotspots button>span{opacity:0;position:absolute;bottom:0;left:0;min-width:130px;background:#062533ed;border:1px solid #487c8c;padding:5px 8px;white-space:nowrap;font-size:11px}.hes-hotspots button:hover>span,.hes-hotspots button:focus-visible>span{opacity:1}.hes-hotspots button>span b{margin-left:10px}.hes.art-failed .hes-hotspots{display:none}
.hes-cycle{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-block:1px solid var(--hes-line);background:#072632}.hes-cycle button{position:relative;display:flex;align-items:center;gap:10px;min-width:0;padding:16px 18px;color:#95b8c9;background:transparent;border:0;font-size:12px;text-align:left;min-height:53px}.hes-cycle button+button{border-left:1px solid var(--hes-line)}.hes-cycle b{font:10px Orbitron,monospace;flex:none;white-space:nowrap}.hes-cycle button[aria-pressed=true]{color:#edfaff;background:#113a45}.hes-cycle button[aria-pressed=true] b{color:var(--hes-green)}.hes-cycle i{position:absolute;height:2px;bottom:0;left:0;width:var(--progress,0%);background:var(--hes-green)}
.hes-inspector{display:grid;grid-template-columns:auto 1fr 36px;align-items:center;gap:18px;background:#103747;border-bottom:1px solid #4f8796;padding:18px 24px}.hes-inspector img{width:125px;height:130px;object-fit:contain}.hes-inspector h3{font-size:20px!important;margin:5px 0!important}.hes-inspector p{font-size:13px;color:#bdd7e3;margin:5px 0 10px}.hes-inspector a{color:#9ce5f6;font-size:12px}.hes-inspector button{border:1px solid #477585;color:#b9e8f9;background:transparent;font-size:23px;min-height:36px;align-self:start}.hes-inspector>div:first-child{grid-column:1/3}
.hes-comparison{padding:22px 24px;background:linear-gradient(115deg,#082633,#041d2a)}.hes-comparison-heading{display:flex;align-items:center;justify-content:space-between;gap:15px}.hes-comparison h3{margin:5px 0 16px!important;font-size:22px!important;font-weight:500!important;line-height:1.2!important}.hes-projected{font-size:10px;color:#a5dec6;border:1px solid #376857;padding:5px 9px;letter-spacing:.05em}
.hes-inputs{display:grid;grid-template-columns:1fr 1fr 1.5fr auto;gap:16px;align-items:end}.hes-inputs>label,.hes-reduction>label{font-size:12px;color:#c3deea;display:block}.hes-inputs label>span{font-size:10px;color:#8eb5c6;margin-left:6px}.hes-inputs input[type=number]{display:block;width:100%;min-width:0;min-height:42px;border:1px solid #345f75;border-radius:0;padding:8px 10px;margin-top:7px;background:#031824;color:#eefaff;font-size:16px}.hes-inputs input[aria-invalid=true]{border-color:#efb06f}.hes-inputs input::placeholder{color:#7394a8;font-size:13px}.hes-reduction>div{display:grid;grid-template-columns:85px minmax(0,1fr);gap:12px;align-items:center}.hes-reduction input[type=range]{width:100%;accent-color:#83e8b9;margin:7px 0 0;min-width:0}.hes-inputs button{height:42px;min-width:125px}.hes-validation{font-size:12px;color:#f2c594;margin:10px 0 0}
.hes-results{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(270px,1fr);gap:24px;align-items:center;margin-top:22px}.hes-bar-heading{display:grid;grid-template-columns:1fr auto auto;align-items:baseline;gap:12px;font-size:12px;margin-bottom:8px;color:#c4dce7}.hes-bar-heading>strong{font:500 17px Orbitron,monospace;color:#e9faff}.hes-bar-heading>small{font-size:12px;min-width:75px;text-align:right;color:#a5c8d8}.hes-bar-heading span small{color:#81bdac;margin-left:6px;font-size:10px}.hes-bar-track{display:flex;width:100%;height:12px;background:#0b3546;border:1px solid #306078;overflow:hidden;margin-bottom:16px}.hes-bar-track>span{height:100%;width:0;transition:width .45s ease}.hes-before{background:linear-gradient(90deg,#96672d,#f4c26a)}.hes-after{background:linear-gradient(90deg,#286b54,#8aefb8)}.hes-saved{background:repeating-linear-gradient(130deg,#3b665a 0 2px,transparent 2px 6px);border-left:1px solid #9bdfbb}.hes-savings{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0;margin:0;border-left:1px solid var(--hes-line);padding-left:24px}.hes-savings>div{min-width:0;padding:10px 12px}.hes-savings dt{font-size:11px;font-weight:400;color:#a4c8d6;margin-bottom:10px}.hes-savings dd{font:500 22px/1.4 Orbitron,monospace;color:#a9f1c9;margin:0;overflow-wrap:anywhere;font-variant-numeric:tabular-nums}
.hes-comparison-footer{display:flex;justify-content:space-between;gap:16px;align-items:baseline;font-size:11px;color:#9dbfce}.hes-comparison-footer p{margin:4px 0 0}.hes-comparison-footer a{color:#a8e4f7;white-space:nowrap}.hes-footer{padding:12px 24px;display:flex;justify-content:space-between;align-items:baseline;gap:20px;border-top:1px solid var(--hes-line);font-size:11px;color:#83abbe}.hes-footer>p{margin:0}.hes-footer>p span{padding:0 5px}.hes-footer details{max-width:80ch}.hes-footer summary{color:#acd7e9;cursor:pointer;white-space:nowrap}.hes-footer details p{font-size:12px;margin:10px 0}.hes-footer details a{color:#a3dbea}.hes-no-script{padding:14px 24px;font-size:13px}
@container hes (max-width:1050px){.hes-toolbar{flex-wrap:wrap;gap:10px 16px}.hes-legend{order:3;width:100%;justify-content:center;border-top:1px solid #28576b66;padding-top:10px}.hes-inputs{grid-template-columns:1fr 1fr 1.5fr}.hes-inputs button{grid-column:3;justify-self:end}.hes-results{grid-template-columns:minmax(0,1.5fr) minmax(250px,1fr);gap:15px}.hes-savings{padding-left:12px}.hes-savings dd{font-size:19px}.hes-heading{flex-wrap:wrap}}
@container hes (max-width:650px){.hes-heading{padding:18px 14px;gap:12px}.hes-heading h2{font-size:24px!important}.hes-toolbar{padding:12px}.hes-apps{flex:1}.hes-apps button{padding:7px 11px;flex:1;font-size:13px}.hes-apps small{font-size:9px}.hes-playback button{padding:9px;min-height:43px}.hes-legend{gap:10px;font-size:10px}.hes-story{padding:14px 14px 0;gap:9px;min-height:94px;align-items:flex-start}.hes-story h3{font-size:16px!important}.hes-story p{font-size:11px;line-height:1.4}.hes-motion-note{display:none}.hes-story>span:first-child{font-size:15px;padding:5px 7px}.hes-scene canvas{aspect-ratio:900/830}.hes-cycle{grid-template-columns:repeat(2,minmax(0,1fr))}.hes-cycle button{padding:12px;font-size:11px}.hes-cycle button:nth-child(3){border-left:0;border-top:1px solid var(--hes-line)}.hes-cycle button:nth-child(4){border-top:1px solid var(--hes-line)}.hes-comparison{padding:18px 14px}.hes-comparison h3{font-size:21px!important}.hes-inputs{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.hes-reduction{grid-column:1/-1}.hes-inputs button{grid-column:2;min-width:0;max-width:100%}.hes-results{grid-template-columns:1fr;gap:2px;margin-top:18px}.hes-savings{border-left:0;border-top:1px solid var(--hes-line);padding:8px 0;gap:10px}.hes-savings>div{padding:6px 0}.hes-savings dd{font-size:20px}.hes-bar-heading{gap:8px}.hes-bar-heading>strong{font-size:15px}.hes-bar-heading>small{min-width:50px;font-size:11px}.hes-comparison-footer,.hes-footer{flex-wrap:wrap;gap:7px}.hes-footer{padding:14px}.hes-inspector{padding:14px;gap:12px;grid-template-columns:80px 1fr 28px}.hes-inspector img{width:80px;height:110px}.hes-inspector h3{font-size:17px!important}.hes-inspector p{font-size:12px}.hes-hotspots button>span{min-width:0;white-space:normal;font-size:10px}}
.hes-inspector:has([data-inspection-art][hidden])>div{grid-column:1/3}
.hes-story>span:first-child,.hes-projected{flex-shrink:0;white-space:nowrap}.hes-story>div,.hes-comparison-heading>div{min-width:0}
@media(prefers-reduced-motion:reduce){.hes-bar-track>span{transition:none}}
