/* Simple Like 1.1.0 embed.css を元にした。GPL-2.0-or-later。
   --like-* は親要素にも指定できる。押す範囲は縮めても 44px を保つ。 */
[data-like] {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-block: var(--like-margin, var(--hx-gap, 20px));
}
.like-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--like-gap, .5rem);
  min-height: max(44px, var(--like-size, var(--hx-tap, 44px)));
  min-width: max(44px, var(--like-size, var(--hx-tap, 44px)));
  padding: var(--like-padding, .5rem 1rem);
  border: var(--like-border-width, 1px) solid var(--like-border, var(--hx-line, #394554));
  border-radius: var(--like-radius, 999px);
  background: var(--like-background, rgba(255,255,255,.05));
  backdrop-filter: blur(var(--like-blur, 8px));
  color: var(--like-text, var(--hx-fg, #edf1f5));
  font: inherit;
  cursor: pointer;
}
.like-button[aria-pressed="true"] { border-color: var(--like-color, #fda4af); }
.like-button[aria-pressed="true"] .like-heart { color: var(--like-color, #fda4af); }
.like-button:focus-visible {
  outline: var(--like-focus-width, var(--hx-focus, 2px)) solid var(--like-focus-color, var(--hx-accent, #a6ceff));
  outline-offset: var(--like-focus-offset, 3px);
}
.like-button:disabled { opacity: var(--like-disabled-opacity, .5); cursor: not-allowed; }
.like-heart { display: inline-block; }
.like-pop { animation: like-pop var(--like-duration, var(--hx-time, 180ms)) ease-out 1; }
@keyframes like-pop { 0%, 100% { transform: scale(1); } 50% { transform: scale(var(--like-pop-scale, 1.25)); } }
.like-count { min-width: var(--like-count-width, 1ch); text-align: left; font-variant-numeric: tabular-nums; }
.like-message {
  min-height: var(--like-message-height, 1.25rem);
  margin-top: var(--like-message-gap, .25rem);
  font-size: var(--like-message-size, var(--hx-small, 13px));
  color: var(--like-text, var(--hx-fg, #edf1f5));
}
@media (prefers-reduced-motion: reduce) { .like-pop { animation: none; } }
