.post-list__inner { max-width: 720px; margin: 0 auto; }
.post-list__title { margin: 18px; font-size: 28px; font-weight: 800; color: #111827; }

.post-list__empty {
  padding: 16px;
  border: 1px solid #e5e7eb;
  color: #6b7280;
  background: #f9fafb;
}

.post-items { list-style: none; padding: 0; margin: 0; display: grid; gap: 14px; }

.post-card {
  display: flex;
  gap: 14px;
  padding: 14px;
  border: 1px solid #e5e7eb;
  background: #fff;
  text-decoration: none;
  color: inherit;
}

.post-card__thumb {
  width: 92px;
  height: 92px;
  flex: 0 0 92px;
  overflow: hidden;
  background: #f3f4f6;
}

.post-card__thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.post-card__body { flex: 1; min-width: 0; }

.post-card__title {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  font-size: 17px;
  font-weight: 800;
  color: #111827;
  line-height: 1.35;
}

.post-card__meta {
  margin-top: 8px;
  font-size: 13px;
  color: #6b7280;
}

.post-card:focus-visible {
  outline: 3px solid rgba(59,130,246,.35);
  outline-offset: 2px;
}

@media (max-width: 520px) {
  .post-card { padding: 12px; gap: 12px; }
  .post-card__thumb { width: 76px; height: 76px; flex-basis: 76px; }
  .post-list__title { font-size: 24px; }
}