:root{color-scheme:dark;--bg:#0c110f;--panel:#151d19;--line:#2a3730;--text:#edf4ee;--muted:#a3b4a8;--accent:#b9ef8b;--blue:#85c9e8;--amber:#f4cc80;--radius:20px;font:15px/1.5 system-ui,-apple-system,"Segoe UI",sans-serif}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);padding-bottom:calc(90px + env(safe-area-inset-bottom))}body.large{font-size:17px}button,input,select{font:inherit}button,a,input,select,summary{-webkit-tap-highlight-color:transparent}button{cursor:pointer;color:inherit;border:0;background:transparent}button:focus-visible,a:focus-visible,summary:focus-visible{outline:2px solid var(--accent);outline-offset:4px}button:disabled{opacity:.5;cursor:wait}header{max-width:1000px;margin:auto;padding:24px 22px 16px;display:flex;align-items:center;justify-content:space-between}.brand{display:flex;gap:12px;align-items:center;text-decoration:none;color:inherit;font-size:13px;font-weight:750;letter-spacing:1.7px}.brand small{display:block;font-size:12px;letter-spacing:0;color:var(--muted);font-weight:400;margin-top:1px}.logo{background:var(--accent);color:#18351b;font-size:26px;border-radius:14px;width:44px;height:44px;text-align:center;line-height:44px;letter-spacing:-3px}.logo span{color:#45813b}.icon-button{width:44px;height:44px;border:1px solid var(--line);border-radius:50%;font-size:24px}main{max-width:960px;margin:auto;padding:0 20px}.connection{display:flex;align-items:center;gap:8px;font-size:12px;background:#151e18;border:1px solid var(--line);border-radius:12px;padding:10px 12px;margin:5px 0 25px;color:var(--muted)}.dot{width:7px;height:7px;background:var(--muted);border-radius:100%;flex-shrink:0}.connection.online .dot{background:var(--accent)}.connection.online #connection-text{color:var(--accent)}.connection.offline .dot{background:var(--amber)}.connection time{margin-left:auto;white-space:nowrap}.eyebrow{font-size:10px;letter-spacing:2px;color:var(--muted);font-weight:600;margin:0 0 4px}h1{font-size:32px;letter-spacing:-1.1px;line-height:1.2;font-weight:650;margin:0 0 22px}h2{font-size:15px;line-height:1.4;font-weight:600;margin:0}p{margin:12px 0}.section-heading{display:flex;justify-content:space-between;align-items:center;gap:10px}.section-heading h1{margin-bottom:20px}.section-heading>.muted{font-size:11px}.cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-bottom:16px}.metric{padding:17px 16px;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);min-height:145px;position:relative}.metric .label{font-size:12px;color:var(--muted);display:flex;justify-content:space-between;gap:5px}.metric .value{font-size:37px;line-height:1.2;letter-spacing:-1.5px;margin-top:12px;font-variant-numeric:tabular-nums;font-weight:550}.metric .value small{font-size:16px;letter-spacing:0;color:var(--muted);padding-left:4px}.metric .detail{color:var(--muted);font-size:11px;margin-top:8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.metric.primary-metric{background:#1e2d20;border-color:#344e33}.metric.primary-metric .value{color:var(--accent)}.metric .bar{height:3px;background:#2c3830;position:absolute;bottom:16px;left:16px;right:16px;border-radius:4px;overflow:hidden}.metric .bar i{display:block;background:var(--accent);height:100%;width:0}.metric.has-bar{padding-bottom:28px}.panel{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:18px;margin-bottom:16px}.panel-heading{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:15px}.text-button{font-size:12px;color:var(--accent);padding:8px 0;white-space:nowrap}.legend{font-size:10px;color:var(--muted);white-space:nowrap}.legend i{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--accent);margin-left:8px;margin-right:4px}.legend i:nth-child(2){background:var(--blue)}canvas{display:block;width:100%;height:140px}.mini-history canvas{height:115px}.chart-labels{display:flex;justify-content:space-between;color:var(--muted);font-size:10px;margin-top:8px}.rows .row{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:12px 0;border-top:1px solid var(--line);font-size:13px}.rows .row:first-child{border-top:0;padding-top:0}.row .name{min-width:0;overflow-wrap:anywhere}.row .reading{white-space:nowrap;font-variant-numeric:tabular-nums;font-size:13px}.row small{display:block;color:var(--muted);font-size:11px}.muted{color:var(--muted);font-size:12px}.filters{display:flex;gap:10px}.filters input{min-width:0;flex:1}.filters select{width:130px}input,select{color:var(--text);border:1px solid var(--line);border-radius:12px;background:#101713;padding:12px;width:100%;min-height:46px;outline:none}input:focus,select:focus{border-color:var(--accent)}label{display:block;color:var(--muted);font-size:12px;margin-bottom:16px}label input,label select{margin-top:7px}.primary{border-radius:12px;background:var(--accent);color:#18351b;padding:13px 20px;font-weight:650;min-height:48px}.wide{width:100%}.danger{color:#ffb7a5;font-size:13px;border:1px solid #664137;border-radius:12px;width:100%;padding:12px}.table-wrap{padding:0;overflow:auto}table{border-collapse:collapse;width:100%;font-size:12px}th{text-align:left;color:var(--muted);font-weight:500;padding:14px 12px;border-bottom:1px solid var(--line)}td{padding:12px;border-bottom:1px solid var(--line)}td:first-child{overflow-wrap:anywhere;max-width:180px}td:nth-child(n+2),th:nth-child(n+2){text-align:right;white-space:nowrap}td small{display:block;color:var(--muted);font-size:10px}.pin{color:var(--muted);width:36px;height:36px;font-size:21px;flex-shrink:0}.pin.on{color:var(--accent)}.sensor-name{flex:1;min-width:0}.sensor-group{margin-top:18px}.sensor-group h2{margin-bottom:12px}.segments{display:flex;gap:6px;border:1px solid var(--line);padding:5px;border-radius:13px;background:var(--panel)}.segments button{padding:8px;border-radius:9px;flex:1;font-size:13px;color:var(--muted)}.segments button.selected{background:#344630;color:var(--accent)}nav{position:fixed;bottom:0;left:0;right:0;padding:8px 10px calc(8px + env(safe-area-inset-bottom));background:#111914f5;border-top:1px solid var(--line);display:flex;justify-content:center;z-index:5}nav button{display:flex;flex:1;max-width:150px;flex-direction:column;align-items:center;gap:1px;color:var(--muted);font-size:10px;min-height:48px;border-radius:13px}nav button span{font-size:23px;line-height:28px}nav button.active{color:var(--accent);background:#23311f}details summary{cursor:pointer;font-size:13px;min-height:25px}dialog{background:var(--panel);color:var(--text);border:1px solid var(--line);border-radius:22px;width:calc(100% - 32px);max-width:440px;padding:22px}dialog::backdrop{background:#000a}#toast{position:fixed;bottom:100px;left:20px;right:20px;margin:auto;max-width:450px;background:#344630;color:var(--text);padding:14px;border-radius:12px;z-index:10}#login-error{color:#ffb7a5}body:not(.authenticated) nav,body:not(.authenticated) section[data-page]{display:none}[hidden]{display:none!important}.empty{color:var(--muted);font-size:12px;padding:12px 0}.history-metric{font-size:26px;letter-spacing:-.7px;font-variant-numeric:tabular-nums}.sensor-group .row{gap:8px}.offline-values .metric .value{color:#a5b2a5}.event{border-top:1px solid var(--line);padding:12px 0;font-size:12px;overflow-wrap:anywhere}.event p{font-size:11px;color:var(--muted)}@media(min-width:700px){.cards{grid-template-columns:repeat(4,minmax(0,1fr))}main{padding:0 26px}header{padding:28px 26px 20px}.metric{min-height:155px}.metric .value{font-size:36px}.connection{margin-bottom:30px}nav{left:50%;right:auto;transform:translateX(-50%);bottom:16px;width:560px;border:1px solid var(--line);border-radius:20px;padding:8px}h1{font-size:38px}canvas{height:180px}}
