.energyFlowView { width:100%; height:100%; contain:layout paint; }
.energyFlowView svg { display:block; overflow:visible; }
.energyFlowView text { pointer-events:none; paint-order:stroke; stroke:#fff; stroke-width:3px; stroke-linejoin:round; }
.energyFlowView [data-status="missing"] rect,.energyFlowView [data-status="invalid"] rect,.energyFlowView [data-status="unit"] rect { stroke:#b45309; }
.energyFlowAnimated [data-status="good"] .energyFlowPath { stroke-dasharray:16 6; animation:energy-flow-motion 1s linear infinite; }
@keyframes energy-flow-motion { to { stroke-dashoffset:-22; } }
@media (prefers-reduced-motion:reduce) { .energyFlowAnimated [data-status="good"] .energyFlowPath { animation:none; } }
/* The editor reuses the graphic editor's card, toolbar, panels and responsive shell.
   Control appearance, spacing and heights stay in the shared UI foundation. */
.energyEditor { min-width:0; }
.energyWorkspace { min-width:0; }
.energyViewport { min-width:0; height:65vh; touch-action:pan-x pan-y pinch-zoom; }
.energyStage [data-energy-kind="node"],.energyStage .graphicHandle { touch-action:none; }
.energyStage { position:relative; background:white; transform-origin:0 0; }
.energyInspector { min-width:0; }
.energyStatus:not([hidden]) { margin-block:var(--mhome-space-sm); }
@media (max-width:650px) { .energyViewport { height:50vh; } }
/* Active drawing tool, as in the floorplan editor palette. */
.energyPalette button[aria-pressed="true"] { border-color:#287db5; background:#e0eef8; color:#205578; }
.energyPalette h3:not(:first-child) { margin-top:var(--mhome-space-md); }