/* Article reactions use the shared homepage button palette. */
.jo-single-redesign .jo-blog-reactions { margin: 40px 0 28px; padding: 28px 0; border-top: 1px solid #e7dfce; border-bottom: 1px solid #e7dfce; color: #172033; }
.jo-single-redesign .jo-blog-reactions__eyebrow { color: #80642d; font-size: 13px; font-weight: 700; letter-spacing: 1px; text-transform: uppercase; }
.jo-single-redesign .jo-blog-reactions__heading h2 { margin: 8px 0 12px; font: 600 clamp(23px,3vw,30px)/1.3 Raleway,Arial,sans-serif; }
.jo-single-redesign .jo-blog-reactions__heading p { margin: 0 0 24px; color: #606a78; }
.jo-single-redesign .jo-blog-reactions__grid { display: flex; flex-wrap: wrap; gap: 16px; padding: 4px; }
.jo-single-redesign .jo-blog-reactions__button { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 52px; padding: 14px 22px; border: 1px solid var(--jo-button-border); border-radius: 8px; background: var(--jo-button-gold-gradient); color: var(--jo-button-color); text-shadow: var(--jo-button-text-shadow); box-shadow: 0 14px 30px rgba(201,162,39,.32),inset 0 1px 0 rgba(255,255,255,.42); text-transform: none; font: 800 16px/1.2 'Source Sans Pro',Arial,sans-serif; cursor: pointer; transition: background 180ms ease,box-shadow 180ms ease; }
.jo-single-redesign .jo-blog-reactions__button:is(:hover,:focus-visible) { background: var(--jo-button-hover-gradient); box-shadow: 0 16px 32px rgba(12,61,84,.28),inset 0 1px 0 rgba(255,255,255,.12); }
.jo-single-redesign .jo-blog-reactions__button:focus-visible { outline: 2px solid #172033; outline-offset: 4px; }
.jo-single-redesign .jo-blog-reactions__button[aria-pressed="true"] { outline: 2px solid #80642d; outline-offset: 4px; }
.jo-single-redesign .jo-blog-reactions__button:disabled { cursor: wait; opacity: .6; }
.jo-single-redesign .jo-blog-reactions__emoji { font-size: 24px; font-family: "Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji",sans-serif; }
.jo-single-redesign .jo-blog-reactions__count { min-width: 18px; font-variant-numeric: tabular-nums; }
.jo-single-redesign .jo-blog-reactions__status { margin: 22px 0 0; font-size: 15px; color: #606a78; }
.jo-single-redesign .jo-blog-reactions__error { color: #a02e24; }
.jo-single-redesign .jo-blog-reactions [hidden] { display: none; }
@media (max-width: 600px) {
 .jo-single-redesign .jo-blog-reactions__grid { display: grid; grid-template-columns: 1fr; }
 .jo-single-redesign .jo-blog-reactions__button { width: 100%; }
}
@media (prefers-reduced-motion: reduce) {
 .jo-single-redesign .jo-blog-reactions__button { transition: none; }
}

/* Live reaction totals on the opening cover, independent of the voting controls. */
body.single-post .jo-blog-reactions-cover { position: relative; }
body.single-post .jo-blog-reactions-cover__summary { position: absolute; top: 16px; right: 16px; z-index: 4; display: flex; flex-wrap: wrap; gap: 8px; max-width: calc(100% - 32px); pointer-events: none; }
body.single-post .jo-blog-reactions-cover__summary[hidden] { display: none; }
body.single-post .jo-blog-reactions-cover__chip { display: inline-flex; align-items: center; gap: 8px; padding: 8px 12px; border: 1px solid rgba(225,196,119,.65); border-radius: 18px; background: rgba(8,17,31,.94); color: #fbfaf7; box-shadow: 0 4px 14px rgba(0,0,0,.2); font: 700 16px/1.25 'Source Sans Pro',Arial,sans-serif; font-variant-numeric: tabular-nums; }
body.single-post .jo-blog-reactions-cover__emoji { font: 22px/1 'Apple Color Emoji','Segoe UI Emoji','Noto Color Emoji',sans-serif; }
@media (max-width: 600px) {
 body.single-post .jo-blog-reactions-cover__summary { top: 10px; right: 10px; max-width: calc(100% - 20px); gap: 6px; }
 body.single-post .jo-blog-reactions-cover__chip { padding: 6px 9px; font-size: 14px; gap: 6px; }
 body.single-post .jo-blog-reactions-cover__emoji { font-size: 20px; }
}
body.single-post .jo-blog-reactions-cover__image-wrap { display: block; width: fit-content; max-width: 100%; }