[hidden]{display:none !important}
:root{
  color-scheme:light;
  --bg:#f3f2ef;--surface:#fcfcfb;--surface-2:#f0efec;--line:#e2e0db;
  --tx:#0b0b0b;--tx-2:#52514e;--tx-3:#7a7974;
  --accent:#d9661f;--accent-ink:#fff;
  --s-col:#eb6834;--s-a:#2a78d6;--s-b:#1baf7a;--s-x:#7a7974;
  --good:#1f8a4c;--warn:#b7791f;--bad:#c53030;
  --band-pump:rgba(42,120,214,.16);--band-heat:rgba(197,48,48,.45);
  --s-col2:#c48a0c;--s-m1:#8a5cc7;--s-m2:#5f6b78;--s-pool:#0f97ad;--s-other:#8f8e86;
  --band-cool:rgba(95,107,120,.22);--band-src:rgba(138,92,199,.2);--band-fault:rgba(197,48,48,.10);
  --band-nt:rgba(122,121,116,.28);--nt:#a9a7a0;--s-elec:#c53030;
  --pipe:#c9c6bf;--pipe-hot:#eb6834;--pipe-cold:#2a78d6;--warn-bg:#fdf3e1;
  --radius:12px;--shadow:0 1px 2px rgba(0,0,0,.05);
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  color-scheme:dark;
  --bg:#121211;--surface:#1a1a19;--surface-2:#242422;--line:#33332f;
  --tx:#ffffff;--tx-2:#c3c2b7;--tx-3:#8f8e86;
  --accent:#e2783a;
  --s-col:#d95926;--s-a:#3987e5;--s-b:#199e70;--s-x:#8f8e86;
  --good:#3fb877;--warn:#e0a842;--bad:#ef6b6b;
  --band-pump:rgba(57,135,229,.22);--band-heat:rgba(239,107,107,.5);
  --s-col2:#e0b040;--s-m1:#a881e0;--s-m2:#9aa5b1;--s-pool:#2bb8cc;--s-other:#8f8e86;
  --band-cool:rgba(154,165,177,.22);--band-src:rgba(168,129,224,.22);--band-fault:rgba(239,107,107,.14);
  --band-nt:rgba(143,142,134,.3);--nt:#5f5e58;--s-elec:#ef6b6b;
  --pipe:#4a4a45;--pipe-hot:#e2783a;--pipe-cold:#3987e5;--warn-bg:#3a2e17;
}}
:root[data-theme="dark"]{
  color-scheme:dark;
  --bg:#121211;--surface:#1a1a19;--surface-2:#242422;--line:#33332f;
  --tx:#ffffff;--tx-2:#c3c2b7;--tx-3:#8f8e86;
  --accent:#e2783a;
  --s-col:#d95926;--s-a:#3987e5;--s-b:#199e70;--s-x:#8f8e86;
  --good:#3fb877;--warn:#e0a842;--bad:#ef6b6b;
  --band-pump:rgba(57,135,229,.22);--band-heat:rgba(239,107,107,.5);
  --s-col2:#e0b040;--s-m1:#a881e0;--s-m2:#9aa5b1;--s-pool:#2bb8cc;--s-other:#8f8e86;
  --band-cool:rgba(154,165,177,.22);--band-src:rgba(168,129,224,.22);--band-fault:rgba(239,107,107,.14);
  --band-nt:rgba(143,142,134,.3);--nt:#5f5e58;--s-elec:#ef6b6b;
  --pipe:#4a4a45;--pipe-hot:#e2783a;--pipe-cold:#3987e5;--warn-bg:#3a2e17;
}
*{box-sizing:border-box}
html,body{margin:0}
body{background:var(--bg);color:var(--tx);font:15px/1.45 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;-webkit-font-smoothing:antialiased}
a{color:inherit}
button,input,select,textarea{font:inherit;color:inherit}
.top{position:sticky;top:0;z-index:5;display:flex;align-items:center;gap:12px;padding:10px 16px;background:var(--surface);border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:8px;font-weight:650;text-decoration:none;letter-spacing:-.01em}
.brand svg{width:24px;height:24px}
.top nav{margin-left:auto;display:flex;gap:4px}
.top nav a{padding:6px 10px;border-radius:8px;text-decoration:none;color:var(--tx-2);font-size:14px}
.top nav a.on,.top nav a:hover{background:var(--surface-2);color:var(--tx)}
main{max-width:980px;margin:0 auto;padding:16px;display:grid;gap:16px}
.foot{max-width:980px;margin:0 auto;padding:8px 16px 24px;color:var(--tx-3);font-size:13px;text-align:center}
.foot a{color:var(--tx-2)}
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:16px;box-shadow:var(--shadow);min-width:0}
.card h2{margin:0 0 12px;font-size:13px;font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:var(--tx-3)}
.head{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.head h1{margin:0;font-size:22px;letter-spacing:-.015em}
.dot{display:inline-block;width:9px;height:9px;border-radius:50%;background:var(--tx-3);flex:none}
.dot.on{background:var(--good)}
.muted{color:var(--tx-2)}.small{font-size:13px}.tiny{font-size:12px;color:var(--tx-3)}
.tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:10px}
.tile{border:1px solid var(--line);border-radius:10px;padding:10px 12px;background:var(--surface)}
.tile .k{font-size:12px;color:var(--tx-3);display:flex;align-items:center;gap:6px}
.tile .k i{width:10px;height:3px;border-radius:2px;display:inline-block}
.tile .v{font-size:24px;font-weight:620;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.tile .v2{display:flex;flex-direction:column;font-size:18px;font-weight:600;font-variant-numeric:tabular-nums}
.tile .v2 span{display:flex;justify-content:space-between;gap:8px}
.tile .v2 small{font-weight:400;color:var(--tx-3);font-size:12px}
.badge{display:inline-flex;align-items:center;gap:5px;padding:2px 8px;border-radius:99px;font-size:12px;font-weight:550;background:var(--surface-2);color:var(--tx-2)}
.warnc{color:var(--warn)}
.badge.good{color:var(--good)}.badge.warn{color:var(--warn)}.badge.bad{color:var(--bad)}.badge.ai{color:var(--accent)}
.state{margin-top:12px;font-weight:550}
.state.bad{color:var(--bad)}
.grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:16px}
.plan-why{font-size:16px;line-height:1.5;margin:0 0 10px}
.kv{display:flex;flex-wrap:wrap;gap:6px 14px;font-size:13px;color:var(--tx-2)}
.kv b{color:var(--tx);font-weight:600}
.fc{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.fc>div{border:1px solid var(--line);border-radius:10px;padding:8px 10px}
.fc .d{font-size:12px;color:var(--tx-3)}
.fc .e{font-size:20px;font-weight:620;font-variant-numeric:tabular-nums}
.fc .m{font-size:12px;color:var(--tx-2)}
.btns{display:flex;flex-wrap:wrap;gap:8px}
button,.btn{padding:8px 14px;border-radius:9px;border:1px solid var(--line);background:var(--surface);cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;gap:6px}
button:hover{background:var(--surface-2)}
button.sel,button.pri{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
button.danger{color:var(--bad)}
button:disabled{opacity:.5;cursor:default}
.seg{display:inline-flex;border:1px solid var(--line);border-radius:9px;overflow:hidden}
.seg button{border:0;border-radius:0;padding:6px 12px;font-size:13px}
.seg button+button{border-left:1px solid var(--line)}
form.f{display:grid;gap:12px}
fieldset{border:1px solid var(--line);border-radius:10px;margin:0;padding:12px;min-width:0}
legend{padding:0 6px;color:var(--tx-3);font-size:13px}
.fg{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:10px 14px}
label{display:flex;flex-direction:column;gap:4px;font-size:13px;color:var(--tx-2)}
label.cb{flex-direction:row;align-items:center;gap:8px;color:var(--tx)}
input,select,textarea{padding:8px 10px;border:1px solid var(--line);border-radius:8px;background:var(--bg);width:100%;min-width:0}
input[type=checkbox]{width:auto}
.hint{font-size:12px;color:var(--tx-3)}
details>summary{cursor:pointer;font-weight:600;list-style:none;display:flex;align-items:center;gap:8px}
details>summary::-webkit-details-marker{display:none}
details>summary::before{content:"▸";color:var(--tx-3);transition:transform .15s}
details[open]>summary::before{transform:rotate(90deg)}
details[open]>summary{margin-bottom:12px}
.chart-wrap{position:relative}
canvas{display:block;width:100%;height:260px;touch-action:pan-y}
.legend{display:flex;flex-wrap:wrap;gap:6px 14px;margin-top:8px;font-size:13px;color:var(--tx-2)}
.legend button{padding:2px 6px;border:0;background:none;color:inherit;font-size:13px;gap:6px}
.legend button.off{opacity:.4}
.legend i{display:inline-block;width:16px;height:0;border-top:2px solid}
.legend i.dash{border-top-style:dashed}
.legend i.band{height:8px;border:0;border-radius:2px}
.tip{position:absolute;pointer-events:none;background:var(--surface);border:1px solid var(--line);border-radius:8px;padding:6px 8px;font-size:12px;box-shadow:0 4px 14px rgba(0,0,0,.12);white-space:nowrap;display:none;z-index:2}
.tip b{font-weight:600}
.tip .r{display:flex;justify-content:space-between;gap:12px;font-variant-numeric:tabular-nums}
.tip .r i{display:inline-block;width:10px;height:2px;margin-right:6px;vertical-align:middle}
table{width:100%;border-collapse:collapse;font-size:13px}
th,td{text-align:left;padding:7px 8px;border-bottom:1px solid var(--line);vertical-align:top}
th{color:var(--tx-3);font-weight:550}
td.n,th.n{text-align:right;font-variant-numeric:tabular-nums}
.scroll{overflow-x:auto}
.ev{display:grid;grid-template-columns:auto 1fr;gap:4px 10px;font-size:13px}
.ev .t{color:var(--tx-3);white-space:nowrap;font-variant-numeric:tabular-nums}
.ev .evdel{border:0;background:none;color:var(--tx-3);cursor:pointer;padding:0 4px;font-size:12px;line-height:1;opacity:.6}
.ev .evdel:hover{opacity:1;color:var(--bad)}
.list a.dev{display:flex;align-items:center;gap:12px;padding:12px;border:1px solid var(--line);border-radius:10px;text-decoration:none;background:var(--surface)}
.list a.dev:hover{border-color:var(--tx-3)}
.list{display:grid;gap:8px}
.login{max-width:360px;margin:12vh auto 0}
.login h1{font-size:22px;margin:0 0 4px}
.msg{font-size:13px;min-height:1.2em}
.msg.err{color:var(--bad)}.msg.ok{color:var(--good)}
.secret{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:13px;background:var(--surface-2);border-radius:8px;padding:10px;white-space:pre-wrap;word-break:break-all}
.toast{position:fixed;left:50%;bottom:20px;transform:translateX(-50%);background:var(--tx);color:var(--bg);padding:10px 16px;border-radius:10px;font-size:14px;z-index:20;opacity:0;transition:opacity .2s;pointer-events:none;max-width:calc(100% - 32px)}
.toast.show{opacity:1}
.flags{margin:8px 0 0;padding-left:18px;font-size:13px;color:var(--warn)}
@media (max-width:560px){main{padding:12px}.top{flex-wrap:wrap;row-gap:6px;padding:8px 12px}.top nav{margin-left:0;width:100%;min-width:0;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}.top nav::-webkit-scrollbar{display:none}.top nav a{padding:6px 8px;white-space:nowrap;flex:none}.fc .e{font-size:17px}.head h1{font-size:19px}}

/* ---- záložky zařízení ---- */
.tabs{display:flex;gap:2px;margin-top:14px;border-bottom:1px solid var(--line);overflow-x:auto;scrollbar-width:none}
.tabs a{padding:8px 14px;text-decoration:none;color:var(--tx-2);font-size:14px;font-weight:550;border-bottom:2px solid transparent;margin-bottom:-1px;white-space:nowrap}
.tabs a.on{color:var(--tx);border-bottom-color:var(--accent)}
.tabs a:hover{color:var(--tx)}
/* ---- schéma (SVG) ---- */
.scheme{width:100%;height:auto;display:block;max-height:440px}
.scheme text{fill:var(--tx);font-family:system-ui,sans-serif}
.scheme .lbl{fill:var(--tx-3);font-size:16px}
.scheme .pw{fill:var(--tx-3);font-size:13px;opacity:.8}
.scheme .tv{font-size:28px;font-weight:650;font-variant-numeric:tabular-nums}
.scheme .pipe{fill:none;stroke:var(--pipe);stroke-width:5;stroke-linecap:round;stroke-linejoin:round}
.scheme .pipe.hot{stroke:var(--pipe-hot)}.scheme .pipe.cold{stroke:var(--pipe-cold)}
.scheme .box{fill:var(--surface-2);stroke:var(--line);stroke-width:2}
.scheme .col{fill:var(--surface-2);stroke:var(--tx-3);stroke-width:2}
.scheme .col line{stroke:var(--tx-3);stroke-width:1.2;opacity:.5}
.scheme .pump circle{fill:var(--surface);stroke:var(--tx-3);stroke-width:3}
.scheme .pump path{fill:var(--tx-3)}
.scheme .pump.on circle{stroke:var(--accent)}.scheme .pump.on path{fill:var(--accent)}
.scheme .pump.on .rot{animation:sv-spin 1.2s linear infinite;transform-box:fill-box;transform-origin:center}
.scheme .valve path{fill:var(--surface);stroke:var(--tx-3);stroke-width:2.5}
.scheme .valve .on{fill:var(--accent);stroke:var(--accent)}
.scheme .heat{stroke:var(--tx-3);stroke-width:3;fill:none}.scheme .heat.on{stroke:var(--bad)}
.scheme .badge-on{fill:var(--accent);font-size:13px;font-weight:650}
@keyframes sv-spin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.scheme .pump.on .rot{animation:none}}
.status{display:grid;grid-template-columns:auto 1fr;gap:4px 10px;margin-top:12px;font-size:15px}
.status b{font-weight:600;color:var(--tx-2)}
.status .bad{color:var(--bad)}.status .ok{color:var(--good)}
.tiles.mini .tile .v{font-size:20px}
/* ---- grafy ---- */
.gnav{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:10px}
.gnav .title{font-weight:600;min-width:0;flex:1 1 160px}
.seg.small button{padding:5px 10px;font-size:13px}
.legend .band{height:8px;border:0;border-radius:2px}
/* ---- nastavení ---- */
.warnbox{background:var(--warn-bg);color:var(--tx);border-radius:9px;padding:10px 12px;font-size:14px;border-left:4px solid var(--warn)}
.tri{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;padding:6px 0;border-bottom:1px solid var(--line)}
.tri:last-child{border-bottom:0}
.tri>span{font-size:14px}
.stepper{display:flex;align-items:center;gap:6px}
.stepper input{width:80px;text-align:center}
.stepper button{padding:6px 12px}
.wins{display:grid;gap:6px}
.wins .w{display:flex;align-items:center;gap:6px}
.wins .w input{width:auto;flex:0 1 120px}
input:disabled,select:disabled{opacity:.6}
/* ---- programy ---- */
.progs{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px}
.prog{border:1px solid var(--line);border-radius:12px;padding:12px;display:grid;gap:8px;background:var(--surface)}
.prog.sel{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}
.prog h3{margin:0;font-size:15px}
.prog p{margin:0;font-size:13px;color:var(--tx-2)}
@media (max-width:560px){
  .scheme .lbl{font-size:22px}.scheme .tv{font-size:34px}.scheme .pw{font-size:17px}
  .tabs a{padding:8px 9px;font-size:13.5px}
  .status{font-size:14px}
}
.prog .scheme .lbl{font-size:20px}
.ntgrid{display:grid;gap:6px}
.ntrow{display:grid;grid-template-columns:44px 1fr;align-items:center;gap:8px;font-size:12px;color:var(--tx-3)}
.ntrow.today>span{color:var(--tx);font-weight:600}
.ntbar{position:relative;height:16px;background:var(--surface-2);border-radius:4px;overflow:hidden}
.ntbar i{position:absolute;top:0;bottom:0}
.ntbar i.nt{background:var(--nt)}
.ntbar i.heat{top:5px;bottom:5px;background:var(--bad);opacity:.85}
.ntbar b{position:absolute;top:0;bottom:0;width:2px;margin-left:-1px}
.ntbar b.now{background:var(--tx)}
.ntbar b.ready{background:var(--bad);width:3px}
.ntticks{position:relative;height:14px}
.ntticks span{position:absolute;transform:translateX(-50%);font-size:11px}
.ntticks span:first-child{transform:none}.ntticks span:last-child{transform:translateX(-100%)}
.lg{display:inline-block;width:12px;height:8px;border-radius:2px;vertical-align:middle}
.lg.nt{background:var(--nt)}.lg.heat{background:var(--bad)}.lg.ready{width:3px;height:10px;background:var(--bad)}
.catgrp{border-top:1px solid var(--line);padding:10px 0}
.catgrp>summary{cursor:pointer;font-size:15px}
.catgrp>summary .tiny,.catman>summary .tiny{margin-left:8px}
.catman{margin:6px 0 0 14px}
.catman>summary{cursor:pointer;padding:4px 0}
.catman .scroll{margin:6px 0 4px}
.help h3{font-size:16px;margin:0 0 8px}
.help ol,.help ul{margin:6px 0 10px;padding-left:22px}
.help li{margin:4px 0}
.help code{background:var(--surface-2);padding:1px 6px;border-radius:5px;font-size:13px}
.help table{margin:6px 0 10px}
.helpstep{border:1px solid var(--line);border-radius:10px;padding:14px 16px;margin:12px 0}
.helpstep.admin{border-left:4px solid var(--accent)}
#ntPaste{width:100%;margin-top:6px}
label.sig{display:block;padding:6px 0;line-height:1.4}label.sig input{width:auto;margin:0 6px 0 0;vertical-align:middle}label.sig .tiny{display:block;margin-left:24px;color:var(--mut,#9aa4b1)}
/* přihlášení – ilustrace na pozadí */
.loginbg{position:fixed;inset:0;z-index:-1;overflow:hidden;pointer-events:none}
.loginbg svg{width:100%;height:100%;display:block}
.loginbg{color-scheme:light;--tx:#0b0b0b;--tx-3:#7a7974;--line:#e2e0db;--accent:#d9661f;--good:#1f8a4c;--sky1:#cfe3f4;--sky2:#f3f2ef;--hill:#e3e0d6;--wall:#ebe7de;--roof:#9a5a3c;--win:#bcd6ea;--panel:#1f3550;--pline:#5d7fa6;--app:#fcfcfbee;--dot:#d6d3cc;--chip:#ffffff}
.lg-s1{stop-color:var(--sky1)}.lg-s2{stop-color:var(--sky2)}
.lg-hill{fill:var(--hill)}.lg-wall{fill:var(--wall)}.lg-roof{fill:var(--roof)}.lg-win{fill:var(--win)}
.lg-panel{fill:var(--panel);stroke:var(--pline);stroke-width:2}.lg-pline{stroke:var(--pline);stroke-width:1.5;fill:none}
.lg-app{fill:var(--app)}.lg-dot{fill:var(--dot)}
.lg-pipe{fill:none;stroke:var(--line);stroke-width:10;stroke-linecap:round}
.lg-flow{fill:none;stroke:var(--accent);stroke-width:5;stroke-linecap:round;stroke-dasharray:14 22;animation:lgflow 1.6s linear infinite}
.lg-curve{fill:none;stroke:var(--accent);stroke-width:4;opacity:.55;stroke-dasharray:900;stroke-dashoffset:900;animation:lgdraw 3s ease-out .4s forwards}
.lg-cutline{stroke:var(--accent);stroke-width:3;opacity:.8}
.lg-chip{fill:var(--chip);stroke:var(--line);stroke-width:1.5}
.lg-k{font:500 18px system-ui,sans-serif;fill:var(--tx-3)}.lg-v{font:700 26px system-ui,sans-serif;fill:var(--tx)}
.lg-v.hot{fill:var(--accent)}.lg-v.nt{fill:var(--good)}
.lg-chips>g{animation:lgfloat 6s ease-in-out infinite}.lg-chips>g:nth-child(2){animation-delay:-1.5s}
.lg-chips>g:nth-child(3){animation-delay:-3s}.lg-chips>g:nth-child(4){animation-delay:-4.5s}
.lg-rays{transform-origin:300px 210px;animation:lgspin 40s linear infinite}
@keyframes lgflow{to{stroke-dashoffset:-36}}
@keyframes lgdraw{to{stroke-dashoffset:0}}
@keyframes lgspin{to{transform:rotate(360deg)}}
@keyframes lgfloat{50%{translate:0 -8px}}
@media (prefers-reduced-motion:reduce){.loginbg *{animation:none !important}.lg-curve{stroke-dashoffset:0}}
.login{position:relative;box-shadow:0 18px 50px rgba(0,0,0,.28);backdrop-filter:blur(6px)}
@media (max-width:700px){.loginbg svg{width:auto;height:100%;aspect-ratio:16/9;max-width:none;margin-left:-14vh}}
.lg-link{fill:none;stroke:var(--accent);stroke-width:3;stroke-dasharray:4 10;stroke-linecap:round;opacity:.8;animation:lgflow 1.2s linear infinite}
.lg-phone{filter:drop-shadow(0 24px 40px rgba(0,0,0,.22))}
.lg-ph-body{fill:#1d1f24}.lg-ph-scr{fill:#fcfcfb}
.lg-ph-t{font:700 20px system-ui,sans-serif;fill:#0b0b0b}
.lg-ph-k{font:500 15px system-ui,sans-serif;fill:#7a7974}
.lg-ph-v{font:700 24px system-ui,sans-serif;fill:#0b0b0b}.lg-ph-v.hot{fill:var(--accent)}.lg-ph-v.inv{fill:#fff}
.lg-ph-tank{fill:#2a78d6}.lg-ph-hot{fill:#eb6834}
.lg-ph-pipe{fill:none;stroke:#c9c6bf;stroke-width:5}
.lg-ph-flow{fill:none;stroke:#eb6834;stroke-width:5;stroke-dasharray:8 10;animation:lgflow 1s linear infinite}
.lg-ph-bar{fill:#f0efec}.lg-ph-nt{fill:#a9a7a0}.lg-ph-heat{fill:#c53030;opacity:.85}
.lg-ph-btn{font:700 16px system-ui,sans-serif;fill:#fff}
