v0.7.7 bugs fixes

frontend/src/components/Message.css

@@ -334,6 +334,43 @@
   user-select: text;
 }
 
+/* Triple-dot pin button wrapper */
+.msg-pin-wrap {
+  position: relative;
+  display: flex;
+  align-items: center;
+  align-self: flex-end;
+  margin-bottom: 2px;
+}
+
+.msg-pin-btn {
+  opacity: 0;
+  transition: opacity 0.15s;
+  color: var(--text-tertiary);
+  padding: 2px 4px;
+  border-radius: 4px;
+}
+
+.msg-pin-btn:hover,
+.msg-pin-btn.active {
+  opacity: 1 !important;
+  color: var(--text-primary);
+  background: var(--surface-variant);
+}
+
+/* Show pin button on message row hover */
+.msg-bubble-wrap:hover .msg-pin-btn,
+.msg-pin-btn.active {
+  opacity: 1;
+}
+
+/* On touch devices always show it so users know it's there */
+@media (hover: none) {
+  .msg-pin-btn {
+    opacity: 0.45;
+  }
+}
+
 /* Message pin/options popup menu */
 .msg-options-menu {
   position: absolute;
@@ -344,7 +381,8 @@
   box-shadow: var(--shadow-md);
   padding: 4px 0;
   min-width: 170px;
-  top: calc(100% + 4px);
+  bottom: calc(100% + 4px);
+  white-space: nowrap;
 }
 
 .msg-options-menu.options-left {