:root{--ink:#080908;--panel:#151613;--line:#35362f;--gold:#d9aa31;--pale:#f4f1e8;--muted:#aaa9a3;--blue:#5fb8e8;--red:#e06b5f;--green:#67c587}*{box-sizing:border-box}body{margin:0;background:var(--ink);color:var(--pale);font-family:Inter,ui-sans-serif,system-ui,-apple-system,sans-serif}header{min-height:72px;padding:12px clamp(18px,4vw,60px);display:flex;align-items:center;gap:24px;border-bottom:1px solid var(--line);background:#10110f}.brand{display:flex;align-items:center;gap:10px;color:#fff;text-decoration:none;font-weight:800}.brand img{width:34px;height:34px}.demo-flag{margin:auto;padding:7px 12px;border:1px solid #725c1f;background:#2a240f;color:#f6ce63;text-transform:uppercase;letter-spacing:.11em;font-size:11px;font-weight:900}.connection{display:flex;gap:8px;align-items:center;color:#ccc;font-size:13px}.connection i{width:8px;height:8px;background:var(--green);border-radius:50%;box-shadow:0 0 10px var(--green)}main{padding:35px clamp(18px,4vw,60px) 70px;max-width:1600px;margin:auto}.dashboard-head{display:flex;justify-content:space-between;align-items:end;gap:24px;margin-bottom:28px}.dashboard-head h1{font-size:clamp(34px,5vw,60px);letter-spacing:-.045em;line-height:1;margin:6px 0 12px}.dashboard-head p{color:var(--muted);margin:0;max-width:700px}.eyebrow{margin:0;text-transform:uppercase;letter-spacing:.2em;color:var(--gold);font-size:11px;font-weight:900}.controls{display:flex;gap:7px;flex-wrap:wrap}.controls button{border:1px solid #4a4b43;background:#151613;color:#ddd;padding:9px 12px;cursor:pointer}.controls button.active{border-color:var(--gold);color:#15130a;background:var(--gold);font-weight:800}.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:12px}.kpis article,.panel{background:var(--panel);border:1px solid var(--line);padding:20px}.kpis span{display:block;color:var(--muted);font-size:13px}.kpis strong{display:inline-block;font-size:clamp(34px,4vw,54px);letter-spacing:-.04em;margin:10px 6px 0 0}.kpis small{color:#aaa}.kpis b{display:block;margin-top:5px}.ok{color:var(--green);font-size:12px}.warn{color:#ffbc55;font-size:12px}.dashboard-grid{display:grid;grid-template-columns:1.35fr .65fr;gap:12px}.panel h2{margin:5px 0 16px;font-size:21px}.panel-title{display:flex;align-items:start;justify-content:space-between;gap:20px}.panel-title>span{font-size:12px;color:var(--muted)}canvas{width:100%;height:270px;display:block;background:linear-gradient(#181916,#121310);border:1px solid #282923}.legend{display:flex;gap:20px;color:var(--muted);font-size:12px;margin-top:12px}.legend i{display:inline-block;width:18px;height:2px;margin-right:7px;vertical-align:middle}.gold{background:var(--gold)}.blue{background:var(--blue)}.red{background:var(--red)}.tank{display:inline-flex;position:relative;width:43%;height:155px;margin:5px 3% 18px 0;border:2px solid #696a62;border-top:0;align-items:flex-end;overflow:hidden}.tank>div{position:absolute;left:0;right:0;bottom:0;background:linear-gradient(#6f9940aa,#b4952eaa);transition:height .5s}.tank span,.tank strong{position:relative;z-index:1;padding:8px;font-size:12px}.tank strong{margin-left:auto}dl{margin:0}dl div{display:flex;justify-content:space-between;gap:20px;border-top:1px solid #2d2e29;padding:9px 0}dt{color:var(--muted)}dd{margin:0;text-align:right}.measurements em{display:block;color:#777;font-size:10px;font-style:normal}table{width:100%;border-collapse:collapse;font-size:13px}th,td{text-align:left;padding:11px;border-top:1px solid #2d2e29}th{color:var(--muted);font-size:11px;text-transform:uppercase}.architecture ol{list-style:none;margin:0;padding:0;counter-reset:path}.architecture li{display:grid;grid-template-columns:28px 1fr;padding:11px 0;border-top:1px solid #2d2e29;counter-increment:path}.architecture li:before{content:counter(path);color:var(--gold);font-weight:900}.architecture span{display:block;color:var(--muted);font-size:12px;margin-top:3px}.disclaimer{margin-top:18px;padding:12px;border-left:3px solid var(--gold);background:#1c1c17;color:#aaa;font-size:12px}footer{display:flex;justify-content:space-between;padding:20px clamp(18px,4vw,60px);border-top:1px solid var(--line);color:#888;font-size:13px}footer a{color:var(--gold);text-decoration:none}@media(max-width:900px){header{flex-wrap:wrap}.demo-flag{order:3;width:100%;text-align:center}.dashboard-head{align-items:start;flex-direction:column}.kpis{grid-template-columns:1fr 1fr}.dashboard-grid{grid-template-columns:1fr}}@media(max-width:560px){.kpis{grid-template-columns:1fr}.connection{display:none}.panel{padding:15px}table{font-size:11px}th:nth-child(2),td:nth-child(2){display:none}footer{flex-direction:column;gap:8px}}