:root{
  --bg: #0b0e11;
  --fg: #e8e9ea;
  --muted: #a7b0b8;
  --card: #14181d;
  --stroke: #222830;
  --accent: #ff9f00;
  --accent-2: #0082ff;
}

* { box-sizing: border-box }
html, body { margin:0; padding:0 }
body { font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif; }

.bg-bg{ background: var(--bg); }
.text-fg{ color: var(--fg); }

.max-w-6xl { max-width: 72rem; }
.mx-auto { margin-left:auto; margin-right:auto; }
.p-4{ padding:1rem } .p-6{ padding:1.5rem }
.mb-6{ margin-bottom:1.5rem }
.grid{ display:grid } .grid-cols-1{ grid-template-columns:1fr }
@media (min-width:768px){ .md\:grid-cols-3{ grid-template-columns:1fr 1fr 1fr } .md\:p-6{ padding:1.5rem } .md\:text-3xl{ font-size:1.875rem } }
.gap-4{ gap:1rem } .gap-2{ gap:0.5rem }
.flex{ display:flex } .items-center{ align-items:center } .justify-between{ justify-content:space-between }
.text-2xl{ font-size:1.5rem } .font-bold{ font-weight:700 }
.tracking-tight{ letter-spacing:-0.01em }
.opacity-80{ opacity:.8 }
.text-sm{ font-size:.875rem }
.min-h-screen{ min-height:100vh }
.font-sans{ font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif; }

.btn{
  background: var(--card);
  border: 1px solid var(--stroke);
  color: var(--fg);
  padding: .5rem .75rem;
  border-radius: .75rem;
  cursor: pointer;
}
.btn:hover{ border-color: var(--accent) }
.btn:focus{ outline: 2px solid var(--accent-2); outline-offset: 2px }

.card{
  background: var(--card);
  border: 1px solid var(--stroke);
  border-radius: 1rem;
  padding: 1rem;
}
.card-h{ display:flex; align-items:center; justify-content:space-between; margin-bottom:.5rem }
.card-t{ font-size:1rem; font-weight:700 }

.kpi{ display:flex; align-items:baseline; gap:.5rem }
.kpi-v{ font-size:2rem; font-weight:700 }
.kpi-s{ font-size:.875rem; color: var(--muted) }

.spark{ font-size:1.25rem; color: var(--accent-2) }
.list{ list-style:none; margin:0; padding:0 }
.row{ padding:.25rem 0; border-top:1px solid var(--stroke) }
.row:first-child{ border-top:none }

.feed{ list-style:none; margin:0; padding:0 }
.feed-item{ padding:.75rem 0; border-top:1px solid var(--stroke) }
.feed-item:first-child{ border-top:none }
.feed-item a{ color: var(--fg); text-decoration: none; }
.feed-item a:hover{ color: var(--accent) }

.muted{ color: var(--muted); font-size:.875rem }
