@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600&family=Manrope:wght@600;700;800&display=swap');:root{--dark:#071c15;--lime:#c2f16d;--green:#176b49;--bg:#f3f5f2;--line:#e1e6e2}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:#18241e;font:13px DM Sans}aside{position:fixed;width:255px;inset:0 auto 0 0;background:var(--dark);color:#acc0b5;padding:22px 15px;display:flex;flex-direction:column}.brand{display:flex;gap:10px;align-items:center;color:white;font:700 15px Manrope;padding:0 10px 22px}.brand i{width:38px;height:38px;border-radius:11px;background:var(--lime);color:var(--dark);display:grid;place-items:center;font-style:normal;font-size:20px}.brand small,.user small{display:block;color:#6f8d7e;font:8px DM Sans;letter-spacing:.15em}nav{overflow:auto;flex:1}nav b{display:block;font-size:8px;letter-spacing:.16em;color:#617e70;margin:22px 12px 7px}nav a{display:block;padding:10px 13px;border-radius:9px;margin:2px 0}nav a.active,nav a:hover{background:#143326;color:white}.api{padding:12px;background:#102f22;border-radius:10px;font-size:10px}.api i,.health i{display:inline-block;width:7px;height:7px;background:#67da8f;border-radius:50%;margin-right:7px}.health i.off{background:#c89165}main{margin-left:255px}header{height:82px;padding:0 30px;background:white;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center}header h1{margin:3px 0;font:700 19px Manrope}header>div>small{font-size:8px;color:#87948d;letter-spacing:.15em}.user{display:flex;align-items:center;gap:9px}.user>span{width:35px;height:35px;border-radius:50%;display:grid;place-items:center;background:#e5f6d1;color:#315b38;font-weight:800}.user b{font-size:11px}section{padding:28px;max-width:1500px}.welcome{display:flex;justify-content:space-between;align-items:end}.welcome small{font-size:9px;color:var(--green);font-weight:800;letter-spacing:.15em}.welcome h2{font:800 28px Manrope;margin:7px 0}.welcome p{color:#7a8680}.welcome button{border:0;background:var(--green);color:white;border-radius:9px;padding:12px 16px;font-weight:700}.metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:13px;margin:25px 0}.metrics article,.panel{background:white;border:1px solid var(--line);border-radius:15px;padding:20px}.metrics .dark{background:var(--dark);color:white}.metrics small,.metrics em{display:block;color:#819087;font-style:normal}.metrics b{display:block;font:800 25px Manrope;margin:17px 0 5px}.grid{display:grid;grid-template-columns:1.4fr .6fr;gap:13px}.panel h3{font:700 14px Manrope;margin:0 0 20px}.chart{height:200px;display:flex;align-items:end;gap:8px}.chart i{flex:1;background:linear-gradient(var(--lime),#dff4bd);border-radius:5px 5px 0 0;height:35%}.chart i:nth-child(2n){height:70%}.chart i:nth-child(3n){height:50%}.chart i:nth-child(5n){height:90%}.health p{padding:13px;border-bottom:1px solid var(--line)}.health b{float:right;font-size:9px;color:#7c8982}.table{margin-top:13px}table{width:100%;border-collapse:collapse}th,td{text-align:left;padding:12px;border-bottom:1px solid var(--line)}th{font-size:9px;color:#8a9690}@media(max-width:850px){aside{transform:translateX(-100%)}main{margin:0}.metrics{grid-template-columns:1fr 1fr}.grid{grid-template-columns:1fr}}@media(max-width:500px){.metrics{grid-template-columns:1fr}.welcome{display:block}header,section{padding-left:15px;padding-right:15px}}
