.op-reaction-trigger{cursor:pointer;pointer-events:auto!important;background:transparent;border:0;padding:0;z-index:5}.op-reaction-popover{position:fixed;z-index:9999;width:100px;min-height:346px;padding:10px;border:1px solid #394550;border-radius:48px;background:#000;display:flex;flex-direction:column;gap:10px;box-shadow:0 18px 35px #0008}.op-reaction-option{height:46px;width:80px;flex:none;border:1px solid #394550;border-radius:28px;background:#000;color:#D9E8FC;display:flex;justify-content:center;align-items:center;gap:7px;font:400 15px/1 Unbounded,sans-serif;cursor:pointer}.op-reaction-option:hover,.op-reaction-option:focus-visible{border-color:#D9E8FC}.op-reaction-option.selected{border-color:#4DCAF3}.op-reaction-option .emoji{font-size:23px}.op-reaction-trigger:hover{filter:brightness(1.25)}
.main-room-likes.op-reaction-trigger,.extra-room-likes.op-reaction-trigger,.profile-game-like.op-reaction-trigger{background:none;border:0;display:flex;align-items:center;gap:8px;font:400 14px Unbounded,sans-serif;color:#D9E8FC}

/* Keep reaction buttons rounded; reduce only the outer background panel rounding. */
.op-reaction-popover{border-radius:32px}
.op-reaction-popover .op-reaction-option{border-radius:28px}

/* Keep the emoji centered when its reaction count is zero. */
.op-reaction-option .emoji{display:block;flex:none;line-height:1;}
.op-reaction-option .op-reaction-count{flex:none;}

/* Keep the card heart visible while the detached reaction panel is active. */
.profile-game .profile-game-like.op-reaction-open{opacity:1;pointer-events:auto;}
/* Larger hit target without enlarging or shifting the visible heart. */
.profile-game-like.op-reaction-trigger::before{content:"";position:absolute;inset:-10px;}
.profile-game-like.op-reaction-trigger{isolation:isolate;}

/* Touch/mobile game cards have no hover: keep the reaction trigger visible. */
@media (max-width: 768px), (hover: none) and (pointer: coarse) {
  .profile-game .profile-game-like.op-reaction-trigger {
    opacity: 1;
    pointer-events: auto;
  }
}