:root{--font: "Helvetica Neue", Helvetica, Arial, system-ui, sans-serif;--mono: "SF Mono", ui-monospace, "Cascadia Code", Menlo, monospace;--bg:#F4F1EC;--surface:#FFF;--surface-2:#FBF9F5;--raise:#FFF;--border:#E5E0D8;--border-strong:#D8D2C8;--text:#3D3935;--text-2:#6E665F;--text-3:#9A9188;--accent:#007DC2;--accent-2:#255C9E;--ok:#2E9E6B;--warn:#C6851A;--crit:#D64545;--unknown:#A8A096;--shadow:0 1px 2px rgba(61,57,53,.06),0 8px 24px rgba(61,57,53,.06)}@media(prefers-color-scheme:dark){:root{--bg:#26231F;--surface:#302C28;--surface-2:#34302B;--raise:#3A352F;--border:#453F39;--border-strong:#544D45;--text:#F2EEE8;--text-2:#C3BBB1;--text-3:#AFA99F;--accent:#31BBE5;--accent-2:#7DCBEA;--ok:#43C489;--warn:#E0A63A;--crit:#E5655F;--unknown:#8E867D;--shadow:0 1px 2px rgba(0,0,0,.3),0 10px 30px rgba(0,0,0,.28)}}:root[data-theme=light]{--bg:#F4F1EC;--surface:#FFF;--surface-2:#FBF9F5;--raise:#FFF;--border:#E5E0D8;--border-strong:#D8D2C8;--text:#3D3935;--text-2:#6E665F;--text-3:#9A9188;--accent:#007DC2;--accent-2:#255C9E;--ok:#2E9E6B;--warn:#C6851A;--crit:#D64545;--unknown:#A8A096;--shadow:0 1px 2px rgba(61,57,53,.06),0 8px 24px rgba(61,57,53,.06)}:root[data-theme=dark]{--bg:#26231F;--surface:#302C28;--surface-2:#34302B;--raise:#3A352F;--border:#453F39;--border-strong:#544D45;--text:#F2EEE8;--text-2:#C3BBB1;--text-3:#AFA99F;--accent:#31BBE5;--accent-2:#7DCBEA;--ok:#43C489;--warn:#E0A63A;--crit:#E5655F;--unknown:#8E867D;--shadow:0 1px 2px rgba(0,0,0,.3),0 10px 30px rgba(0,0,0,.28)}*{box-sizing:border-box}body{margin:0;font-family:var(--font);background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;letter-spacing:.1px}.mono{font-family:var(--mono);font-variant-numeric:tabular-nums}button{font-family:inherit;cursor:pointer}:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:6px}.sc-ok{--sc:var(--ok)}.sc-warn{--sc:var(--warn)}.sc-crit{--sc:var(--crit)}.sc-unknown{--sc:var(--unknown)}header{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:20px;padding:14px 28px;background:color-mix(in srgb,var(--surface) 88%,transparent);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid var(--border)}.brand{display:flex;align-items:baseline;gap:10px}.brand b{font-size:19px;font-weight:800;letter-spacing:-.3px}.brand .dot{width:6px;height:6px;border-radius:50%;background:var(--accent);align-self:center}.brand span{font-size:13px;color:var(--text-2);letter-spacing:.4px;text-transform:uppercase}.spacer{flex:1}.envtabs{display:flex;background:var(--surface-2);border:1px solid var(--border);border-radius:9px;padding:3px}.envtabs button{border:0;background:transparent;color:var(--text-2);font-size:12.5px;font-weight:600;padding:6px 12px;border-radius:6px}.envtabs button.on{background:var(--raise);color:var(--text);box-shadow:var(--shadow)}.envtabs button:disabled{color:var(--text-3);cursor:not-allowed}.meta{display:flex;align-items:center;gap:14px;color:var(--text-2);font-size:12.5px}.refresh{display:flex;align-items:center;gap:7px;border:1px solid var(--border);background:var(--surface-2);color:var(--text-2);border-radius:8px;padding:7px 11px;font-size:12.5px;font-weight:600}.pulse{width:7px;height:7px;border-radius:50%;background:var(--ok);animation:pulse 2.4s infinite}@keyframes pulse{0%{box-shadow:0 0 color-mix(in srgb,var(--ok) 60%,transparent)}70%{box-shadow:0 0 0 7px transparent}to{box-shadow:0 0 0 0 transparent}}@media(prefers-reduced-motion:reduce){.pulse{animation:none}}.user{width:30px;height:30px;border-radius:50%;background:linear-gradient(135deg,var(--accent),var(--accent-2));color:#fff;display:grid;place-items:center;font-size:12px;font-weight:700}.icon{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:2}main{max-width:1180px;margin:0 auto;padding:26px 28px 80px}.summary{display:grid;grid-template-columns:2.4fr 1fr 1fr;gap:14px;margin-bottom:30px}.sumcard{background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:18px 20px;box-shadow:var(--shadow)}.sumcard h3{margin:0 0 12px;font-size:11px;letter-spacing:.7px;text-transform:uppercase;color:var(--text-3);font-weight:700}.tally{display:flex;gap:26px;align-items:flex-end}.tally .n{font-size:34px;font-weight:800;line-height:1;letter-spacing:-1px}.tally .k{font-size:12px;color:var(--text-2);margin-top:5px}.tally .item{display:flex;flex-direction:column}.swatch{width:9px;height:9px;border-radius:2px;display:inline-block;margin-right:6px;vertical-align:1px}.chip{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:600}.chip .lbl{color:var(--text-2);font-weight:500}.sec{display:flex;align-items:center;gap:12px;margin:6px 0 14px}.sec h2{margin:0;font-size:14px;font-weight:700}.sec .badge{font-size:11px;font-weight:700;color:var(--text-3);background:var(--surface-2);border:1px solid var(--border);border-radius:20px;padding:3px 9px}.sec .rule{flex:1;height:1px;background:var(--border)}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(268px,1fr));gap:14px;margin-bottom:34px}.card{position:relative;background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:16px 16px 14px 19px;box-shadow:var(--shadow);cursor:pointer;overflow:hidden;transition:transform .12s ease,border-color .12s ease;text-align:left;width:100%}.card:hover{transform:translateY(-2px);border-color:var(--border-strong)}.card:before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--sc)}.card .top{display:flex;align-items:center;gap:9px}.status-dot{width:9px;height:9px;border-radius:50%;background:var(--sc);flex:none;box-shadow:0 0 0 3px color-mix(in srgb,var(--sc) 22%,transparent)}.card .name{font-size:14.5px;font-weight:700}.type{margin-left:auto;font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:var(--text-3);border:1px solid var(--border);border-radius:6px;padding:2px 6px}.state-label{font-size:11px;font-weight:700;letter-spacing:.4px;text-transform:uppercase;margin:10px 0 12px;color:var(--sc)}.vitals{display:flex;gap:6px}.vital{flex:1;min-width:0}.vital .vl{font-size:10px;color:var(--text-3);text-transform:uppercase;letter-spacing:.4px;white-space:nowrap}.vital .vv{font-size:15px;font-weight:700;margin-top:2px}.vital svg{display:block;margin-top:5px;width:100%;height:18px}.card .foot{display:flex;justify-content:space-between;align-items:center;margin-top:13px;padding-top:11px;border-top:1px solid var(--border);color:var(--text-3);font-size:11px}.card .foot .go{color:var(--accent);font-weight:600;display:flex;align-items:center;gap:3px}.prod-empty{border:1.5px dashed var(--border-strong);border-radius:14px;padding:26px;text-align:center;color:var(--text-2)}.prod-empty b{color:var(--text);display:block;margin-bottom:4px;font-size:14px}.backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#14121080;opacity:0;pointer-events:none;transition:opacity .2s;z-index:40}.backdrop.open{opacity:1;pointer-events:auto}.drawer{position:fixed;top:0;right:0;bottom:0;width:min(480px,94vw);background:var(--surface);border-left:1px solid var(--border);box-shadow:-20px 0 50px #00000038;z-index:50;transform:translate(100%);transition:transform .24s cubic-bezier(.3,.7,.3,1);overflow-y:auto}.drawer.open{transform:none}.dhead{position:sticky;top:0;background:var(--surface);padding:20px 22px 16px;border-bottom:1px solid var(--border);z-index:2}.dhead .row{display:flex;align-items:center;gap:10px}.dhead h2{margin:0;font-size:18px;font-weight:800}.dhead .close{margin-left:auto;border:1px solid var(--border);background:var(--surface-2);color:var(--text-2);border-radius:8px;width:32px;height:32px;display:grid;place-items:center}.dhead .sub{color:var(--text-2);font-size:12.5px;margin-top:7px}.dbody{padding:20px 22px 40px}.dbody h4{font-size:11px;text-transform:uppercase;letter-spacing:.7px;color:var(--text-3);margin:24px 0 11px;font-weight:700}.dbody h4:first-child{margin-top:4px}.chart{background:var(--surface-2);border:1px solid var(--border);border-radius:12px;padding:14px}.chart svg{display:block;width:100%;height:96px}.kv{display:grid;grid-template-columns:1fr 1fr;gap:10px}.kv .box{background:var(--surface-2);border:1px solid var(--border);border-radius:10px;padding:11px 13px}.kv .box .l{font-size:10.5px;text-transform:uppercase;letter-spacing:.4px;color:var(--text-3)}.kv .box .v{font-size:19px;font-weight:800;margin-top:3px}.alarm{display:flex;gap:11px;align-items:flex-start;padding:11px 0;border-bottom:1px solid var(--border)}.alarm:last-child{border-bottom:0}.alarm .bead{width:8px;height:8px;border-radius:50%;margin-top:5px;flex:none}.alarm .an{font-size:13px;font-weight:600}.alarm .ad{font-size:11.5px;color:var(--text-2);margin-top:2px}.state-msg{text-align:center;color:var(--text-3);padding:60px 0;font-size:14px}
