/* 点赞 / 收藏 buttons + /mylist/ · /history/ list (sk-local.php) — colours from --sk-ops-* (themes map them). */

.sk-acts { display: flex; flex-wrap: wrap; gap: 10px; margin: 12px 0; }
.sk-act {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 36px;
  padding: 6px 16px;
  border: 1px solid var(--sk-ops-border, #2a2a34);
  border-radius: 999px;
  background: var(--sk-ops-bg, #14141a);
  color: var(--sk-ops-fg, #f4f4f6);
  font: inherit;
  font-size: 14px;
  line-height: 1;
  cursor: pointer;
}
.sk-act svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linejoin: round; }
.sk-act:hover { border-color: var(--sk-ops-accent, #e24b5a); }
.sk-act:focus-visible { outline: 2px solid var(--sk-ops-accent, #e24b5a); outline-offset: 2px; }
.sk-act[aria-pressed="true"] { border-color: var(--sk-ops-accent, #e24b5a); color: var(--sk-ops-accent, #e24b5a); }
.sk-act[aria-pressed="true"] svg { fill: currentColor; }
.sk-act-like[aria-pressed="true"] { cursor: default; }
.sk-act:disabled { opacity: 0.6; }
.sk-act-n { color: var(--sk-ops-muted, #9a9aa8); font-variant-numeric: tabular-nums; }
.sk-act[aria-pressed="true"] .sk-act-n { color: inherit; }

.sk-local-page { display: block; padding: 16px; max-width: 1200px; margin: 0 auto; box-sizing: border-box; }
.sk-local { color: var(--sk-ops-fg, inherit); }
.sk-local-head { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; margin-bottom: 16px; }
.sk-local-head h1 { margin: 0; font-size: 22px; }
.sk-local-head p { flex: 1 1 100%; margin: 0; font-size: 13px; color: var(--sk-ops-muted, #9a9aa8); }
.sk-local-seg { display: flex; gap: 6px; }
.sk-local-seg a {
  padding: 4px 12px;
  border: 1px solid var(--sk-ops-border, #2a2a34);
  border-radius: 999px;
  color: var(--sk-ops-fg, inherit);
  font-size: 13px;
  text-decoration: none;
}
.sk-local-seg a[aria-current] { border-color: var(--sk-ops-accent, #e24b5a); background: var(--sk-ops-accent, #e24b5a); color: var(--sk-ops-accent-fg, #fff); }
.sk-local-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 16px 12px; }
.sk-local-empty { grid-column: 1 / -1; margin: 32px 0; text-align: center; color: var(--sk-ops-muted, #9a9aa8); }
.sk-lc { display: flex; flex-direction: column; gap: 4px; min-width: 0; color: var(--sk-ops-fg, inherit); text-decoration: none; }
.sk-lc-cover {
  display: block;
  aspect-ratio: 2 / 3;
  overflow: hidden;
  border-radius: var(--sk-ops-radius, 10px);
  background: var(--sk-ops-bg, #14141a);
}
.sk-lc-cover img { display: block; width: 100%; height: 100%; object-fit: cover; }
.sk-lc-t { overflow: hidden; font-size: 14px; white-space: nowrap; text-overflow: ellipsis; }
.sk-lc-m { font-size: 12px; color: var(--sk-ops-muted, #9a9aa8); }
.sk-lc:hover .sk-lc-t { color: var(--sk-ops-accent, #e24b5a); }
.sk-local-foot { margin: 20px 0 0; text-align: center; }
.sk-local-clear {
  padding: 6px 16px;
  border: 1px solid var(--sk-ops-border, #2a2a34);
  border-radius: 999px;
  background: transparent;
  color: var(--sk-ops-muted, #9a9aa8);
  font: inherit;
  font-size: 13px;
  cursor: pointer;
}
@media (max-width: 480px) {
  .sk-local-page { padding: 12px; }
  .sk-local-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px 8px; }
  .sk-lc-t { font-size: 13px; }
}
