/* Guided repository walkthrough */
.repo-learning-goal {
  margin: var(--space-6) 0;
  padding: var(--space-5);
  background: color-mix(in srgb, var(--bg-surface) 82%, var(--text-link) 4%);
  border: 1px solid var(--border);
  border-radius: var(--radius);
}

.repo-learning-goal ol { margin-bottom: 0; }
.repo-file-list { display: grid; gap: var(--space-4); }

.repo-file-card {
  display: grid;
  grid-template-columns: 2.5rem minmax(0, 1fr);
  gap: var(--space-4);
  padding: var(--space-5);
  background: color-mix(in srgb, var(--bg-surface) 88%, transparent);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: var(--shadow-card);
}

.repo-file-order {
  display: grid;
  place-items: center;
  align-self: start;
  width: 2.5rem;
  height: 2.5rem;
  color: var(--bg-surface);
  background: var(--text-link);
  border-radius: 50%;
  font-weight: 800;
}

.repo-file-content { min-width: 0; }
.repo-file-content h3 { margin: var(--space-2) 0 var(--space-3); overflow-wrap: anywhere; }
.repo-file-meta, .repo-concepts { display: flex; flex-wrap: wrap; gap: var(--space-2); }

.repo-file-meta span {
  padding: 0.2rem 0.65rem;
  color: var(--text-link);
  background: color-mix(in srgb, var(--text-link) 10%, transparent);
  border: 1px solid color-mix(in srgb, var(--text-link) 30%, var(--border));
  border-radius: 999px;
  font-size: 0.8rem;
  font-weight: 700;
}

.repo-file-structure { color: var(--text-muted); font-size: 0.92rem; }

.repo-review {
  margin: var(--space-3) 0;
  padding: var(--space-3);
  border-left: 3px solid var(--text-link);
  background: color-mix(in srgb, var(--text-link) 7%, transparent);
}

.repo-open-file { display: inline-flex; margin-top: var(--space-3); font-weight: 750; }

@media (max-width: 640px) {
  .repo-file-card { grid-template-columns: 1fr; padding: var(--space-4); }
}