/* Reuse the existing CHIEL architectural renderer and add a private energy layer. */
.showcase-page {background:radial-gradient(ellipse at 52% 0%,#132d36 0%,#071520 45%,#06121c 100%)}
.e3-section{margin:clamp(24px,4vw,48px) 0 40px;position:relative}
.e3-heading{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:18px}
.e3-heading h2{font-size:clamp(1.4rem,3vw,2rem);margin:7px 0 0;color:#edfaff}
.e3-heading p{margin:0 0 5px;color:#9ac8d9;font-size:.86rem}
.e3-heading p[data-state=live]{color:#76e6aa}
.e3-heading p[data-state=offline],.e3-heading p[data-state=delayed]{color:#ffc58a}
.e3-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px}
.e3-card{position:relative;min-width:0;display:flex;flex-direction:column;gap:6px;padding:21px 20px 19px;border-radius:19px;border:1px solid rgba(138,198,219,.21);background:linear-gradient(142deg,rgba(20,49,65,.92),rgba(8,25,40,.94));box-shadow:0 14px 38px #020f1b32;overflow:hidden}
.e3-card:after{content:"";position:absolute;top:-50px;right:-45px;width:120px;height:120px;border-radius:50%;background:rgba(71,220,200,.06);pointer-events:none}
.e3-card small{color:#aec6d8;font-weight:700;font-size:.82rem;letter-spacing:.02em}
.e3-card strong{font-size:clamp(1.45rem,3vw,2.2rem);font-weight:850;letter-spacing:-.035em;color:#eefbff;font-variant-numeric:tabular-nums}
.e3-card p{color:#9cb7c9;font-size:.82rem;line-height:1.35;min-height:1.3em;margin:0}
.e3-card[data-available=no] strong{color:#8798aa}
.e3-card[data-meter=solar] .e3-icon{color:#ffd773}
.e3-card[data-meter=battery] .e3-icon{color:#79ffc7}
.e3-card[data-meter=grid] .e3-icon{color:#8ec8ff}
.e3-card[data-meter=home] .e3-icon{color:#d9c4ff}
.e3-card[data-meter=gas] .e3-icon{color:#ffb484}
.e3-card[data-meter=water] .e3-icon{color:#7cdbff}
.e3-icon{font-size:1.45rem;line-height:1;display:block;margin-bottom:4px}
.e3-meter{height:5px;width:100%;border-radius:99px;background:#29455a;margin-top:2px;overflow:hidden}
.e3-meter div{width:0;height:100%;background:linear-gradient(90deg,#28c9ba,#8cffb5);transition:width .7s ease}
.e3-note{font-size:.78rem;line-height:1.5;color:#89a7b9;margin:14px 3px 0}
#modelViewer{position:relative}
.e3-overlay{position:absolute;inset:0;pointer-events:none;z-index:15}
.e3-float{position:absolute;display:flex;flex-direction:column;min-width:104px;gap:3px;border:1px solid #80bfc947;backdrop-filter:blur(12px);background:rgba(5,23,35,.78);border-radius:12px;padding:10px 12px;box-shadow:0 10px 24px #0005;font-variant-numeric:tabular-nums}
.e3-float span{color:#a1d2dc;font-size:.73rem;font-weight:700}
.e3-float strong{color:#fff;font-size:1.04rem}
.e3-float.e3-solar{top:15%;left:3%;border-left:3px solid #ffd773}
.e3-float.e3-battery{top:15%;right:3%;border-left:3px solid #76f7b5}
.e3-float.e3-gridpower{bottom:17%;left:3%;border-left:3px solid #8abfff}
.e3-float.e3-homepower{bottom:17%;right:3%;border-left:3px solid #c5b7ff}
@media(max-width:780px){.e3-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.e3-heading{align-items:start;flex-direction:column;gap:7px}}
@media(max-width:480px){.e3-grid{gap:9px}.e3-card{padding:14px 12px;border-radius:14px}.e3-card strong{font-size:1.45rem}.e3-card p{font-size:.72rem}.e3-float{padding:6px 7px;min-width:82px}.e3-float span{font-size:.58rem}.e3-float strong{font-size:.76rem}.e3-float.e3-solar{top:12%;left:1%}.e3-float.e3-battery{top:12%;right:1%}.e3-float.e3-gridpower{bottom:16%;left:1%}.e3-float.e3-homepower{bottom:16%;right:1%}}

/* CHIEL 3D ENERGY SIMPLE BUTTONS - walls and roof only */
#modelView .model3d-toolbar > .model3d-pills:first-child,
#modelView .model3d-toolbar > .model3d-pills:last-child,
#modelView #modelRoomButtons,
#modelView .model3d-rooms > strong,
#modelView #modelWalkPad,
#modelView .model3d-control-link,
#modelView #modelSensorToggle,
#modelView #modelFallbackInside {display:none !important;}
#modelView .model3d-toolbar {justify-content:center;}
#modelView .model3d-toolbar > .model3d-pills:nth-child(2) {display:flex !important;}

/* 3D Energy: gas and water inside existing 3D view. */
.e3-float.e3-gaspower{top:46%;left:3%;border-left:3px solid #ffb484}
.e3-float.e3-waterpower{top:46%;right:3%;border-left:3px solid #7cdbff}
@media(max-width:480px){
 .e3-float.e3-gaspower{top:45%;left:1%}
 .e3-float.e3-waterpower{top:45%;right:1%}
}

/* CHIEL 3D ENERGY presentation-only controls */
#modelView #chielShelfOpen, #chielShelfMenu, #modelView .kitchen-radio-hotspot,
#modelView #modelTvLiveState, #modelView #modelLightState,
#modelView .model3d-room-buttons, #showcaseRoomCard,
#modelView #modelHotspotsToggle, #modelView #modelTemperatureMap,
#modelView #modelDeviceHotspots {display:none !important;}
#modelView .model3d-toolbar > .model3d-pills:nth-child(2) button{
 min-height:44px;touch-action:manipulation;
}
@media(max-width:480px){
 #modelView .model3d-toolbar{padding:10px 6px;}
 #modelView .model3d-toolbar > .model3d-pills:nth-child(2){gap:8px;justify-content:center;flex-wrap:wrap}
}


/* Live power paths: presentation only, disabled for missing or delayed readings. */
#e3FlowLayer{position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none;overflow:visible}
.e3-float{z-index:2}
.e3-flow-line{stroke-width:2.5;stroke-linecap:round;fill:none;opacity:0;transition:opacity .5s ease;stroke-dasharray:1.2 1.8;vector-effect:non-scaling-stroke}
.e3-flow-solar{stroke:#ffd773;filter:drop-shadow(0 0 3px #ffd773)}
.e3-flow-grid{stroke:#83bfff;filter:drop-shadow(0 0 3px #83bfff)}
.e3-flow-battery{stroke:#7fffc0;filter:drop-shadow(0 0 3px #7fffc0)}
.e3-flow-line[data-direction=forward],.e3-flow-line[data-direction=reverse]{opacity:.95;animation:e3-current .95s linear infinite}
.e3-flow-line[data-direction=reverse]{animation-direction:reverse}
@keyframes e3-current{to{stroke-dashoffset:-12}}
@media (prefers-reduced-motion:reduce){
 .e3-flow-line[data-direction=forward],.e3-flow-line[data-direction=reverse]{animation:none;stroke-dasharray:none;opacity:.75}
}
\n/* Preserve recent 5-minute Homey paths while marking 2+ minute samples as static. */
.e3-flow-line[data-stale=yes][data-direction=forward],
.e3-flow-line[data-stale=yes][data-direction=reverse]{animation:none;opacity:.45;stroke-dasharray:3 6}