* { box-sizing: border-box; margin: 0; padding: 0; }
body {
  background: #0a0a0a;
  color: #f2f2f2;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  padding: 2.5rem;
}
header { margin-bottom: 2.5rem; }
header h1 { font-size: 1.9rem; font-weight: 600; }
header p { color: #999; margin-top: 0.25rem; }
a { color: inherit; text-decoration: none; }
.back-link { color: #888; font-size: 0.9rem; display: inline-block; margin-bottom: 1rem; }
.back-link:hover { color: #ddd; }
.grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 1.25rem;
}
.card {
  background: #151515;
  border: 1px solid #262626;
  border-top: 4px solid var(--color, #2563eb);
  border-radius: 12px;
  padding: 1.5rem;
  transition: border-color 0.15s ease;
}
.card:hover { border-color: #444; }
.card h2 { font-size: 1.2rem; font-weight: 500; margin-bottom: 0.5rem; }
.card p.desc { color: #999; font-size: 0.9rem; line-height: 1.4; }
.card p.meta { color: #666; font-size: 0.78rem; margin-top: 1rem; }
.columns { display: grid; grid-template-columns: 1fr; gap: 2rem; }
@media (min-width: 900px) { .columns { grid-template-columns: 1fr 1fr; } }
.section-title { display: flex; justify-content: space-between; align-items: center; margin-bottom: 0.75rem; }
.section-title h2 { font-size: 1.05rem; font-weight: 500; color: #ccc; }
.section-title span { font-size: 0.75rem; color: #666; }
.item {
  background: #151515;
  border: 1px solid #262626;
  border-radius: 10px;
  padding: 1rem 1.25rem;
  margin-bottom: 0.6rem;
}
.item h3 { font-weight: 500; font-size: 0.98rem; }
.item .estado { font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; color: #777; }
.item p { color: #999; font-size: 0.85rem; margin-top: 0.3rem; }
.empty { color: #555; font-size: 0.9rem; }
.dot { display: inline-block; width: 10px; height: 10px; border-radius: 50%; margin-right: 8px; }