@font-face{font-family:system-fallback;src:local("Segoe UI")}
:root{--ink:#203a40;--muted:#687d81;--line:#dfe7e6;--canvas:#f2f5f3;--teal:#21675c;--orange:#c77a4d;--red:#ba3434;--blue:#5387a3;--radius:18px;font-family:Inter,system-fallback,system-ui,sans-serif;color:var(--ink);background:var(--canvas);font-size:15px}
*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button,a,input,summary,select{touch-action:manipulation}a{color:var(--teal)}button{cursor:pointer;border:1px solid var(--line);border-radius:8px;background:white;color:var(--ink);padding:10px 15px;font-weight:600}button:hover{background:#edf3ef}button:focus-visible,a:focus-visible,summary:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #63a6b9;outline-offset:3px}button.primary{background:var(--teal);color:white;border-color:var(--teal);padding:13px 22px}.secondary{background:transparent}.text-button{padding:6px 3px;background:none;border:0;font-weight:500}h1,h2,p{margin-top:0}h1{font-size:36px;letter-spacing:-1.2px;font-weight:650;margin-bottom:10px}h2{font-size:18px;font-weight:650;letter-spacing:-.3px}p{line-height:1.6}.muted{color:var(--muted)}.eyebrow{font-size:10px;font-weight:750;letter-spacing:1.8px;color:var(--teal);margin-bottom:13px}.topbar{height:82px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 max(32px,calc((100vw - 1440px)/2));gap:20px}.brand{font-size:27px;font-weight:800;letter-spacing:-1px;display:flex;align-items:center;gap:16px;text-decoration:none;color:var(--teal)}.brand span{font-size:9px;font-weight:700;letter-spacing:2px;line-height:1.4;max-width:90px;padding-left:15px;border-left:1px solid var(--line)}nav{display:flex;align-items:center;gap:25px;font-size:13px}nav a{text-decoration:none}nav form{margin:0}.shell{max-width:1504px;margin:auto;padding:40px 32px 24px}.page-title{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:22px}.page-title .muted{margin-bottom:0}.demo-pill{color:#856331;background:#faf0d9;padding:8px 12px;border-radius:30px;font-size:11px}.demo-note{border:1px solid #e8d8b5;border-radius:9px;padding:10px 15px;background:#fff8e8;color:#7c632f;font-size:12px;margin-bottom:12px}.connection{font-size:12px;color:var(--muted);margin:0 0 17px;min-height:18px}.connection.failed{color:var(--red);font-weight:650}.dashboard-grid{display:grid;grid-template-columns:minmax(0,3fr) minmax(290px,1fr);gap:22px;align-items:start}.tile{background:white;border:1px solid var(--line);border-radius:var(--radius);padding:23px;min-width:0;box-shadow:0 3px 12px #23372e03}.tile-station{grid-row:span 2}.tile-title{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:19px}.tile-title h2{margin:0}.tag{font-size:10px;letter-spacing:.3px;color:var(--muted);padding:6px 9px;background:#f3f6f5;border-radius:5px;white-space:nowrap}.station-summary{display:flex;align-items:center;gap:7px;flex-wrap:wrap;padding-bottom:18px;border-bottom:1px solid #eef2f1;font-size:10px}.station-summary>.text-button{margin-left:auto;font-size:11px}.badge{padding:6px 9px;border-radius:5px;background:#f1f4f3;color:#647a7e;white-space:nowrap}.badge.on{background:#e9f2ec;color:#2f6c52}.badge.off{background:#eff3f6;color:#647d8e}.fault-detail{position:relative;margin-left:4px}.fault-detail summary{cursor:pointer;color:var(--red);font-weight:650}.fault-detail p{position:absolute;right:0;top:20px;width:260px;padding:14px;background:white;border:1px solid #ecc9c9;border-radius:9px;z-index:10;font-size:13px;box-shadow:0 8px 25px #263f441c}.fault-detail[hidden]{display:none}.schema-scroll{overflow:auto;padding:15px 0 5px}.station-svg{display:block;width:100%;height:auto;min-width:650px}.zone{fill:#f6f8f7}.zone-title{font-size:12px;letter-spacing:2px;fill:#667e82;font-weight:650}.pipe{fill:none;stroke-width:5;stroke-linejoin:round;stroke-linecap:round}.primary{stroke:#425d63}.secondary{stroke:#647f89}.flow{fill:none;stroke:#647880;stroke-width:2;marker-end:url(#arrow)}.pipe-label{fill:#667d83;font-size:13px}.component{fill:#6a7d81;font-size:13px}.sensor{fill:white;stroke:#5c737b;stroke-width:2}.sensor text{stroke:none;fill:#6a7d81;font-size:13px}.valve{stroke:#4c656c;stroke-width:2;fill:white}.valve text{stroke:none;fill:#4c656c;font-size:15px}.hx{fill:#dfe5e5;stroke:#4c656c;stroke-width:2}.hx.on{fill:url(#hx-hot)}.hx.off{fill:url(#hx-off)}.hx-line{stroke:#546d74;stroke-width:2}.radiator{stroke:#738b92;stroke-width:2;fill:#fff}.pump{stroke:#5f7982;fill:#fff;stroke-width:2}.pump.running{stroke:#37806c;fill:#e9f4ec}.pump.running path{fill:#7cae9a}.field-label{fill:#687f83;font-size:11px;letter-spacing:.8px;font-weight:600}.big-value{fill:#275665;font-size:30px;font-weight:650}.medium-value{fill:#284e57;font-size:23px;font-weight:620}.small-value{fill:#284e57;font-size:20px;font-weight:600}.pump-value{fill:#285c51;font-size:20px;font-weight:650}.tank-value{fill:#603d2c;font-size:25px;font-weight:650}.tank-outline{fill:none;stroke:#5c777c;stroke-width:2}.circulation{stroke:#91a2a4;stroke-dasharray:6 6;stroke-width:3}#tank-fill{fill:#e1e6e7}#tank-fill.on{fill:url(#tank-hot)}#tank-fill.off{fill:#c5d8e5}.tap{fill:none;stroke-width:8;stroke-linejoin:round;stroke-linecap:round}.tap.hot{stroke:#bd7756}.tap.cold{stroke:#6292ad}.station-svg .is-stale{fill:var(--red)}.station-svg .is-missing{fill:#91a1a3}.station-foot{border-top:1px solid var(--line);padding-top:15px;display:flex;gap:12px;align-items:center;justify-content:space-between;font-size:10px;line-height:1.6}.station-foot>div{display:flex;align-items:center;flex-wrap:wrap;gap:6px}#oldest{color:#111}#oldest.stale{color:var(--red);font-weight:650}.live-dot{width:5px;height:5px;border-radius:50%;background:#4e8c76;display:inline-block}.legend{display:flex;align-items:center;gap:5px;white-space:nowrap;font-size:9px}.legend i{height:7px;width:7px;border-radius:2px;margin-left:4px}.legend-hot{background:#d99673}.legend-cold{background:#bfd3e1}.legend-unknown{background:#dce2e2}.station-note{font-size:11px;color:var(--muted);margin:10px 0}.source-details{font-size:12px;margin-top:13px}.source-details summary{cursor:pointer;color:var(--teal)}.table-scroll{overflow:auto}table{border-collapse:collapse;width:100%;margin:15px 0;font-size:12px;text-align:left}th{color:var(--muted);font-size:10px;text-transform:uppercase;letter-spacing:.5px}td,th{padding:11px 10px;border-bottom:1px solid var(--line);white-space:nowrap}.temperature-row{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #edf1f0;padding:15px 0;gap:10px}.temperature-row:first-child{padding-top:4px}.temperature-row:last-child{border:0;padding-bottom:0}.temperature-row .name{font-size:12px}.temperature-row small{display:block;color:var(--muted);font-size:10px;margin-top:5px}.temperature-row .value{font-size:24px;font-weight:600;white-space:nowrap;letter-spacing:-.5px}.temperature-row .value span{font-size:12px;font-weight:400;color:var(--muted)}.is-stale{color:var(--red)}.operation-row{display:flex;justify-content:space-between;gap:14px;align-items:start;font-size:12px;padding:11px 0;border-bottom:1px solid #edf1f0}.operation-row:last-child{border:0}.operation-row strong{text-align:right;font-size:11px;max-width:58%;line-height:1.5}.operation-row small{display:block;font-size:10px;font-weight:400;color:var(--muted)}.operation-row .alert{color:var(--red)}.page-footer{display:flex;justify-content:space-between;margin-top:25px;color:#829291;font-size:10px;letter-spacing:.3px}.empty{padding:25px}.auth{max-width:430px;margin:10vh auto;padding:28px}.auth h1{font-size:32px;margin-top:25px}.auth>.brand{margin-bottom:60px}.auth label{display:block;margin:18px 0}.auth input{display:block;width:100%;margin-top:8px}.auth button.primary{width:100%;margin-top:12px}input,select{border:1px solid #cedbd8;border-radius:7px;padding:10px;background:#fff;color:var(--ink);max-width:100%}input[type=checkbox]{width:17px;height:17px;accent-color:var(--teal)}label{font-size:12px}dialog{border:1px solid var(--line);border-radius:18px;padding:28px;width:520px;max-width:calc(100vw - 30px);box-shadow:0 25px 90px #152d3933}dialog::backdrop{background:#183b4455;backdrop-filter:blur(3px)}.dialog-title{display:flex;justify-content:space-between;align-items:center}.dialog-title button{font-size:22px;border:0;padding:0 8px}.dialog-title h2{margin:0}.layout-row{display:flex;align-items:center;justify-content:space-between;gap:15px;border-top:1px solid var(--line);padding:16px 0}.check{display:flex!important;align-items:center;gap:9px}.order-label{font-size:10px;color:var(--muted)}.order-label input{width:65px;display:block;margin-top:4px}.layout-row:last-child{margin-bottom:15px}.admin>section{margin:25px 0}.admin-form{display:flex;gap:16px;align-items:end;flex-wrap:wrap}.admin-form label{display:flex;flex-direction:column;gap:6px}.admin-form .check{flex-direction:row}.user-row{padding:20px 0;border-top:1px solid var(--line)}.user-row strong{min-width:130px;align-self:center}.error{color:var(--red)}.error:empty{display:none}.zoomed{position:fixed;inset:0;background:white;z-index:100;overflow:auto;padding:60px 20px 20px}.zoomed .station-svg{width:max(100%,1100px)}.zoom-close{position:fixed;right:20px;top:15px;z-index:101}.connection-lost .badge{opacity:.6}
@media(min-width:1550px){.station-svg{min-width:0}.shell{padding-top:45px}.tile{padding:26px}}
@media(max-width:1150px){.dashboard-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.tile-station{grid-column:1/-1;grid-row:auto}.station-svg{min-width:0}.station-summary{font-size:11px}}
@media(max-width:650px){h1{font-size:29px}.topbar{padding:0 18px;height:70px}.brand{font-size:23px;gap:10px}.brand span{font-size:8px;padding-left:10px}nav{gap:12px;font-size:11px}.demo-pill{font-size:9px;padding:6px 8px}.shell{padding:25px 14px 15px}.page-title{align-items:start;gap:12px;flex-direction:column}.page-title .muted{font-size:13px}.page-title button{font-size:12px;padding:8px 12px}.dashboard-grid{display:flex;flex-direction:column;gap:15px}.tile{width:100%;padding:17px;border-radius:13px}.tile-title{gap:7px}.tile-title h2{font-size:16px}.tag{font-size:9px}.station-svg{min-width:760px}.schema-scroll{margin-right:-8px}.station-foot{align-items:start;flex-direction:column;font-size:10px}.station-summary>.text-button{margin-left:0}.station-summary{gap:5px}.station-summary .badge{font-size:10px}.page-footer{gap:15px;font-size:9px}.admin-form{flex-direction:column;align-items:stretch}.auth{margin-top:4vh}.auth>.brand{margin-bottom:30px}}
@media(prefers-reduced-motion:no-preference){button,a{transition:background .15s ease}}

/* Independent desktop columns: expanded station details do not displace the right stack. */
.layout-column{display:flex;flex-direction:column;gap:22px;min-width:0}.layout-column>.tile{width:100%}
.dashboard-grid.station-right{grid-template-columns:minmax(290px,1fr) minmax(0,3fr)}
.dashboard-grid.no-station{grid-template-columns:repeat(2,minmax(0,1fr))}
.mobile-schema-hint{display:none}
@media(max-width:650px){.mobile-schema-hint{display:block;font-size:10px;color:var(--muted);margin:12px 0 0}}

#fault-status{cursor:pointer}#fault-status:focus-visible{outline:2px solid #63a6b9}.station-svg .fault-ok{fill:#248052}.station-svg .fault-active{fill:#ba3434}.page-title .eyebrow{margin-bottom:0}

.temp-cold{color:#2259aa}.temp-hot{color:#b32c28}.theme-toggle{font-size:12px;padding:7px 10px}.auth>.theme-toggle{float:right}
:root[data-theme=dark]{color-scheme:dark;--canvas:#000;--ink:#e4eeee;--line:#344344;--muted:#a5b8b8;--teal:#78c8ad;--red:#ff8581;background:#000}
[data-theme=dark] :is(.tile,.topbar,dialog,input,select,button,.zoomed){background:#101616;color:var(--ink)}
[data-theme=dark] button.primary{background:#225c50;color:white}
[data-theme=dark] :is(.tag,.badge,.badge.off){background:#263236;color:#cbd8db}
[data-theme=dark] .badge.on{background:#183e31;color:#ace1c6}
[data-theme=dark] .zone{fill:#182223}
[data-theme=dark] .station-svg :is(.field-label,.component,.pipe-label,.zone-title){fill:#a7bdc0}
[data-theme=dark] .station-svg :is(.big-value,.medium-value,.small-value,.pump-value){fill:#e5efef}
[data-theme=dark] .station-svg .tank-value{fill:#172325}
[data-theme=dark] #tank-fill.off{fill:#6495bd}
#tank-fill.off{fill:#8bb6da}
[data-theme=dark] .station-svg .is-stale,[data-theme=dark] .station-svg .fault-active{fill:#ff8581}
[data-theme=dark] .station-svg .fault-ok{fill:#83dba6}
[data-theme=dark] #oldest{color:#eef3f3}[data-theme=dark] #oldest.stale{color:#ff8581}
[data-theme=dark] .temp-cold{color:#85b8ff}[data-theme=dark] .temp-hot{color:#ff908c}
[data-theme=dark] :is(.temperature-row,.operation-row,.station-summary){border-color:var(--line)}
[data-theme=dark] .primary.pipe{stroke:#8fa9ad}
.service-strip{display:flex;align-items:center;flex-wrap:wrap;gap:.45rem 1rem;padding:.5rem 4%;border-bottom:1px solid var(--line);font-size:.87rem}.service-strip a{color:inherit}.service-env{margin-inline-start:auto;display:inline-flex;align-items:center;gap:.4rem}.service-env strong,.service-env button{padding:.25rem .55rem;font-size:.75rem}.service-item{display:inline-flex;align-items:center;gap:.25rem}.service-item details{position:relative}.service-item summary{cursor:pointer;list-style:none}.service-item details[open]>div{position:absolute;z-index:5;inset-inline-start:0;width:max-content;max-width:60vw;padding:.75rem;background:Canvas;color:CanvasText;border:1px solid var(--line);border-radius:.4rem}.service-item input{max-width:100%}.service-fields{display:flex;gap:1rem;align-items:end;flex-wrap:wrap;margin:1rem 0;border:1px solid var(--line)}.service-fields label,.service-item label{display:grid;gap:.25rem}.service-fields label:last-child{display:block}
@media(max-width:600px){.service-item details[open]>div{position:static}.service-item{flex-wrap:wrap}.service-fields label{width:100%}}
.history-chart{padding:0 1rem 1rem}.history-range{margin-inline-start:auto;white-space:nowrap;font-size:.85rem}.history-range select{color:inherit;background:var(--paper,Canvas);border:1px solid var(--line);border-radius:5px;padding:.3rem}.history-chart svg{display:block;width:100%;height:185px;cursor:crosshair}.history-chart svg text{fill:currentColor;font:10px system-ui}.history-chart .grid-line{stroke:var(--line)}.history-legend{display:flex;gap:.25rem .8rem;flex-wrap:wrap;font-size:.78rem}.history-detail{font-size:.78rem;margin:.5rem 0 0}
@media(min-width:1151px){
 .layout-main{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-content:start;align-items:start;gap:22px;min-width:0}
 .layout-main>.tile{grid-row:auto;grid-column:span 2;min-width:0}
 .layout-main>[data-size=medium]{grid-column:span 1}
 .dashboard-grid:has(.layout-column:empty){grid-template-columns:minmax(0,1fr)}
 .layout-column:empty{display:none}
}
@media(min-width:651px) and (max-width:1150px){.dashboard-grid>[data-size=large]{grid-column:1/-1}}
.layout-row{flex-wrap:wrap}.layout-row select{max-width:100%;font:inherit;color:inherit;background:Canvas;color:CanvasText}.history-chart .zero-line{stroke:currentColor;stroke-width:1.4}

.tile-title:has(.history-range){flex-wrap:wrap}.history-range{display:flex;align-items:center;flex-wrap:wrap;gap:.3rem}.history-range button{padding:.3rem .55rem}.history-range button:disabled{opacity:.45}.history-period{display:block;color:var(--muted)}

.service-strip{max-width:1504px;margin-inline:auto;padding-inline:32px}
.daily-expanded{display:flex;flex-wrap:wrap;gap:20px;margin-top:15px}.daily-expanded>.table-scroll{flex:1 1 280px;min-width:0}.daily-plot{flex:2 1 420px;min-width:0;max-width:100%}.daily-plot .history-chart{padding:10px 0}.daily-plot .history-range{justify-content:flex-end}.history-legend label{display:inline-flex;align-items:center;gap:3px}
@media(max-width:650px){.service-strip{padding-inline:14px}}

.page-tabs{border-bottom:1px solid var(--line);margin-bottom:20px;gap:8px;flex-wrap:wrap}.page-tabs a{padding:10px 15px;color:var(--muted);border-bottom:3px solid transparent}.page-tabs a[aria-current=page]{color:var(--teal);border-color:var(--teal);font-weight:650}.daily-open{font-size:12px}.dashboard-grid.daily-page{display:block}.daily-page .tile{width:100%}.daily-page .history-chart svg{height:360px}.daily-page .daily-expanded>.table-scroll{flex:1 1 280px}.daily-page .daily-plot{flex:3 1 500px}
@media(max-width:650px){.daily-page .history-chart svg{height:270px}}

.tile-title:has(.daily-open){flex-wrap:wrap}.tile-title .daily-open{margin-inline-start:auto;white-space:nowrap}
.cervenka-overview{display:flex;flex-wrap:wrap;align-items:center;gap:28px;margin-bottom:24px}
.thermostat{flex:0 0 230px;width:230px;height:230px;border-radius:50%;padding:27px;background:linear-gradient(145deg,#fff,#d5dadb);border:1px solid #c5cccd;box-shadow:0 6px 16px #142f3520,inset 0 0 0 5px #f4f6f6;color:#24382f}
.thermostat:hover{background:linear-gradient(145deg,#fff,#cdd7d8)}
.thermostat-face{display:flex;align-items:center;justify-content:center;width:100%;height:100%;border-radius:50%;border:9px solid #9fa9ab;background:linear-gradient(#cad1d0,#a8b5b2);box-shadow:inset 0 2px 7px #25393230}
.thermostat-screen{display:flex;flex-direction:column;gap:5px;align-items:center;font-size:11px;font-weight:500}
.thermostat-screen strong{font-size:26px;line-height:1.15;font-variant-numeric:tabular-nums}
.cervenka-readings{flex:1 1 280px;min-width:0;min-height:230px}
.cervenka-readings table{margin-top:0}.cervenka-readings td{font-size:19px;font-variant-numeric:tabular-nums;padding-inline:6px}
.cervenka-readings th{font-size:12px;letter-spacing:0;text-transform:none}
.cervenka-status{font-size:11px}
#cervenka-dialog input{display:block;margin:10px 0 16px}
[data-theme=dark] .thermostat{background:linear-gradient(145deg,#c0c8c9,#717d7e);border-color:#8a9697;color:#172c24}
[data-theme=dark] .thermostat-face{border-color:#647275;background:#b4c4bd}
@media(max-width:650px){.cervenka-overview{justify-content:center;gap:18px}.cervenka-readings{min-height:0}.cervenka-readings td{font-size:16px}}

.user-access{margin:0 0 24px}.user-access summary{cursor:pointer;padding:10px 0;color:var(--teal)}.user-access fieldset{border:1px solid var(--line);border-radius:8px;margin:15px 0;padding:15px}.access-row{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:9px 0;flex-wrap:wrap}.access-row select{max-width:100%}

.webcam-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:16px}
.webcam-grid.webcam-single{grid-template-columns:1fr}
.webcam-grid figure{margin:0;min-width:0}
.webcam-grid h3{margin:0 0 6px}
.webcam-time{font-size:.85rem}
.webcam-time.webcam-stale{color:#dc3535;font-weight:700}
.webcam-preview{padding:0;width:100%;border:0;background:transparent;cursor:zoom-in}
.webcam-preview img{display:block;width:100%;height:auto}
.webcam-dialog{width:max-content;max-width:95vw;max-height:95vh}
.webcam-full{overflow:auto;max-width:90vw;max-height:72vh}
.webcam-full img{display:block;max-width:none;height:auto}
.webcam-close{float:right}

.webcam-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.webcam-grid[data-columns="1"],.webcam-grid.webcam-single{grid-template-columns:minmax(0,1fr)}
.webcam-grid[data-columns="3"]{grid-template-columns:repeat(3,minmax(0,1fr))}
.webcam-grid[data-columns="4"]{grid-template-columns:repeat(4,minmax(0,1fr))}
.webcam-grid figure,.webcam-preview{min-width:0;max-width:100%}
.webcam-preview img{max-width:100%;width:100%;height:auto}
.webcam-dialog{width:max-content;max-width:96vw;height:auto;max-height:96vh;overflow:auto}
.webcam-full{max-width:none;max-height:none;overflow:visible}
.webcam-full img{width:auto!important;max-width:none!important;height:auto}
@media(max-width:600px){.webcam-grid[data-columns]{grid-template-columns:minmax(0,1fr)}}