.player-reactions { display:flex; flex-direction:column; align-items:center; gap:7px; margin-top:18px; }
/* The button is its own icon: the face says "boo" without a caption, and the
   label it used to carry lives on as the accessible name and the tooltip. */
.player-reaction-button {
  display:inline-flex; align-items:center; justify-content:center; gap:0; min-height:44px; min-width:52px; padding:5px;
  border:1px solid #e4b39978; border-radius:50%; color:#ffe0c7;
  background:linear-gradient(135deg,#56334c,#33243f); box-shadow:inset 0 1px #ffffff12,0 3px 8px #090f252b;
  font:600 14px/1.4 'Bai Jamjuree',sans-serif; transition:background .15s,border-color .15s;
}
.player-reaction-button > span:not(.reaction-face) { display:none; }
.reaction-face { display:grid; place-items:center; width:32px; height:32px; border-radius:50%; color:#ffd190; background:#dda86215; }
.reaction-face svg { width:30px; height:30px; }
.reaction-wave { margin-left:6px; color:#dfb4cc; font:22px/1 Georgia,serif; }
.player-reaction-button:hover:not(:disabled) { background:#69425c; border-color:#ffd190; }
.player-reaction-button:focus-visible { outline:2px solid #ffe3a8; outline-offset:4px; }
.player-reaction-button:disabled { cursor:not-allowed; color:#a3aabc; border-color:#9caac22b; background:#1d2945a6; box-shadow:none; }
.player-reaction-button:disabled .reaction-face,.player-reaction-button:disabled .reaction-wave { color:#919caf; background:transparent; }
#playerReactionStatus { min-height:18px; color:#bdc8df; font:400 11px/1.6 'Bai Jamjuree',sans-serif; text-shadow:0 1px 3px #0a1024; }
@media(prefers-reduced-motion:reduce){.player-reaction-button{transition:none}}
