
/* Ivy Reactions core v1.5.0 */
.ivy-reactions-wrap { margin: 10px 0 16px; }
.ivy-reactions-wrap.ivy-post { margin-top: 6px; }

.ivy-arch {
  position: relative;
  padding: 14px 12px 12px;
  border-radius: 16px;
  overflow: hidden;
  backdrop-filter: blur(2px);
  box-shadow: 0 6px 20px rgba(0,0,0,0.25);
  isolation: isolate;
}

.ivy-arch::before {
  content: "";
  position: absolute; inset: 0;
  background:
    var(--ivy-bg-image, none) center/cover no-repeat,
    var(--ivy-bg-color, transparent);
  opacity: .55; z-index: -2;
  filter: grayscale(12%) contrast(105%) brightness(.9);
}

.ivy-arch::after {
  content: "";
  position: absolute; inset: 0;
  box-shadow: inset 0 0 120px rgba(0,0,0,.6);
  border-radius: 18px;
  z-index: -1;
}

.ivy-vines {
  position: absolute; left: -8px; right: -8px; top: -18px; height: 72px;
  pointer-events: none;
  background: radial-gradient(120px 40px at 10% 0%, rgba(16,60,24,.7), transparent 70%),
              radial-gradient(120px 40px at 90% 0%, rgba(16,60,24,.7), transparent 70%);
}

.ivy-content { position: relative; color:#f8f7f6; text-shadow: 0 1px 2px rgba(0,0,0,.6); }
.ivy-reactions-title { font-weight:700; margin-bottom:10px; font-size:14px; display:inline-flex; gap:8px; }

.ivy-reactions-bar { display:flex; flex-wrap:wrap; gap:8px; }
.ivy-emoji-btn {
  appearance:none; border:none; cursor:pointer;
  background: rgba(22,22,22,.55);
  padding:8px 10px; border-radius:999px;
  display:inline-flex; align-items:center; gap:8px;
  transition: transform .08s ease, background .2s ease, box-shadow .2s ease;
  box-shadow: 0 2px 10px rgba(0,0,0,.25);
  color:#fff; line-height:1; font-size:16px;
}
.ivy-emoji-btn:hover { transform: translateY(-1px); background: rgba(24,24,24,.75); }
.ivy-emoji-btn:active { transform: translateY(0); }
.ivy-emoji-btn.active { outline: 2px solid rgba(255,255,255,.35); background: rgba(24,24,24,.9); }

.ivy-emoji { font-size: var(--ivy-emoji-size, 22px); display:inline-flex; align-items:center; justify-content:center; }
.ivy-emoji[data-kind="img"] img { width: var(--ivy-emoji-size, 22px); height: var(--ivy-emoji-size, 22px); display:inline-block; object-fit: contain; border-radius: 6px; }
.ivy-count { min-width:1.4em; text-align:center; font-weight:700; font-size:13px; color: var(--ivy-accent, #ffe7a8); }

#respond .ivy-reactions-wrap.ivy-post { margin-bottom: 14px; }
