
:root{--bg:#07111f;--panel:#10213a;--line:#203753;--text:#eef6ff;--muted:#8fa4bd;--blue:#2f80ff;--cyan:#53d8ff;--green:#35d07f}
*{box-sizing:border-box}body{margin:0;font-family:Arial,sans-serif;background:radial-gradient(circle at 80% 0,#12335c 0,transparent 28%),var(--bg);color:var(--text)}
.layout{display:grid;grid-template-columns:250px 1fr;min-height:100vh}aside{padding:28px 20px;border-right:1px solid var(--line);background:#081321;display:flex;flex-direction:column}
.brand{display:flex;gap:12px;align-items:center;margin-bottom:34px}.brand>b{background:linear-gradient(135deg,var(--blue),var(--cyan));padding:14px;border-radius:14px}.brand span{font-weight:700}.brand small{display:block;color:var(--muted);font-size:10px;margin-top:4px}
nav{display:flex;flex-direction:column;gap:8px}nav button{border:0;background:transparent;color:var(--muted);padding:13px;border-radius:11px;text-align:left}nav button.active,nav button:hover{background:#102844;color:white}
aside footer{margin-top:auto;color:var(--muted);font-size:11px}main{padding:30px}header{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px}header small,.card>small{color:var(--cyan);letter-spacing:.12em;text-transform:uppercase}h1{margin:.3rem 0}.actions{display:flex;gap:10px;align-items:center}.actions span,.actions button{border:1px solid var(--line);padding:10px 13px;border-radius:10px;background:#0d1a2b;color:white}
.page{display:none}.page.active{display:block}.hero{display:grid;grid-template-columns:1fr 1.6fr;gap:16px}.card{background:linear-gradient(180deg,#122743,#0d1d32);border:1px solid var(--line);border-radius:18px;padding:22px;box-shadow:0 20px 50px #0005}
.health .score{font-size:64px;font-weight:800;margin-top:18px}.health p{color:var(--muted)}.health div span{display:inline-block;background:#163d32;color:#bff0d1;padding:7px 9px;border-radius:999px;font-size:11px;margin:4px}.ai p{color:#b6c6d8;line-height:1.6}.risk{display:inline-block;background:#163d32;color:#bff0d1;padding:8px 11px;border-radius:999px}
.kpis{display:grid;grid-template-columns:repeat(6,1fr);gap:12px;margin:16px 0}.kpis strong{display:block;font-size:28px;margin:10px 0}.kpis em{color:var(--muted);font-size:11px;font-style:normal}
.grid{display:grid;grid-template-columns:1.5fr 1fr;gap:16px;margin-bottom:16px}.timeline{display:grid;grid-template-columns:repeat(10,1fr);gap:8px}.day{padding:12px 6px;text-align:center;border:1px solid var(--line);border-radius:10px}.day b{display:block}.day span{display:grid;place-items:center;margin:8px auto 0;width:22px;height:22px;border-radius:50%;background:#143c31;color:var(--green)}
.infra{list-style:none;padding:0;margin:0}.infra li{display:flex;justify-content:space-between;padding:14px 0;border-bottom:1px solid var(--line)}.infra small{display:block;color:var(--muted);margin-top:4px}.infra b{color:var(--green);font-size:11px}
.table{overflow:auto}table{width:100%;border-collapse:collapse;min-width:760px}th,td{padding:13px;border-bottom:1px solid var(--line);text-align:left}th{font-size:10px;color:var(--muted)}td{font-size:12px}.ok{color:var(--green)}input{width:100%;margin-bottom:16px;padding:12px;background:#0b192a;border:1px solid var(--line);color:white;border-radius:10px}
.agent{max-width:500px}.agent>span{float:right;color:var(--green)}dl{display:grid;grid-template-columns:1fr 1fr;gap:12px}dt{color:var(--muted)}dd{margin:0}.muted{opacity:.7}.empty{text-align:center;padding:80px}
@media(max-width:1100px){.kpis{grid-template-columns:repeat(3,1fr)}.hero,.grid{grid-template-columns:1fr}}@media(max-width:760px){.layout{grid-template-columns:1fr}aside{position:static}.kpis{grid-template-columns:repeat(2,1fr)}header{align-items:flex-start;flex-direction:column;gap:16px}}
