.like-heart-filled { fill: currentColor; color: #dc2626; }
#comments-drawer { padding: 0; }
#comments-drawer .comments-sheet {
  display: flex;
  flex-direction: column;
  height: min(85dvh, 48rem);
  max-height: 85dvh;
  margin-inline: auto;
  overflow: hidden;
  overflow-wrap: anywhere;
}
#comments-content, #comments-drawer [data-comments-post] {
  display: flex;
  flex: 1;
  flex-direction: column;
  min-height: 0;
}
#comments-drawer [data-comments-scroll] { flex: 1; min-height: 0; overflow-y: auto; overscroll-behavior: contain; }
#comments-drawer [data-comments-composer] { flex-shrink: 0; background: var(--color-base-100); padding-bottom: env(safe-area-inset-bottom); }
[data-comments-scroll]:has([data-comments-more]) [data-comments-end] { display: none; }
#comments-drawer [data-comment-text] { max-height: min(24dvh, 10rem); }
#comments-drawer[open] .comments-sheet { animation: comments-rise 180ms ease-out; }
@keyframes comments-rise { from { transform: translateY(100%); } to { transform: translateY(0); } }
@media (prefers-reduced-motion: reduce) { #comments-drawer[open] .comments-sheet { animation: none; } }

/* The filled heart communicates the saved like; keep the button at rest neutral. */
.timeline-like[aria-pressed="true"] { background: transparent; border-color: transparent; box-shadow: none; color: var(--color-base-content); }
@media (hover: hover) {
  .timeline-like[aria-pressed="true"]:hover { background: var(--color-base-200); }
}