.uplot,.uplot *,.uplot *:before,.uplot *:after{box-sizing:border-box}.uplot{font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji";line-height:1.5;width:min-content}.u-title{text-align:center;font-size:18px;font-weight:700}.u-wrap{position:relative;-webkit-user-select:none;user-select:none}.u-over,.u-under{position:absolute}.u-under{overflow:hidden}.uplot canvas{display:block;position:relative;width:100%;height:100%}.u-axis{position:absolute}.u-legend{font-size:14px;margin:auto;text-align:center}.u-inline{display:block}.u-inline *{display:inline-block}.u-inline tr{margin-right:16px}.u-legend th{font-weight:600}.u-legend th>*{vertical-align:middle;display:inline-block}.u-legend .u-marker{width:1em;height:1em;margin-right:4px;background-clip:padding-box!important}.u-inline.u-live th:after{content:":";vertical-align:middle}.u-inline:not(.u-live) .u-value{display:none}.u-series>*{padding:4px}.u-series th{cursor:pointer}.u-legend .u-off>*{opacity:.3}.u-select{background:#00000012;position:absolute;pointer-events:none}.u-cursor-x,.u-cursor-y{position:absolute;left:0;top:0;pointer-events:none;will-change:transform}.u-hz .u-cursor-x,.u-vt .u-cursor-y{height:100%;border-right:1px dashed #607D8B}.u-hz .u-cursor-y,.u-vt .u-cursor-x{width:100%;border-bottom:1px dashed #607D8B}.u-cursor-pt{position:absolute;top:0;left:0;border-radius:50%;border:0 solid;pointer-events:none;will-change:transform;background-clip:padding-box!important}.u-axis.u-off,.u-select.u-off,.u-cursor-x.u-off,.u-cursor-y.u-off,.u-cursor-pt.u-off{display:none}:root{--bg: #0c1017;--panel: #141b24;--panel-2: #10161e;--border: #243041;--text: #eef3f8;--muted: #8b9bb0;--accent: #4aa3f0;--good: #3dd68c;--warn: #f0c14d;--bad: #e85d5d;--mono: ui-monospace, SFMono-Regular, Menlo, monospace;--sans: "Segoe UI", system-ui, sans-serif}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--bg);color:var(--text);font-family:var(--sans);font-size:14px}button,input{font:inherit;color:inherit}.app{min-height:100%;display:flex;flex-direction:column}.topbar{display:flex;align-items:center;gap:14px;padding:10px 16px;border-bottom:1px solid var(--border);background:var(--panel);flex-wrap:wrap}.brand{display:flex;gap:10px;align-items:center}.logo{width:34px;height:34px;border-radius:8px;background:linear-gradient(135deg,#1b4d8f,#3d9cf0);display:grid;place-items:center;font-weight:800;font-size:12px}.title{font-weight:700;font-size:15px}.sub{color:var(--muted);font-size:12px}.status-pill{display:flex;align-items:center;gap:8px;padding:6px 12px;border-radius:999px;font-weight:650;font-size:13px;border:1px solid var(--border)}.status-pill.ok{background:#10261c;color:var(--good);border-color:#1e5c3d}.status-pill.bad{background:#2a1416;color:var(--bad);border-color:#6b2a30}.status-pill .dot{width:8px;height:8px;border-radius:50%;background:currentColor}.timebar{display:flex;flex-wrap:wrap;gap:6px;align-items:center;flex:1}.timebar button,.viewbar button,.export,.legend .x,.taglist button{background:#1a2330;border:1px solid var(--border);border-radius:8px;padding:6px 12px;cursor:pointer}.timebar button:hover,.viewbar button:hover,.taglist button:hover{border-color:#3d5470}.timebar button.on,.viewbar button.on,.live.on{background:#17324c;border-color:#3d9cf0;color:#c5e3ff}.live.on{color:var(--good);border-color:#2a7a52;background:#10261c}.chk{display:flex;align-items:center;gap:6px;color:var(--muted);font-size:13px}.health{display:flex;flex-direction:column;align-items:flex-end;font-size:12px;margin-left:auto}.ok{color:var(--good)}.bad{color:var(--bad)}.muted{color:var(--muted)}.kpis{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px;padding:12px 16px;background:var(--bg)}.kpi{background:var(--panel);border:1px solid var(--border);border-radius:12px;padding:12px 14px;min-width:0}.sl{color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.06em;font-weight:650}.sv{font-family:var(--mono);font-size:22px;font-weight:700;margin-top:4px;letter-spacing:-.02em}.sh{color:var(--muted);font-size:12px;margin-top:4px;line-height:1.3}.banner{padding:8px 16px;font-weight:600;font-size:13px}.banner.alarm{background:#3a1518;color:#ffb4b4}.banner.warn{background:#3a2e10;color:#ffe08a}.body{display:flex;min-height:0;flex:1}.workspace{display:flex;flex-direction:column;min-width:0;flex:1}.viewbar{display:flex;gap:8px;align-items:center;flex-wrap:wrap;padding:8px 16px 4px}.hint-inline{color:var(--muted);font-size:12px;margin-left:auto}.add-panel{margin:4px 16px 8px;padding:10px;background:var(--panel);border:1px solid var(--border);border-radius:12px}.add-panel input{width:100%;background:#0b1018;border:1px solid var(--border);border-radius:8px;padding:8px 10px;margin-bottom:8px}.taglist{max-height:180px;overflow:auto;display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:4px}.taglist button{text-align:left;display:flex;gap:8px;align-items:center;font-size:13px;padding:7px 10px}.taglist em{color:var(--muted);font-style:normal;margin-left:auto;font-size:11px}.taglist i,.leg i{width:8px;height:8px;border-radius:50%;display:inline-block;flex:none}.pane{flex:1;min-height:240px;display:flex;flex-direction:column;margin:6px 16px 12px;background:var(--panel);border:1px solid var(--border);border-radius:12px;overflow:hidden}.pane-head{display:flex;align-items:center;gap:12px;padding:10px 14px 8px;flex-wrap:wrap}.pane-head h2{margin:0;font-size:14px;font-weight:650}.legend{display:flex;flex-wrap:wrap;gap:10px;align-items:center;flex:1}.leg{display:flex;align-items:center;gap:6px;background:#0f1620;border-radius:999px;padding:4px 8px 4px 10px}.tn{font-size:13px;color:var(--muted)}.tv{font-family:var(--mono);font-weight:650;font-size:13px}.x{padding:0 7px!important;border:0!important;background:transparent!important;color:var(--muted)}.pane-meta{color:var(--muted);font-size:12px;display:flex;gap:12px;align-items:center}.export{text-decoration:none;color:var(--accent);padding:4px 8px!important}.trend-canvas{flex:1;min-height:200px}.uplot{font-family:var(--sans)}@media (max-width: 1100px){.kpis{grid-template-columns:repeat(3,minmax(0,1fr))}.hint-inline{display:none}}@media (max-width: 700px){.kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.sv{font-size:18px}}
