
:root{
  --bg:#0b0f14; --panel:#0f1620; --panel2:#0c121a; --line:#1e2a38;
  --text:#e9f0f7; --muted:#9fb0c3; --link:#6bb6ff; --good:#2dd4bf; --warn:#fbbf24;
}
*{box-sizing:border-box}
body{font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial; background:var(--bg); color:var(--text); margin:0; line-height:1.5}
a{color:var(--link); text-decoration:none}
a:hover{text-decoration:underline}
.container{max-width:1120px; margin:0 auto; padding:28px}
.nav{position:sticky; top:0; background:rgba(11,15,20,.92); border-bottom:1px solid var(--line); backdrop-filter:blur(10px); z-index:10}
.navinner{max-width:1120px;margin:0 auto; padding:14px 28px; display:flex; align-items:center; justify-content:space-between; gap:16px}
.brand{font-weight:800; letter-spacing:.2px}
.navlinks{display:flex; gap:14px; flex-wrap:wrap}
.badge{display:inline-block; padding:4px 10px; border:1px solid var(--line); border-radius:999px; color:var(--muted); font-size:12px}
.grid{display:grid; grid-template-columns:repeat(12,1fr); gap:16px}
.card{background:var(--panel); border:1px solid var(--line); border-radius:16px; padding:18px}
.card h2,.card h3{margin:0 0 8px 0}
.hero{padding:24px; border-radius:18px; background:
  radial-gradient(900px 320px at 20% -10%, rgba(107,182,255,.25), transparent 60%),
  radial-gradient(900px 320px at 80% -10%, rgba(45,212,191,.18), transparent 60%),
  var(--panel);
  border:1px solid var(--line);
}
.kpi{display:flex; gap:10px; flex-wrap:wrap; margin-top:10px}
.kpi .pill{border:1px solid var(--line); background:var(--panel2); border-radius:999px; padding:6px 10px; font-size:12px; color:var(--muted)}
hr{border:none; border-top:1px solid var(--line); margin:18px 0}
table{width:100%; border-collapse:collapse; font-size:14px}
th,td{padding:10px; border-bottom:1px solid var(--line); vertical-align:top}
th{color:var(--muted); font-size:12px; text-transform:uppercase; letter-spacing:.4px}
.callout{background:rgba(251,191,36,.08); border:1px solid rgba(251,191,36,.35); padding:14px; border-radius:14px}
.good{background:rgba(45,212,191,.08); border:1px solid rgba(45,212,191,.35); padding:14px; border-radius:14px}
.small{color:var(--muted); font-size:12px}
.footer{margin:34px 0 10px 0; color:var(--muted); font-size:12px}
.two{grid-column:span 12}
@media (min-width:900px){
  .span7{grid-column:span 7}
  .span5{grid-column:span 5}
  .span6{grid-column:span 6}
  .span4{grid-column:span 4}
}
