/* Shared reaction controls for every Discord-style simulation. */
.discord-ui-avatar { display: grid; place-items: center; width: 34px; height: 34px; flex: 0 0 34px; border-radius: 50%; background: #5865f236; color: #e0e3ff; font-size: 14px; font-weight: 800; line-height: 1; text-transform: lowercase; }
.discord-ui-avatar-bot { width: 34px; height: 34px; flex: 0 0 34px; border-radius: 50%; object-fit: cover; }
.discord-ui-reaction-row { display: flex; margin-top: 8px; }
.discord-ui-reaction { display: inline-flex; align-items: center; gap: 5px; padding: 2px 8px; border: 1px solid #3f4147; border-radius: 6px; background: #2b2d31; color: #dbdee1; font: inherit; font-size: 12px; line-height: 18px; cursor: pointer; transition: background-color .12s, border-color .12s, color .12s; }
.discord-ui-reaction:hover { border-color: #6d7078; background: #35373c; }
.discord-ui-reaction[aria-pressed="true"] { border-color: #5865f2; background: #5865f233; color: #e0e3ff; }
.discord-ui-reaction[aria-pressed="true"]:hover { border-color: #7983f5; background: #5865f24d; }
.discord-ui-reaction:focus-visible { outline: 2px solid #aeb7ff; outline-offset: 2px; }
.discord-ui-reaction-count-window { display: inline-grid; height: 1em; overflow: hidden; line-height: 1; vertical-align: -.08em; }
.discord-ui-reaction-count-value { display: block; grid-area: 1 / 1; line-height: 1em; white-space: nowrap; transition: transform .18s cubic-bezier(.2,.7,.2,1); }
.discord-ui-reaction-count-value.is-entering-above { transform: translateY(-110%); }
.discord-ui-reaction-count-value.is-entering-below { transform: translateY(110%); }
.discord-ui-reaction-count-value.is-leaving-above { transform: translateY(-110%); }
.discord-ui-reaction-count-value.is-leaving-below { transform: translateY(110%); }
@media (prefers-reduced-motion: reduce) { .discord-ui-reaction-count-value { transition-duration: 0s; } }
.discord-ui-emoji-drop { position: fixed; z-index: 10000; pointer-events: none; font-family: "Apple Color Emoji", "Segoe UI Emoji", "Noto Color Emoji", sans-serif; font-size: var(--emoji-size); line-height: 1; opacity: 0; animation: discord-ui-emoji-fall var(--emoji-duration) cubic-bezier(.32,.05,.62,1) var(--emoji-delay) forwards; }
@keyframes discord-ui-emoji-fall {
  0% { transform: translate3d(-50%, -50%, 0) scale(.55); opacity: 0; }
  12% { transform: translate3d(-50%, -50%, 0) scale(1); opacity: 1; }
  24% { transform: translate3d(calc(-50% + var(--emoji-drift)), calc(-50% - var(--emoji-rise)), 0) rotate(0); opacity: 1; }
  100% { transform: translate3d(calc(-50% + var(--emoji-drift)), calc(-50% + var(--emoji-fall)), 0) rotate(var(--emoji-turn)); opacity: 0; }
}
