:root{
  --bg:#070A12;
  --card:#0f1b33;
  --ink:#EAF0FF;
  --muted:#A9B7D6;
  --accent:#7C5CFF;
  --accent2:#2DE2E6;
  --border: rgba(255,255,255,.10);
}
*{box-sizing:border-box}
body{
  margin:0;
  font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial;
  color:var(--ink);
  background:
    radial-gradient(1000px 600px at 15% 10%, rgba(124,92,255,.28), transparent 55%),
    radial-gradient(900px 600px at 85% 15%, rgba(45,226,230,.18), transparent 55%),
    linear-gradient(180deg, #070A12, #0B1220);
}
a{color: var(--accent2); text-decoration: none}
a:hover{text-decoration: underline}
.container{max-width: 1040px; margin: 0 auto; padding: 22px 16px 60px;}
.card{background: rgba(255,255,255,.05); border:1px solid var(--border); border-radius:16px; padding:18px;}
.hero{padding: 26px; background: linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.03));}
.grid{display:grid; gap:14px}
.grid2{grid-template-columns: 1.2fr .8fr}
@media (max-width: 900px){.grid2{grid-template-columns:1fr}}
.badge{display:inline-block; padding:6px 10px; border:1px solid var(--border); border-radius:999px; color:var(--muted); background: rgba(0,0,0,.18)}
.topbar{display:flex; align-items:center; justify-content:space-between; gap:12px; padding: 14px 16px; border-bottom:1px solid rgba(255,255,255,.07); background: rgba(7,10,18,.6); backdrop-filter: blur(10px); position: sticky; top:0;}
.brand{display:flex; align-items:center; gap:10px}
.logo{width:30px;height:30px;border-radius:10px;background: conic-gradient(from 220deg, var(--accent), var(--accent2), var(--accent));}
.brand strong{letter-spacing:.2px}
.menu{display:flex; gap:12px; flex-wrap: wrap; justify-content:flex-end}
.menu a{color: var(--muted); padding:8px 10px; border-radius:10px; border:1px solid transparent}
.menu a:hover{color: var(--ink); border-color: rgba(255,255,255,.10); text-decoration:none}
.h1{font-size: 34px; margin:0 0 10px; letter-spacing:-.5px}
.h2{font-size: 18px; margin:0 0 10px; color: var(--muted)}
.p{color: var(--muted); line-height:1.6}
.kpis{display:grid; grid-template-columns: repeat(3, 1fr); gap:12px; margin-top:14px}
@media (max-width: 700px){.kpis{grid-template-columns:1fr}}
.kpi{padding:14px; border-radius:14px; border:1px solid var(--border); background: rgba(0,0,0,.18)}
.kpi .big{font-size:18px; font-weight:800; color: var(--ink)}
.kpi .lbl{font-size:12px; color: rgba(169,183,214,.75); margin-top:6px}
.footer{margin-top: 18px; padding-top: 14px; border-top:1px solid rgba(255,255,255,.08); color: rgba(169,183,214,.75); font-size: 12px}