.rcn-box{background:var(--rcn-bg,#fff);color:var(--rcn-text,#1f2937);border-radius:calc(var(--rcn-radius,18px) + 6px);padding:20px;box-shadow:var(--rcn-shadow,none);border:1px solid rgba(15,23,42,.06);display:grid;gap:18px;position:relative;overflow:hidden}
.rcn-box *{box-sizing:border-box}
.rcn-section{display:grid;gap:12px}
.rcn-heading{font-size:28px;font-weight:700;line-height:1.2}
.rcn-reactions,.rcn-stars{display:flex;flex-wrap:wrap;gap:10px}
.rcn-reaction-btn,.rcn-star-btn{appearance:none;-webkit-appearance:none;border:1px solid var(--rcn-border-color,#dbe3ef);background:var(--rcn-btn-bg,#f0f2f5);color:var(--rcn-text,#1f2937);cursor:pointer;transition:transform .18s ease, box-shadow .18s ease, background-color .18s ease, border-color .18s ease, opacity .18s ease;outline:none}
.rcn-reaction-btn{display:flex;align-items:var(--rcn-button-align,center);justify-content:flex-start;gap:10px;padding:10px 14px;min-height:56px;border-radius:calc(var(--rcn-radius,18px) - 2px);position:relative}
.rcn-reaction-btn:hover{background:var(--rcn-hover-bg,#e4e6eb);transform:translateY(-1px);box-shadow:0 8px 18px rgba(15,23,42,.08)}
.rcn-reaction-btn:focus-visible,.rcn-star-btn:focus-visible{outline:2px solid var(--rcn-accent,#1877f2);outline-offset:2px}
.rcn-reaction-btn.is-active{background:var(--rcn-active-bg,#eff6ff);border-color:var(--rcn-accent,#1877f2);box-shadow:0 0 0 1px color-mix(in srgb, var(--rcn-accent,#1877f2) 28%, transparent),0 10px 22px rgba(24,119,242,.09)}
.rcn-reaction-icon{display:inline-flex;align-items:center;justify-content:center;align-self:center;flex:0 0 auto;width:calc(var(--rcn-icon-size,28px) + 10px);height:calc(var(--rcn-icon-size,28px) + 10px);min-width:calc(var(--rcn-icon-size,28px) + 10px);border-radius:999px;font-size:var(--rcn-icon-size,28px);line-height:1;position:relative;top:var(--rcn-icon-shift,0px);transition:transform .24s ease, filter .24s ease, background-color .24s ease;filter:saturate(1.04)}
.rcn-reaction-icon--like{background:var(--rcn-tone-like,#dbeafe)}
.rcn-reaction-icon--love{background:var(--rcn-tone-love,#ffe4e6)}
.rcn-reaction-icon--care{background:var(--rcn-tone-care,#ffedd5)}
.rcn-reaction-icon--haha{background:var(--rcn-tone-haha,#fef3c7)}
.rcn-reaction-icon--wow{background:var(--rcn-tone-wow,#fde68a)}
.rcn-reaction-icon--sad{background:var(--rcn-tone-sad,#e5e7eb)}
.rcn-reaction-icon--angry{background:var(--rcn-tone-angry,#fee2e2)}
.rcn-reaction-emoji{display:flex;align-items:center;justify-content:center;line-height:1;margin:0;padding:0;transform:none}
.rcn-reaction-label{font-weight:600;font-size:14px;white-space:nowrap;align-self:center;line-height:1.2}
.rcn-reaction-count{display:inline-flex;align-items:center;justify-content:center;align-self:center;flex:0 0 auto;min-width:26px;height:26px;padding:0 8px;border-radius:999px;background:var(--rcn-badge-bg,#e5e7eb);color:var(--rcn-badge-text,#374151);font-weight:700;font-size:13px;line-height:1;position:relative;top:0;vertical-align:middle}
.rcn-stars{gap:12px}
.rcn-star-btn{width:48px;height:48px;border-radius:14px;display:inline-flex;align-items:center;justify-content:center;font-size:28px;line-height:1;color:var(--rcn-star-inactive,#cbd5e1);background:#fff}
.rcn-star-btn:hover{background:var(--rcn-hover-bg,#e4e6eb);transform:translateY(-1px);box-shadow:0 8px 18px rgba(15,23,42,.08)}
.rcn-star-btn.is-active,.rcn-star-btn.rcn-hovered{color:var(--rcn-star-active,#fbbf24);background:var(--rcn-active-bg,#fff7db);border-color:color-mix(in srgb, var(--rcn-star-active,#fbbf24) 50%, var(--rcn-border-color,#dbe3ef))}
.rcn-meta-line{display:flex;flex-wrap:wrap;gap:16px;font-size:13px;opacity:.94}
.rcn-status-wrap{display:flex;align-items:center;gap:8px;min-height:22px}
.rcn-loader{width:16px;height:16px;border-radius:50%;border:2px solid color-mix(in srgb, var(--rcn-status-loading,#1877f2) 18%, transparent);border-top-color:var(--rcn-status-loading,#1877f2);opacity:0;transform:scale(.7);transition:opacity .18s ease, transform .18s ease;animation:rcn-spin .8s linear infinite}
.rcn-status{min-height:18px;font-size:13px;font-weight:700;color:var(--rcn-status-loading,#1877f2)}
.rcn-status.is-error{color:var(--rcn-status-error,#c62828)}
.rcn-status.is-ok{color:var(--rcn-status-success,#15803d)}
.rcn-status.is-loading{color:var(--rcn-status-loading,#1877f2)}
.rcn-box.is-loading .rcn-loader{opacity:1;transform:scale(1)}
.rcn-box.is-loading .rcn-reaction-btn,.rcn-box.is-loading .rcn-star-btn{pointer-events:none;opacity:.74}
.rcn-has-animations .rcn-reaction-btn:hover .rcn-reaction-icon{transform:scale(1.1) translateY(-1px)}
.rcn-has-animations .rcn-reaction-btn.is-burst .rcn-reaction-icon,.rcn-has-animations .rcn-star-btn.is-burst span{animation:rcn-bounce .45s cubic-bezier(.2,.9,.2,1)}
.rcn-has-animations .rcn-reaction-btn.is-burst,.rcn-has-animations .rcn-star-btn.is-burst{animation:rcn-pop .35s ease}
@keyframes rcn-pop{0%{transform:scale(1)}50%{transform:scale(1.045)}100%{transform:scale(1)}}
@keyframes rcn-bounce{0%{transform:scale(1)}35%{transform:scale(1.25)}60%{transform:scale(.94)}100%{transform:scale(1)}}
@keyframes rcn-spin{to{transform:rotate(360deg)}}
.rcn-style-facebook .rcn-reaction-btn{background:var(--rcn-btn-bg,#f0f2f5)}
.rcn-style-modern .rcn-reaction-btn,.rcn-style-modern .rcn-star-btn{box-shadow:inset 0 0 0 1px rgba(24,119,242,.08),0 10px 25px rgba(24,119,242,.05)}
.rcn-style-modern .rcn-reaction-btn{border-radius:18px}
.rcn-style-modern .rcn-star-btn{border-radius:16px}
.rcn-style-compact .rcn-box{padding:16px;gap:14px}
.rcn-style-compact .rcn-heading{font-size:24px}
.rcn-style-compact .rcn-reaction-btn{padding:8px 10px;gap:8px;min-height:46px}
.rcn-style-compact .rcn-reaction-label,.rcn-style-compact .rcn-reaction-count,.rcn-style-compact .rcn-meta-line{font-size:12px}
.rcn-style-compact .rcn-star-btn{width:42px;height:42px;font-size:24px}
.rcn-icons-only .rcn-reaction-btn{gap:8px;padding:10px 12px;justify-content:center}
.rcn-icons-only .rcn-reaction-label,.rcn-hide-labels .rcn-reaction-label{display:none!important}
@media (max-width:640px){
  .rcn-box{padding:15px}
  .rcn-heading{font-size:23px}
  .rcn-reactions{gap:8px}
  .rcn-reaction-btn{padding:9px 10px;gap:8px;min-height:48px}
  .rcn-reaction-count{min-width:24px;height:24px;padding:0 7px}
  .rcn-star-btn{width:42px;height:42px;font-size:24px}
}