fix: prevent layout shifts in reactions modal (#270)

### 🎯 Goal

We got reports of layout shifts when opening the reactions modal. This
PR fixes them.

### 🛠 Implementation details

There were two reasons for the layout shifts:

1. Mismatch between fallback emoji size and sprite emoji size. Fixed by
providing an ability to customize sprite emoji size using a CSS
variable, and setting sprite emoji size to equal font size.
2. A quick flash of the loading state inside the modal. Fixed by setting
minimum height for the modal, so that in most cases it will have the
same height during and after loading.

### 🎨 UI Changes


https://github.com/GetStream/stream-chat-css/assets/975978/fdff3785-6674-4cf2-a1f3-678bfb319a09

src/v2/styles/MessageReactions/MessageReactions-layout.scss

@@ -104,12 +104,22 @@
       padding: var(--str-chat__spacing-1) 0;
       flex-shrink: 0;
       cursor: pointer;
+
+      .str-chat__message-reaction-emoji--with-fallback {
+        width: 18px;
+        line-height: 18px;
+      }
     }
   }
 
   .str-chat__message-reaction-emoji-big {
     align-self: center;
     font-size: 2rem;
+    --str-chat__stream-emoji-size: 1em;
+  }
+
+  .str-chat__message-reaction-emoji-big.str-chat__message-reaction-emoji--with-fallback {
+    line-height: 2rem;
   }
 
   .str-chat__message-reactions-details-reacting-users {
@@ -118,7 +128,11 @@
     gap: var(--str-chat__spacing-3);
     max-height: 100%;
     overflow-y: auto;
-    min-height: 0;
+    min-height: 30vh;
+
+    .str-chat__loading-indicator {
+      margin: auto;
+    }
 
     .str-chat__message-reactions-details-reacting-user {
       display: flex;