/* Схема теплового пункта */
.wrap--wide{max-width:1380px}
.itp{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:20px;align-items:start}
.itp__board{min-width:0;background:var(--mist);border-radius:22px;padding:16px 16px 12px;position:relative}
.itp__top{display:flex;flex-wrap:wrap;gap:12px 20px;align-items:center;justify-content:space-between;padding:4px 4px 12px}
.season{display:inline-flex;background:#fff;border-radius:14px;padding:4px;gap:4px;box-shadow:0 1px 0 var(--line)}
.season button{border:0;background:none;border-radius:10px;padding:10px 16px;font:600 15px var(--f);color:var(--muted);cursor:pointer;display:inline-flex;align-items:center;gap:8px}
.season button svg{width:18px;height:18px}
.season button[aria-pressed="true"]{background:var(--navy);color:#fff}
.legend{display:flex;flex-wrap:wrap;gap:6px 14px;list-style:none;margin:0;padding:0;font-size:13.5px;color:var(--muted)}
.legend li{display:inline-flex;align-items:center;gap:7px}
.legend i{width:22px;height:5px;border-radius:3px;display:inline-block}
.legend i.sig{height:0;border-top:2px dashed #8A97A6;border-radius:0}
.status{margin:0 4px 10px;font-size:15.5px;color:var(--navy);display:flex;gap:10px;align-items:flex-start;min-height:2.8em}
.status b{font-weight:600}
.scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;border-radius:14px}
#itp{display:block;width:100%;height:auto}
.hint{display:none;font-size:13.5px;color:var(--muted);margin:8px 4px 0}

/* элементы схемы */
.pipe{fill:none;stroke-width:9;stroke-linecap:round;stroke-linejoin:round;transition:stroke .5s}
.flow{fill:none;stroke:#fff;stroke-width:3.4;stroke-dasharray:1 19;stroke-linecap:round;opacity:.9;animation:flow 1.1s linear infinite}
@keyframes flow{to{stroke-dashoffset:-20}}
.sig{fill:none;stroke:#8A97A6;stroke-width:2;stroke-dasharray:5 5}
.sym{fill:#fff;stroke:var(--navy);stroke-width:2.4;stroke-linejoin:round;transition:stroke .3s,fill .3s}
.symf{fill:var(--navy)}
.t{font:500 18px var(--f);fill:var(--navy)}
.t--m{fill:var(--muted);font-size:16px}
.t--b{font-weight:600}
.hs{cursor:pointer;outline:none}
.hs .halo{fill:rgba(32,124,192,.12);stroke:var(--blue);stroke-width:2;opacity:0;transition:opacity .25s}
.hs:hover .halo,.hs:focus-visible .halo{opacity:.6}
.hs.sel .halo{opacity:1}
.hs.sel .sym{stroke:var(--blue)}
.pulse{fill:none;stroke:var(--red);stroke-width:2.5;transform-box:fill-box;transform-origin:center;animation:pulse 2.2s ease-out infinite}
@keyframes pulse{0%{transform:scale(1);opacity:.9}80%,100%{transform:scale(2.8);opacity:0}}
.dot{fill:var(--red);stroke:#fff;stroke-width:2}
.visited .pulse,.visited .dot{display:none}
.fan{transform-box:fill-box;transform-origin:center;animation:spin 1.2s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.summer .heat .pipe{stroke:#C3CCD6!important}
.summer .heat .flow{opacity:0;animation-play-state:paused}
.summer .heat-unit{opacity:.45}
.summer .fan--heat{animation-play-state:paused}
.rad{transition:fill .6s}
.summer .rad{fill:#C9D2DC}
.sun,.snow{transition:opacity .4s}
.summer .snow{opacity:0}.sun{opacity:0}.summer .sun{opacity:1}

/* панель */
.card{background:#fff;border:1px solid var(--line);border-radius:22px;padding:20px 22px 22px;position:sticky;top:16px}
.guide{display:grid;grid-template-columns:86px 1fr;gap:10px;align-items:center;margin-bottom:14px}
.guide svg{width:86px;height:92px}
.say{position:relative;background:var(--mist);border-radius:14px;padding:12px 14px;font-size:15px;color:var(--navy);line-height:1.4}
.say::before{content:"";position:absolute;left:-7px;top:22px;border:8px solid transparent;border-right-color:var(--mist);border-left:0}
.card h3{font-size:22px;font-weight:600;margin:6px 0 10px}
.card p{font-size:16px;color:var(--ink);margin:0 0 12px}
.warn{display:flex;gap:10px;background:#FFF4F2;border-radius:12px;padding:12px 14px;font-size:15px;color:#7A2A22;margin-bottom:16px}
.warn svg{flex:none;width:20px;height:20px;margin-top:2px;color:var(--red)}
.card .acts{display:grid;gap:8px}
.card .acts .btn{width:100%}
.next{margin-top:12px;border:0;background:none;color:var(--blue);font:600 15px var(--f);cursor:pointer;padding:6px 0}
.empty p{color:var(--muted)}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px;padding:0;list-style:none}
.chips button{border:1px solid var(--line);background:#fff;border-radius:10px;padding:8px 12px;font:500 14px var(--f);color:var(--navy);cursor:pointer}
.chips button[aria-current="true"]{background:var(--navy);border-color:var(--navy);color:#fff}
.notes{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));margin-top:28px}
.notes div{background:var(--mist);border-radius:14px;padding:18px 20px;font-size:15.5px;color:var(--muted)}
.notes b{display:block;color:var(--navy);font-size:16px;margin-bottom:4px}
@media (max-width:1040px){.itp{grid-template-columns:minmax(0,1fr)}.card{position:static}}
@media (max-width:760px){#itp{min-width:680px}.hint{display:block}.itp__board{margin:0 -12px;border-radius:16px;padding:12px 10px}.legend{display:none}}
@media (prefers-reduced-motion:reduce){.flow,.pulse,.fan{animation:none}}