/* Animiertes Energiehaus */
.eh{margin:32px 0 0;max-width:1180px}
.eh-ctrl{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-bottom:12px}
.eh-ctrl button{font:inherit;font-weight:650;font-size:15px;padding:8px 14px;border-radius:4px;border:2px solid var(--ink,#16252D);background:#fff;color:var(--ink,#16252D);cursor:pointer}
.eh-ctrl button[aria-pressed="true"]{background:var(--ink,#16252D);color:#fff}
.eh-status{margin-left:auto;font-weight:650;font-size:15px;display:inline-flex;align-items:center;gap:8px}
.eh-status::before{content:"";width:12px;height:12px;border-radius:50%;background:#F2B705;box-shadow:0 0 0 4px rgba(242,183,5,.2);transition:background .6s}
.eh[data-state="night"] .eh-status::before{background:#2E9E5B;box-shadow:0 0 0 4px rgba(46,158,91,.2)}
.eh-stage{border-radius:8px;overflow:hidden;border:2px solid var(--ink,#16252D);background:#D7ECF6}
.eh svg{display:block;width:100%;height:auto;font-family:var(--font,Arial,sans-serif)}

/* Himmel & Tageszeit */
.eh-sky-s,.eh-sky-n,.eh-stars,.eh-moon{opacity:0;transition:opacity 2.4s ease}
.eh[data-state="dusk"] .eh-sky-s{opacity:1}
.eh[data-state="night"] .eh-sky-n,.eh[data-state="night"] .eh-stars,.eh[data-state="night"] .eh-moon{opacity:1}
.eh-stars circle{fill:#fff}
.eh-moon{transform:translate(260px,120px)}
.eh-moon-cut{fill:#1D3247}
.eh-sun{transform:translate(900px,110px);transition:transform 2.6s ease-in-out,opacity 2.4s}
.eh[data-state="dusk"] .eh-sun{transform:translate(1080px,380px)}
.eh[data-state="night"] .eh-sun{transform:translate(1120px,640px);opacity:0}
.eh-cloud ellipse{fill:#fff;opacity:.9}
.eh-cloud.c1{transform:translate(200px,120px);animation:ehcloud 60s linear infinite}
.eh-cloud.c2{transform:translate(640px,70px);animation:ehcloud 80s linear infinite reverse}
@keyframes ehcloud{50%{transform:translate(460px,110px)}}
.eh[data-state="night"] .eh-cloud ellipse{fill:#3B5266}
.eh-hill{fill:#9BBF86;transition:fill 2.4s}
.eh[data-state="night"] .eh-hill{fill:#2F4A3A}
.eh[data-state="night"] rect[fill="url(#ehLawn)"]{filter:brightness(.45)}
.eh-drive{fill:#B9B4AA;transition:fill 2.4s}
.eh[data-state="night"] .eh-drive{fill:#5C5A55}
.eh-wire{fill:none;stroke:#3A3F44;stroke-width:2.5}
.eh-cut{opacity:0}.eh-cut line{stroke:#B3261E;stroke-width:5;stroke-linecap:round}

/* Haus */
.eh-pv{fill:url(#ehPanel);stroke:#7FA3C2;stroke-width:1}
.eh-shine{fill:#fff;opacity:.16;transition:opacity 2s}
.eh[data-state="night"] .eh-shine{opacity:0}
.eh-win rect{fill:url(#ehGlass);transition:fill 2s}
.eh[data-state="night"] .eh-win rect,.eh[data-state="dusk"] .eh-win rect{fill:url(#ehWarm)}
.eh-frame rect{fill:none;stroke:#3A4046;stroke-width:4}.eh-frame line{stroke:#3A4046;stroke-width:3}
.eh-room{font-size:12px;font-weight:700;fill:#5B6670}
.eh-tiny{font-size:14px;font-weight:800;fill:#216B8F;text-anchor:middle}
.eh-soc{fill:#2E9E5B;transition:height 8s linear,y 8s linear}
.eh[data-state="day"] .eh-soc{height:70px;y:474px}
.eh[data-state="night"] .eh-soc{height:20px;y:524px}
.eh-fan{transform-box:fill-box;transform-origin:center;animation:ehspin 1.4s linear infinite}
.eh-ac .eh-fan{animation-duration:1s}
.eh[data-state="night"] .eh-ac .eh-fan{animation-play-state:paused}
@keyframes ehspin{to{transform:rotate(360deg)}}
.eh-wb-led{fill:#7FD14F;animation:ehblink 1.6s ease-in-out infinite}
@keyframes ehblink{50%{opacity:.25}}
.eh-cable{fill:none;stroke:#1E2328;stroke-width:4;stroke-linecap:round}
.eh-carsoc-bar{fill:#2E9E5B;transition:width 9s linear}
.eh[data-state="night"] .eh-carsoc-bar{width:74px}
.eh[data-state="day"] .eh-carsoc-bar{width:56px}
.eh[data-state="night"] .eh-backup{fill:#E8F5EC}

/* Energieflüsse */
.eh-flow{fill:none;stroke-width:5;stroke-linecap:round;stroke-dasharray:3 13;animation:ehflow .9s linear infinite;transition:opacity .8s}
@keyframes ehflow{to{stroke-dashoffset:-16}}
.f-sun{stroke:#FFD54A;stroke-width:6;stroke-dasharray:2 16}
.f-pv{stroke:#F2B705}
.f-bat{stroke:#2E9E5B}
.f-batout{stroke:#2E9E5B;opacity:0}
.f-dhw,.f-home,.f-ac,.f-hp,.f-wb{stroke:#2F79A0}
.f-grid{stroke:#7A6BAE}
.eh[data-state="night"] .f-sun,.eh[data-state="night"] .f-pv,.eh[data-state="night"] .f-bat,.eh[data-state="night"] .f-grid,.eh[data-state="night"] .f-ac{opacity:0}
.eh[data-state="night"] .f-batout{opacity:1}
.eh[data-state="dusk"] .f-sun,.eh[data-state="dusk"] .f-grid{opacity:0}
.eh[data-state="dusk"] .f-pv{opacity:.4}

/* Beschriftungen */
.eh-labels rect{fill:#fff;opacity:.93;stroke:#16252D;stroke-opacity:.15}
.eh-labels text{font-size:14px;font-weight:650;fill:#16252D;text-anchor:middle}

.eh-legend{display:flex;flex-wrap:wrap;gap:8px 22px;margin-top:12px;font-size:14px;font-weight:600}
.eh-legend span{display:inline-flex;align-items:center;gap:8px}
.eh-legend span::before{content:"";width:22px;height:5px;border-radius:3px}
.l-sun::before{background:#F2B705}.l-use::before{background:#2F79A0}.l-bat::before{background:#2E9E5B}.l-grid::before{background:#7A6BAE}

@media(max-width:700px){.eh-labels text{font-size:20px}.eh-labels rect{transform:scale(1.4)}.eh-status{margin-left:0;width:100%}}
@media (prefers-reduced-motion:reduce){.eh-flow,.eh-fan,.eh-cloud,.eh-wb-led{animation:none}.eh-flow{stroke-dasharray:none}}

.eh-dark{fill:#0B1724;opacity:0;pointer-events:none;transition:opacity 2.4s}
.eh[data-state="dusk"] .eh-dark{opacity:.18}
.eh[data-state="night"] .eh-dark{opacity:.42}
.eh-hp,.eh-ac,.eh-carport,.eh-car,.eh-wb,.eh-tree{transition:filter 2.4s}
.eh[data-state="night"] .eh-hp,.eh[data-state="night"] .eh-ac,.eh[data-state="night"] .eh-carport,.eh[data-state="night"] .eh-car,.eh[data-state="night"] .eh-tree{filter:brightness(.6)}