.public-reactions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  padding: 14px 0 22px;
  font:
    13px ui-monospace,
    SFMono-Regular,
    Menlo,
    monospace;
}
.public-reactions button {
  appearance: none;
  cursor: pointer;
  min-height: 44px;
  padding: 9px 12px;
  border: 1px solid #303740;
  border-radius: 7px;
  background: #101419;
  color: #bbc3cd;
  font: inherit;
  transition:
    background 0.15s,
    border-color 0.15s;
}
.idea-card > .public-reactions,
.hero-card > .public-reactions {
  margin-top: 14px;
  padding: 14px 0 0;
  border-top: 1px solid #272b31;
  gap: 8px;
  font-size: 12px;
}
.idea-card > .public-reactions button,
.hero-card > .public-reactions button {
  padding-inline: 8px;
}
.hero-card > .public-reactions {
  margin: 0 22px 22px;
}
.idea-card > .public-reactions .reaction-status,
.hero-card > .public-reactions .reaction-status {
  flex-basis: 100%;
}
.public-reactions button:hover {
  border-color: #82909f;
}
.public-reactions button:focus-visible {
  outline: 2px solid #e0e0e0;
  outline-offset: 3px;
}
.public-reactions button[data-reaction="build"] {
  color: #2196f3;
  border-color: #1b4563;
}
.public-reactions button[data-reaction="heart"] {
  color: #e57373;
  border-color: #613a40;
}
.public-reactions button[data-reaction="build"][aria-pressed="true"] {
  background: #11314a;
  border-color: #2196f3;
}
.public-reactions button[data-reaction="heart"][aria-pressed="true"] {
  background: #402229;
  border-color: #e57373;
}
.public-reactions button:disabled {
  cursor: default;
  opacity: 0.55;
}
.public-reactions [data-count] {
  margin-left: 6px;
  font-weight: 700;
}
.reaction-status {
  font-size: 12px;
  color: #a2adb8;
}
.reaction-status:empty {
  display: none;
}
.reaction-retry[hidden] {
  display: none;
}
.reaction-next {
  flex-basis: 100%;
  font-size: 12px;
}
.reaction-next[hidden] {
  display: none;
}
.reaction-next a {
  color: #70c995;
  font-weight: 700;
  text-decoration: none;
}
.reaction-next a:hover {
  text-decoration: underline;
}
.reaction-invite {
  color: #a2adb8;
  font-size: 14px;
  line-height: 1.6;
  margin: 24px 0 8px;
}
.public-feedback { margin:32px 0; padding:24px; border:1px solid #293441; border-radius:16px; }
.feedback-question { padding:12px 0; border-bottom:1px solid #293441; }
.feedback-question p { margin:0 0 8px; }
.public-feedback button { background:#15191d; color:#ddd; padding:8px 12px; border:1px solid #46525f; border-radius:8px; cursor:pointer; }
.public-feedback button[aria-pressed="true"] { color:#ffe000; border-color:#ffe000; }
.public-feedback button:disabled { cursor:default; opacity:.7; }
.public-feedback small { color:#a3adb8; }
.public-feedback a { color:#ffe000; }

.public-feedback [hidden] { display:none !important; }
.public-feedback h2 { margin:0 0 10px; }
.public-feedback > p { line-height:1.6; }
.public-feedback > a { display:inline-block; margin:8px 16px 8px 0; }
@media(max-width:480px) { .public-feedback { padding:18px 14px; margin-inline:-8px; } }

.profile-votes { display:flex; align-items:center; flex-wrap:wrap; gap:4px 14px; margin-top:14px; font:13px system-ui,sans-serif; }
.profile-votes button { display:inline-flex; align-items:center; gap:6px; min-height:44px; padding:4px 2px; background:none; border:0; color:#9da7af; font:inherit; cursor:pointer; }
.profile-votes button:hover { color:#eee; }
.profile-votes button[aria-pressed="true"] { color:#dfcb62; }
.profile-votes [data-heart][aria-pressed="true"] { color:#ee7a88; }
.profile-votes svg { fill:none; stroke:currentColor; stroke-width:1.7; }
.profile-votes [data-heart][aria-pressed="true"] svg { fill:currentColor; }
.profile-votes button:disabled { cursor:default; }
.profile-votes [data-more] { padding:0 10px; min-height:28px; border:1px solid #292d33; border-radius:999px; color:#7e8794; }
.profile-votes [data-more]:hover { border-color:#60a5fa; color:#93c5fd; }
.profile-votes.is-open .profile-vote-options { flex-wrap:wrap; overflow:visible; }
.profile-votes button:focus-visible { outline:2px solid #ffe000; outline-offset:3px; border-radius:4px; }
.profile-votes [hidden] { display:none!important; }
.profile-votes [data-status]:empty { display:none; }
.profile-votes [data-status] { flex-basis:100%; color:#a2adb8; }
.profile-votes a { color:#dfcb62; }

/* Keep the reaction choices together; notices remain below the row. */
.profile-vote-options { display:flex; align-items:center; gap:clamp(8px,1.2vw,16px); flex-wrap:nowrap; max-width:100%; overflow-x:auto; scrollbar-width:thin; }
.profile-vote-options button { flex:0 0 auto; white-space:nowrap; font-size:12px; gap:5px; }
