:root{font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#183833;background:#f5f5ef;font-synthesis:none;--green:#24664e;--muted:#708079;--border:#e1e6dd}*{box-sizing:border-box}body{margin:0}button,a,summary{-webkit-tap-highlight-color:transparent}.topbar{height:88px;padding:0 max(32px,calc((100vw - 1344px)/2));background:#122b29;color:#eff6ed;display:flex;align-items:center;justify-content:space-between}.brand{display:flex;align-items:center;gap:15px;font-size:13px;font-weight:750;letter-spacing:2.5px}.brandmark{font-size:47px;letter-spacing:-6px;font-weight:500;line-height:1}.brandmark span{color:#c4db76}.brand-sub{display:block;font-size:8px;letter-spacing:2px;color:#a6bcb1;margin-top:5px}.connection{display:flex;align-items:center;gap:9px;font-size:12px;color:#bfd1c7}.dot,.tiny-dot{height:7px;width:7px;border-radius:50%;background:#8b9c91;display:inline-block}.connection.ok .dot{background:#c4db76}.connection.bad .dot{background:#efb87e}main{max-width:1408px;margin:auto;padding:0 32px}.intro{display:flex;justify-content:space-between;align-items:flex-end;padding:45px 0 35px}.eyebrow{font-size:10px;font-weight:700;letter-spacing:2px;color:#587c65}h1{font-size:clamp(32px,3.2vw,48px);letter-spacing:-1.9px;line-height:1.11;font-weight:550;margin:15px 0}h1 span{color:#718578}.intro p{font-size:14px;color:#708079;margin:18px 0 0}.clock{text-align:right;padding-bottom:3px;font-variant-numeric:tabular-nums}.clock #date{font-size:13px;color:#718578}.clock #time{font-size:31px;letter-spacing:-1px;margin:8px 0 7px}.clock>span{font-size:10px;color:#718578}.summary{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--border);background:#fff;border-radius:12px;padding:23px 0}.summary article{padding:0 24px;border-right:1px solid var(--border)}.summary article:last-child{border:0}.metric-label{display:block;color:#75837c;font-size:9px;letter-spacing:1.3px;font-weight:650}.summary strong{display:block;font-size:32px;letter-spacing:-1px;font-weight:550;margin:12px 0 8px;font-variant-numeric:tabular-nums}.summary small{font-size:15px;letter-spacing:0;color:#89958d;font-weight:400}.metric-note{font-size:10px;color:#89958d}.section-head{display:flex;align-items:center;justify-content:space-between;margin:34px 0 18px}.section-head h2{font-weight:550;font-size:20px;letter-spacing:-.5px;margin:0}.section-head>span{font-size:11px;color:#89958d;display:flex;align-items:center;gap:7px}.tiny-dot{width:5px;height:5px;background:#8ca490}.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;align-items:start}.device-card{border:1px solid var(--border);background:#fff;border-radius:13px;padding:24px 24px 0;min-width:0;overflow:hidden}.card-top{display:flex;justify-content:space-between;align-items:center;gap:8px}.device-kind{font-size:8px;letter-spacing:1.5px;color:#92a092;font-weight:650}h3{font-size:22px;letter-spacing:-.6px;font-weight:600;margin:7px 0 0}.status-tag{display:flex;align-items:center;gap:5px;background:#f0f6eb;color:#68815e;border-radius:30px;padding:5px 8px;font-size:9px;white-space:nowrap}.status-tag i{height:4px;width:4px;border-radius:50%;background:currentColor}.charge-area{display:flex;align-items:center;justify-content:space-between;margin:23px 0 16px}.soc-value{display:flex;align-items:baseline;gap:3px}.soc{font-size:54px;font-weight:500;letter-spacing:-2.5px;line-height:1;font-variant-numeric:tabular-nums}.percent{font-size:21px;color:#a4afa4;letter-spacing:-.5px}.charge-description{display:flex;align-items:center;gap:6px;font-size:11px;color:#527d63}.charge-icon{font-size:18px}.battery-track{position:relative;width:100%;height:11px;background:#edf0e8;border-radius:3px;overflow:hidden}.battery-fill{height:100%;background:#b9d877;width:0%;transition:width .7s;border-radius:3px}.battery-grid{position:absolute;inset:0;background:repeating-linear-gradient(90deg,transparent,transparent calc(10% - 2px),#fff9 calc(10% - 2px),#fff9 10%)}.power-row{display:grid;grid-template-columns:1fr 1fr;padding:24px 0 17px;gap:12px}.power-row>div:last-child{border-left:1px solid #edf0e8;padding-left:18px}.power-label{font-size:10px;color:#89968c;display:block}.power-row strong{display:block;font-size:20px;letter-spacing:-.4px;font-weight:550;margin-top:8px}.power-row small{font-size:11px;color:#89968c;font-weight:400;letter-spacing:0}.rule-line{background:#f4f7ed;border-radius:5px;padding:9px 10px;font-size:10px;color:#73815b;margin-bottom:12px;line-height:1.4}.rule-line.active{background:#fff2dc;color:#9e681b}.rule-line.restoring{background:#eaf4f1;color:#317061}.rule-line.unknown{background:#f3f3f0;color:#92998f}details{border-top:1px solid #eef0e9}summary{cursor:pointer;list-style:none;font-size:10px;color:#8b978c;display:flex;justify-content:space-between;padding:12px 0}summary::-webkit-details-marker{display:none}summary span{font-size:14px;line-height:1}details[open] summary span{transform:rotate(45deg)}summary:focus-visible{outline:2px solid #57946c;outline-offset:2px}.detail-values{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin:0 0 16px;font-size:10px}.detail-values dt{color:#849083}.detail-values dd{margin:0;text-align:right;overflow-wrap:anywhere}.card-footer{margin:0 -24px;padding:13px 24px;border-top:1px solid #eef0e9;background:#fcfcf9;display:flex;justify-content:space-between;font-size:9px;color:#9ba598;gap:5px}.device-card.stale .status-tag{background:#fff2df;color:#a87e42}.device-card.missing .status-tag{background:#f0f1ed;color:#91998d}.device-card.stale .soc,.device-card.stale .power-row strong{color:#8e998f}.device-card.stale .battery-fill{background:#cbd1c2}.device-card.stale .charge-description{color:#929b8e}.notice,.error{padding:12px 17px;font-size:12px;line-height:1.5;margin-top:20px;border-radius:7px;background:#fff1d7;color:#92631a}.error{background:#fbe9e3;color:#a24a35}footer{display:flex;justify-content:space-between;gap:20px;color:#9ba393;font-size:10px;padding:28px 0 34px;line-height:1.5}[hidden]{display:none!important}@media(min-width:1500px){.grid{grid-template-columns:repeat(4,minmax(0,1fr))}}@media(max-width:1050px){.grid{grid-template-columns:repeat(2,minmax(0,1fr))}.metric-note{line-height:1.5;display:block}.summary article{padding:0 18px}.metric-label{font-size:8px}}@media(max-width:640px){.topbar{height:72px;padding:0 20px}.brand{font-size:11px;gap:11px}.brandmark{font-size:40px}.connection{font-size:10px;max-width:140px}.brand-sub{font-size:7px}main{padding:0 18px}.intro{padding:30px 0 25px;display:block}.clock{margin-top:24px;display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;text-align:left}.clock #time{font-size:20px;margin:0}.clock>span{width:100%;font-size:9px}.intro p{line-height:1.6}.summary{grid-template-columns:1fr 1fr;padding:0}.summary article{padding:19px 17px;border-bottom:1px solid var(--border)}.summary article:nth-child(2){border-right:0}.summary article:nth-child(3){border-bottom:0}.summary article:last-child{border-bottom:0}.summary strong{font-size:28px}.metric-note{font-size:9px}.section-head>span{max-width:140px;font-size:9px;line-height:1.5}.grid{grid-template-columns:1fr}.device-card{padding-top:22px}.section-head{margin-top:28px}footer{display:block}footer span{display:block;margin-bottom:6px}}

/* Compact device cards */
.grid{grid-template-columns:repeat(6,minmax(0,1fr));gap:10px}
.device-card{padding:12px 12px 0;border-radius:9px}
.card-top{gap:4px}.device-kind{font-size:6px;letter-spacing:.7px}
h3{font-size:16px;margin-top:4px;letter-spacing:-.3px}
.status-tag{font-size:7px;padding:4px 5px;gap:3px}.status-tag i{height:3px;width:3px}
.charge-area{margin:12px 0 9px;gap:4px}.soc{font-size:32px;letter-spacing:-1.5px}.percent{font-size:14px}
.charge-description{font-size:8px;gap:3px}.charge-icon{font-size:12px}
.battery-track{height:6px;border-radius:2px}
.power-row{padding:12px 0 9px;gap:5px}.power-row>div:last-child{padding-left:8px}
.power-label{font-size:7px}.power-row strong{font-size:14px;margin-top:5px}.power-row small{font-size:8px}
.rule-line{font-size:7px;padding:5px 6px;margin-bottom:6px;line-height:1.4}
summary{font-size:8px;padding:8px 0}summary span{font-size:11px}
.detail-values{font-size:8px;gap:7px;margin-bottom:10px}
.card-footer{margin:0 -12px;padding:8px 12px;font-size:7px;gap:4px;flex-wrap:wrap}
@media(min-width:1500px){.grid{grid-template-columns:repeat(6,minmax(0,1fr))}}
@media(max-width:1100px){.grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:760px){.grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:600px){.grid{grid-template-columns:repeat(2,minmax(0,1fr))}.device-card{padding-top:12px}}
@media(max-width:350px){.grid{grid-template-columns:1fr}}

/* Volketswil weather: current conditions and next three calendar days */
.weather-intro{display:grid;grid-template-columns:minmax(260px,1fr) minmax(460px,1.25fr);align-items:center;gap:32px;padding:35px 0}
.weather-intro h1{font-size:clamp(30px,3.1vw,44px);letter-spacing:-1.5px;line-height:1.15}
.intro-title .clock{display:flex;gap:12px;align-items:baseline;text-align:left;margin-top:19px;padding:0}
.intro-title .clock #date{font-size:11px}.intro-title .clock #time{font-size:16px;letter-spacing:0;margin:0}
.weather-panel{background:#fff;border:1px solid var(--border);border-radius:12px;padding:15px 0 10px;min-width:0}
.weather-heading{display:flex;align-items:center;justify-content:space-between;padding:0 16px 14px;font-size:12px;color:#75837c}.weather-heading strong{font-weight:600;color:#183833}
.weather-days{display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}.weather-day{text-align:center;border-left:1px solid var(--border);padding:0 10px;min-width:0}.weather-day:first-child{border:0}
.weather-day-label{font-size:11px;color:#75837c;white-space:nowrap}.weather-icon{font-size:25px;line-height:33px;min-height:33px;margin:6px 0}
.weather-temperature{font-size:17px;font-weight:550;white-space:nowrap;font-variant-numeric:tabular-nums}.weather-now .weather-temperature{font-size:26px;line-height:21px}
.weather-detail{font-size:11px;color:#75837c;margin-top:7px;line-height:1.4}.weather-sun{font-size:11px;color:#527d63;margin-top:5px;line-height:1.4}
.weather-footer{display:flex;gap:10px;justify-content:space-between;border-top:1px solid var(--border);padding:9px 16px 0;margin-top:13px;font-size:10px;line-height:1.4;color:#89958d}.weather-footer a{color:#708079;text-decoration:underline;text-underline-offset:2px}.weather-panel.outdated .weather-footer{color:#a36d20}
.weather-empty{font-size:12px;color:#75837c;padding:20px 16px!important;margin:0!important}.weather-panel.outdated .weather-temperature{color:#89958d}
@media(max-width:1000px){.weather-intro{grid-template-columns:1fr;gap:24px}.weather-panel{max-width:650px}.intro-title .clock{margin-top:15px}}
@media(max-width:480px){.weather-intro{padding:28px 0}.weather-day{padding:0 5px}.weather-day-label{font-size:10px}.weather-temperature{font-size:15px}.weather-detail,.weather-sun{font-size:10px}.weather-footer{padding-left:12px;padding-right:12px;font-size:9px}.weather-heading{font-size:11px}.weather-now .weather-temperature{font-size:23px}}

.weather-icon{color:#65825c;display:flex;align-items:center;justify-content:center}.weather-icon svg{width:27px;height:27px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}