/* COGO_REACTIONS_R1: compact member reactions and receiver effects. */
#modal .dialog-head.rx-head{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding-right:22px}
#modal .rx-head #modalTitle{flex:1 1 150px;min-width:0;overflow-wrap:anywhere;margin-right:0}
#modal .rx-head>[data-action="close-modal"]{position:static!important;inset:auto!important;flex:0 0 auto;order:3;margin:0}
#modal .rx-actions{display:flex;align-items:center;gap:8px;margin-left:auto;flex:0 0 auto;order:2}
#modal .rx-pill,.cv-vote{box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:34px;padding:6px 12px;border:1px solid #c9d3ff;border-radius:999px;background:#f7f8ff;color:#42549b;font-family:inherit;font-size:13px;line-height:20px;box-shadow:none;white-space:nowrap;transition:background .16s,transform .16s,border-color .16s}
#modal .rx-pill svg,.cv-vote svg{display:block;width:16px;height:16px;flex:none}
#modal .rx-pill strong,.cv-vote b{font-family:inherit;font-size:13px;font-weight:750;line-height:20px;font-variant-numeric:tabular-nums;min-width:1ch}
#modal .rx-pill:disabled{opacity:1;cursor:default}
#modal .rx-pill.rx-heart{background:#fff8fc;border-color:#efc5df;color:#e14d98}
#modal .rx-pill.is-on,.cv-vote.is-voted{background:#4b5be1;border-color:#4b5be1;color:#fff}
#modal .rx-pill:not(:disabled):hover,.cv-vote:not(:disabled):hover{filter:brightness(.97);transform:translateY(-1px)}
#modal .rx-pill:not(:disabled):active,.cv-vote:not(:disabled):active{transform:scale(.95)}
#modal .rx-pill:focus-visible,.cv-vote:focus-visible{outline:3px solid #9faaff;outline-offset:3px}
#modal .rx-status-box{padding:0 24px;font-size:12px;line-height:1.5;color:var(--muted,#677596)}
#modal .rx-status:empty{display:none}#modal .rx-status{margin:8px 0}#modal .rx-status-box:has(.rx-status:empty){padding:0}
html[data-theme="dark"] #modal .rx-pill,body.dark #modal .rx-pill{background:#252e49;border-color:#475b92;color:#c4cfff}
html[data-theme="dark"] #modal .rx-pill.rx-heart,body.dark #modal .rx-pill.rx-heart{background:#392338;border-color:#714060;color:#ffa0d0}
html[data-theme="dark"] #modal .rx-pill.is-on,body.dark #modal .rx-pill.is-on{background:#4b5be1;color:#fff}
#cogoReactionEffect{--rx-color:#ed579f;--rx-soft:#ffe6f4;box-sizing:border-box;position:fixed;inset:0;margin:auto;width:min(420px,calc(100vw - 28px));height:290px;max-height:calc(100dvh - 32px);padding:0;border:0;overflow:visible;background:transparent;pointer-events:none;z-index:2147483646;color:#253552;font-family:inherit;text-align:center;opacity:1}
#cogoReactionEffect::backdrop{background:transparent;pointer-events:none}
#cogoReactionEffect.is-thumb{--rx-color:#6875ec;--rx-soft:#e6eaff}
.rx-burst{position:relative;width:200px;height:180px;margin:auto;color:var(--rx-color)}
.rx-big{position:absolute;left:62px;top:53px;display:grid;place-items:center;width:76px;height:76px;border-radius:26px;background:var(--rx-soft);box-shadow:0 10px 45px color-mix(in srgb,var(--rx-color) 30%,transparent);animation:rx-pop .65s cubic-bezier(.2,1.5,.4,1) both}
.rx-big svg{width:44px;height:44px;filter:drop-shadow(0 2px 1px #ffffff90)}
.rx-ring{position:absolute;left:62px;top:53px;width:76px;height:76px;border-radius:50%;border:2px solid var(--rx-color);animation:rx-ring 1.2s ease-out both}
.rx-spark{position:absolute;left:90px;top:80px;width:20px;height:20px;animation:rx-spark 1.65s cubic-bezier(.1,.7,.2,1) var(--delay) both;transform:rotate(var(--a)) translateY(calc(-1 * var(--d))) rotate(calc(-1 * var(--a)))}
.rx-spark svg{display:block;width:20px;height:20px}
.rx-copy{padding:16px 18px;border:1px solid color-mix(in srgb,var(--rx-color) 25%,#fff);border-radius:18px;background:#ffffffed;box-shadow:0 12px 50px #17264425;backdrop-filter:blur(10px);animation:rx-copy .4s ease both}
.rx-copy small{display:block;color:var(--rx-color);font-size:10px;letter-spacing:2px;font-weight:800}.rx-copy strong{display:block;font-size:16px;margin:7px 0 5px;overflow-wrap:anywhere}.rx-copy>span{font-size:12px;color:#627294}
#cogoReactionEffect.is-reduced{height:auto;max-height:200px;inset:auto 0 30px}.is-reduced .rx-burst{display:none}.is-reduced .rx-copy{animation:none}
@keyframes rx-pop{0%{opacity:0;transform:scale(.2) rotate(-16deg)}65%{opacity:1;transform:scale(1.1) rotate(5deg)}100%{transform:scale(1)}}
@keyframes rx-ring{0%{transform:scale(.5);opacity:.8}100%{transform:scale(2.7);opacity:0}}
@keyframes rx-spark{0%{opacity:0;transform:rotate(var(--a)) translateY(0) scale(.3)}20%{opacity:1}100%{opacity:0;transform:rotate(var(--a)) translateY(calc(-1 * var(--d))) rotate(calc(-1 * var(--a))) scale(.8)}}
@keyframes rx-copy{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@media(max-width:480px){#modal .dialog-head.rx-head{gap:8px;padding:16px}#modal .rx-head #modalTitle{flex-basis:calc(100% - 42px);order:0}#modal .rx-head>[data-action="close-modal"]{order:1}#modal .rx-actions{order:2}#modal .rx-pill{min-height:36px;padding:6px 12px}.rx-copy strong{font-size:14px}}
@media(prefers-reduced-motion:reduce){#modal .rx-pill,.cv-vote{transition:none}.rx-burst{display:none}#cogoReactionEffect{height:auto;inset:auto 0 30px}.rx-copy{animation:none}}
/* Existing board styles use !important; bind the unified header explicitly. */
#modal[open] > .dialog-head.rx-head{display:grid!important;grid-template-columns:minmax(0,1fr) auto 36px!important;align-items:center!important;gap:10px!important;padding:18px 22px!important}
#modal[open] > .dialog-head.rx-head > #modalTitle{grid-column:1;grid-row:1;min-width:0;max-width:none!important;flex:none!important;width:auto!important;margin:0!important;padding:0!important}
#modal[open] > .dialog-head.rx-head > .rx-actions{grid-column:2;grid-row:1;margin:0;justify-self:end;align-self:center}
#modal[open] > .dialog-head.rx-head > [data-action="close-modal"]{grid-column:3;grid-row:1;width:36px!important;min-width:36px!important;height:36px!important;padding:8px!important;align-self:center!important;justify-self:end}
#modal .rx-actions > .rx-pill{opacity:1!important}
#modal .rx-actions > .rx-pill.rx-thumb:not(.is-on){background:#f7f8ff!important;color:#42549b!important;border-color:#c9d3ff!important}
#modal .rx-actions > .rx-pill.rx-thumb.is-on{background:#4b5be1!important;color:#fff!important;border-color:#4b5be1!important}
html[data-theme="dark"] #modal .rx-actions > .rx-pill.rx-thumb:not(.is-on){background:#252e49!important;color:#c4cfff!important;border-color:#475b92!important}
@media(max-width:480px){
 #modal[open] > .dialog-head.rx-head{gap:8px!important;padding:14px!important}
 #modal[open].board-modal28 > .dialog-head.rx-head{grid-template-columns:minmax(0,1fr) 36px!important;row-gap:12px!important}
 #modal[open].board-modal28 > .dialog-head.rx-head > #modalTitle{grid-column:1/-1;grid-row:2}
 #modal[open].board-modal28 > .dialog-head.rx-head > .rx-actions{grid-column:1;grid-row:1}
 #modal[open].board-modal28 > .dialog-head.rx-head > [data-action="close-modal"]{grid-column:2;grid-row:1}
}
