/* Pindou Core：卡片/筛选/收藏按钮的通用样式（主题可覆盖） */
.pindou-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
@media (min-width: 640px) { .pindou-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; } }
@media (min-width: 1024px) { .pindou-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; } }

.pindou-card {
  background: #fff;
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 2px 10px rgba(0, 0, 0, .06);
  transition: transform .18s ease, box-shadow .18s ease;
  display: flex;
  flex-direction: column;
}
.pindou-card:hover { transform: translateY(-3px); box-shadow: 0 8px 20px rgba(0, 0, 0, .10); }
.pindou-card-link { text-decoration: none; color: inherit; display: block; }
.pindou-card-thumb { aspect-ratio: 1 / 1; background: #f6f7f9; display: flex; align-items: center; justify-content: center; overflow: hidden; }
.pindou-card-thumb img { width: 100%; height: 100%; object-fit: contain; image-rendering: pixelated; }
.pindou-card-ph { font-size: 40px; opacity: .35; }
.pindou-card-title {
  font-size: 14px; line-height: 1.35; margin: 8px 10px 4px; font-weight: 600;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.pindou-card-meta { display: flex; flex-wrap: wrap; gap: 4px; padding: 0 10px 10px; }
.pindou-tag {
  font-size: 11px; padding: 2px 7px; border-radius: 999px;
  background: #f1f3f5; color: #555; white-space: nowrap;
}
.pindou-tag-easy   { background: #e6f7ee; color: #1a7f4b; }
.pindou-tag-medium { background: #fff5e6; color: #a5641a; }
.pindou-tag-hard   { background: #ffeaea; color: #b3261e; }

.pindou-grid.is-loading { opacity: .5; transition: opacity .15s; }
.pindou-empty { padding: 28px 12px; text-align: center; color: #888; background: #fafbfc; border-radius: 12px; }

.pindou-fav-btn {
  border: 1px solid #ffd0e0; background: #fff; color: #d6336c;
  padding: 8px 14px; border-radius: 999px; font-size: 14px; cursor: pointer;
  transition: background .15s, transform .1s;
}
.pindou-fav-btn:hover { background: #fff5f8; }
.pindou-fav-btn:active { transform: scale(.97); }
.pindou-fav-btn.is-on { background: #ffe3ee; border-color: #ff9dc0; }

.pindou-filters {
  display: flex; flex-wrap: wrap; gap: 8px; align-items: center;
  background: #fff; padding: 12px; border-radius: 14px; box-shadow: 0 2px 10px rgba(0, 0, 0, .05);
  margin-bottom: 16px;
}
.pindou-filters select,
.pindou-filters input[type="search"],
.pindou-filters input[type="text"] {
  font-size: 14px; padding: 8px 10px; border: 1px solid #e3e6ea; border-radius: 10px; background: #fff;
  min-width: 110px; max-width: 100%;
}
.pindou-filters input[type="search"] { flex: 1 1 160px; }
.pindou-reset { font-size: 13px; color: #888; text-decoration: none; padding: 6px 4px; }
.pindou-reset:hover { color: #d6336c; }
.pindou-count { font-size: 13px; color: #777; margin: 0 0 12px; }
.pindou-count b, [data-pindou-count] { color: #d6336c; font-weight: 700; }