:root{color:#17202a;background:#f6f7f8;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility;--border: #dde2e6;--muted: #66737f;--panel: #ffffff;--ink: #17202a;--green: #138a63;--blue: #2867b2;--amber: #b76e00;--red: #bd3c35}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh}button,input,select{font:inherit}button{border:0;cursor:pointer}.login-screen{min-height:100vh;display:grid;place-items:center;padding:24px;background:linear-gradient(120deg,#138a631a,#2867b214),#f6f7f8}.login-panel{width:min(420px,100%);background:var(--panel);border:1px solid var(--border);border-radius:8px;padding:28px;display:grid;gap:16px;box-shadow:0 18px 48px #17202a1a}.brand-mark,.metric-icon{width:42px;height:42px;display:grid;place-items:center;border-radius:8px;background:#eaf4ef;color:var(--green)}.login-panel h1,.topbar h1{margin:0;font-size:28px;line-height:1.15}label{display:grid;gap:7px;color:var(--muted);font-size:13px;font-weight:600}input,select{height:40px;border:1px solid var(--border);border-radius:7px;background:#fff;color:var(--ink);padding:0 12px;min-width:0}pre{margin:0;overflow:auto;white-space:pre-wrap;word-break:break-word;background:#f1f4f2;color:#26342e;border:1px solid #dce8df;border-radius:7px;padding:12px;font-size:12px;line-height:1.45}.primary-button,.text-button,.icon-button{min-height:40px;border-radius:7px;display:inline-flex;align-items:center;justify-content:center;gap:8px;font-weight:700}.primary-button{background:var(--green);color:#fff;padding:0 16px}.text-button{background:#eef4fb;color:var(--blue);padding:0 12px}.icon-button{width:40px;background:#eff2f4;color:var(--ink)}.error,.banner-error{color:var(--red)}.banner-error{border:1px solid #f1c3bf;background:#fff4f3;border-radius:8px;padding:12px 14px}.app-shell{min-height:100vh;display:grid;grid-template-columns:240px 1fr}.sidebar{position:sticky;top:0;height:100vh;background:#fbfbfa;border-right:1px solid var(--border);padding:18px 14px;display:flex;flex-direction:column;gap:22px}.sidebar-brand{display:flex;align-items:center;gap:10px;color:var(--green);font-weight:800;font-size:18px;padding:4px 8px}.sidebar nav{display:grid;gap:4px}.sidebar nav button,.logout{min-height:38px;border-radius:7px;background:transparent;color:#44505c;display:flex;align-items:center;gap:10px;padding:0 10px;text-align:left}.sidebar nav button.active{color:var(--green);background:#eaf4ef}.logout{margin-top:auto}.workspace{min-width:0;padding:22px;display:grid;gap:18px;align-content:start}.topbar{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}.topbar span,.section-heading span,.metric-card span,.metric-card small,.site-title span,.live-panel span,.live-panel small{color:var(--muted)}.filters{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:8px}.filters select{min-width:180px}.metrics-grid{display:grid;grid-template-columns:repeat(6,minmax(140px,1fr));gap:12px}.metric-card,.chart-panel,.list-panel,.table-panel,.tool-panel,.site-card,.live-panel{background:var(--panel);border:1px solid var(--border);border-radius:8px}.metric-card{min-height:112px;padding:14px;display:grid;align-content:space-between;gap:10px}.metric-card strong{display:block;font-size:25px;line-height:1.1;margin-top:5px}.metric-card small{display:block;margin-top:3px}.chart-panel,.list-panel,.table-panel,.tool-panel,.live-panel{padding:16px}.section-heading{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:14px}.section-heading h2{margin:0;font-size:17px;line-height:1.25}.line-chart{width:100%;height:260px;display:block}.line-chart line{stroke:#e2e6ea;stroke-width:.6}.line-chart polyline{fill:none;stroke:var(--green);stroke-width:2.2;vector-effect:non-scaling-stroke}.dashboard-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.bar-list{display:grid;gap:12px}.bar-row{display:grid;grid-template-columns:minmax(90px,1fr) minmax(110px,2fr) auto;align-items:center;gap:10px;font-size:13px}.bar-row>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.bar-row div{height:9px;background:#eef1f3;border-radius:99px;overflow:hidden}.bar-row i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--green),var(--blue))}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;min-width:720px}th,td{text-align:left;border-bottom:1px solid #edf0f2;padding:11px 10px;font-size:13px;vertical-align:top}th{color:var(--muted);font-weight:800;background:#fafafa}.empty{color:var(--muted);margin:0}.split-layout{display:grid;grid-template-columns:320px minmax(0,1fr);gap:16px;align-items:start}.tool-panel{display:grid;gap:14px}.site-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:14px}.site-card{padding:14px;display:grid;gap:12px}.site-actions{display:flex;flex-wrap:wrap;gap:8px}.site-actions .text-button{flex:1 1 118px}.install-state{min-height:36px;border-radius:7px;padding:8px 10px;display:flex;align-items:center;gap:8px;font-size:13px;font-weight:700}.install-state.receiving_data{background:#e6f4ee;color:var(--green)}.install-state.waiting_for_install{background:#fff6e6;color:var(--amber)}.site-note{color:var(--muted);line-height:1.4}.site-title{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.site-title h3{margin:0 0 3px;font-size:16px}.status{border-radius:999px;padding:3px 8px;font-size:12px;background:#f3f0e8;color:var(--amber)}.status.active{background:#e6f4ee;color:var(--green)}.live-panel{display:grid;place-items:center;min-height:220px;color:var(--green)}.live-panel strong{font-size:56px;line-height:1;color:var(--ink)}@media(max-width:1100px){.metrics-grid,.dashboard-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.topbar{display:grid}.filters{justify-content:flex-start}}@media(max-width:760px){.app-shell{grid-template-columns:1fr}.sidebar{position:static;height:auto;border-right:0;border-bottom:1px solid var(--border)}.sidebar nav{grid-template-columns:repeat(2,minmax(0,1fr))}.metrics-grid,.dashboard-grid,.split-layout{grid-template-columns:1fr}.filters,.filters select,.filters input,.filters .text-button{width:100%}.workspace{padding:16px}}
