.news-article-body, .forum-post-body { display: flex; flex-direction: column; }
.post-content { flex: 1; min-width: 0; }
.reaction-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-top: 16px; min-height: 44px; }
.reaction-form { margin: 0; }
.reaction-picker { position: relative; min-width: 0; height: 44px; }
.reaction-picker[open] { flex: 1; }
.reaction-toggle { width: fit-content; padding: 4px 8px; border: 1px solid currentColor; border-radius: 14px; font-size: .85em; cursor: pointer; }
.reaction-toggle:focus-visible { outline: 2px solid currentColor; outline-offset: 3px; }
.reaction-toggle { margin-top: 8px; }
.reaction-options { position: absolute; top: 0; left: 70px; right: 0; display: flex; gap: 6px; overflow-x: auto; }
.reaction-options .reaction-form { flex-shrink: 0; }
.reaction-preview { display: flex; flex-wrap: wrap; gap: 6px; }
.reaction-picker[open] + .reaction-preview { display: none; }
.reaction-preview .reaction-button, .reaction-bar > .reaction-readonly { min-width: 0; min-height: 0; padding: 3px 7px; border-color: transparent; font-size: .85em; }
.reaction-button { display: inline-flex; align-items: center; justify-content: center; gap: 5px; min-width: 48px; min-height: 44px; padding: 6px 10px; border: 1px solid currentColor; border-radius: 18px; background: transparent; color: inherit; font: inherit; cursor: pointer; }
.reaction-button[aria-pressed="true"] { background: #294b68; color: #fff; border-color: #8cc9ff; }
.reaction-button:focus-visible { outline: 2px solid currentColor; outline-offset: 3px; }
.reaction-button:disabled { opacity: .6; cursor: wait; }
.reaction-readonly { cursor: default; }
.reaction-count { font-size: .85em; }
.reaction-status { flex-basis: 100%; font-size: .85em; }
.reaction-status:empty { display: none; }
