.sv-reaction-emoji { font-family: 'Apple Color Emoji','Segoe UI Emoji','Noto Color Emoji',sans-serif; font-weight: 400; }
.post-action-buttons .sv-reaction-toggle .sv-reaction-emoji { font-size: 18px; line-height: 1; }
.post-action-buttons .sv-reaction-toggle.is-reacted { color: #0874f9 !important; }
.post-action-buttons .sv-reaction-toggle:disabled { cursor: wait; opacity: .65; }
.sv-reaction-menu { position: fixed; z-index: 99999; width: max-content; max-width: calc(100vw - 16px); box-sizing: border-box; padding: 6px; border: 1px solid var(--line,#cbd8e8); border-radius: 12px; color: var(--ink,#24355a); background: var(--surface,#fff); box-shadow: 0 8px 28px rgba(19,41,76,.2); }
.sv-reaction-menu[hidden], .sv-reaction-menu button[hidden] { display: none; }
.sv-reaction-choices { display: flex; gap: 4px; }
.sv-reaction-choices button { flex: 0 0 36px; width: 36px; height: 40px; display: inline-flex; align-items: center; justify-content: center; margin: 0; padding: 0; border: 0; border-radius: 8px; background: transparent; cursor: pointer; font: 28px/1 'Apple Color Emoji','Segoe UI Emoji','Noto Color Emoji',sans-serif; transition: transform .12s,background .12s; }
.sv-reaction-choices button:hover { transform: translateY(-3px) scale(1.12); background: var(--soft,#edf5ff); }
.sv-reaction-choices button[aria-checked='true'] { background: var(--soft,#edf5ff); box-shadow: inset 0 0 0 2px var(--blue,#0874f9); }
.sv-reaction-menu button:focus-visible { outline: 2px solid var(--blue,#0874f9); outline-offset: 1px; }
.sv-reaction-menu [data-reaction-remove] { width: 100%; min-height: 32px; margin-top: 5px; padding: 5px 8px; border: 0; border-top: 1px solid var(--line,#dce5f0); border-radius: 0 0 7px 7px; color: var(--muted,#536781); background: transparent; cursor: pointer; font: 11px/1.4 Inter,Arial,sans-serif; }
.sv-reaction-menu [data-reaction-remove]:hover { color: var(--blue,#0874f9); background: var(--soft,#edf5ff); }
.post-reactions.reacted-users { flex-wrap: wrap; gap: 6px; }
.post-reactions > .sv-reaction-counts, .post-reactions > .sv-reaction-people { width: auto; height: auto; margin: 0; border: 0; border-radius: 0; background: transparent; }
.post-reactions > .sv-reaction-counts { display: inline-flex; flex-wrap: wrap; gap: 4px; max-width: 100%; }
.sv-reaction-count { display: inline-flex; align-items: center; gap: 4px; min-height: 24px; padding: 2px 6px; border: 1px solid var(--line,#dce5f0); border-radius: 12px; color: var(--muted,#536781); background: var(--soft,#f4f8fd); font-size: 10px; }
.sv-reaction-count .sv-reaction-emoji { font-size: 15px; line-height: 1; }
.post-reactions > .sv-reaction-people { display: inline; color: var(--muted,#71809a); font-size: 10px; line-height: 1.5; }
.sv-reaction-error { margin: 0 0 8px; color: #b4232f; font-size: 11px; }
@media (max-width: 360px) { .sv-reaction-choices button { flex-basis: 32px; width: 32px; font-size: 26px; } }
@media (prefers-reduced-motion: reduce) { .sv-reaction-choices button { transition: none; } .sv-reaction-choices button:hover { transform: none; } }
