/* The Reasonwell cast: one stylesheet for every portrait's moods.
   idle breathes and blinks · happy hops with smiling eyes · think tilts with a
   raised brow · oops leans back with worried brows · cheer waves both arms. */
.cx { display: block; overflow: visible; }
.cx .cx-shadow { fill: rgba(23, 50, 74, .16); }
.cx .cx-body { transform-box: view-box; transform-origin: 60px 112px; animation: cxBreathe 3.6s ease-in-out infinite; }
.cx .cx-head { transform-box: view-box; transform-origin: 60px 70px; transition: transform .35s cubic-bezier(.3, 1.4, .5, 1); }
.cx .cx-arm-l { transform-box: view-box; transform-origin: 40px 84px; transition: transform .35s cubic-bezier(.3, 1.4, .5, 1); }
.cx .cx-arm-r { transform-box: view-box; transform-origin: 80px 84px; transition: transform .35s cubic-bezier(.3, 1.4, .5, 1); }
.cx .cx-eyes-happy, .cx .cx-brows, .cx .cx-brows-worry, .cx .cx-mouth-happy, .cx .cx-mouth-o, .cx .cx-mouth-think { display: none; }
.cx .cx-cheek { opacity: .55; transition: opacity .3s; }
.cx.cx-blink .cx-eyes-open { transform: scaleY(.12); transform-box: fill-box; transform-origin: center; }
.cx[data-mood="happy"] .cx-eyes-open, .cx[data-mood="cheer"] .cx-eyes-open { display: none; }
.cx[data-mood="happy"] .cx-eyes-happy, .cx[data-mood="cheer"] .cx-eyes-happy { display: inline; }
.cx[data-mood="happy"] .cx-mouth, .cx[data-mood="cheer"] .cx-mouth { display: none; }
.cx[data-mood="happy"] .cx-mouth-happy, .cx[data-mood="cheer"] .cx-mouth-happy { display: inline; }
.cx[data-mood="happy"] .cx-cheek, .cx[data-mood="cheer"] .cx-cheek { opacity: .95; }
.cx[data-mood="happy"] .cx-body { animation: cxHop .7s cubic-bezier(.3, 1.4, .5, 1) 2; }
.cx[data-mood="happy"] .cx-arm-l { transform: rotate(18deg); }
.cx[data-mood="happy"] .cx-arm-r { transform: rotate(-18deg); }
.cx[data-mood="cheer"] .cx-body { animation: cxHop .6s cubic-bezier(.3, 1.4, .5, 1) 3; }
.cx[data-mood="cheer"] .cx-arm-l { transform: rotate(70deg); }
.cx[data-mood="cheer"] .cx-arm-r { transform: rotate(-70deg); }
.cx[data-mood="think"] .cx-head { transform: rotate(-7deg); }
.cx[data-mood="think"] .cx-brows { display: inline; }
.cx[data-mood="think"] .cx-mouth { display: none; }
.cx[data-mood="think"] .cx-mouth-think { display: inline; }
.cx[data-mood="think"] .cx-arm-r { transform: rotate(-40deg); }
.cx[data-mood="oops"] .cx-brows-worry { display: inline; }
.cx[data-mood="oops"] .cx-mouth { display: none; }
.cx[data-mood="oops"] .cx-mouth-o { display: inline; }
.cx[data-mood="oops"] .cx-head { transform: rotate(5deg) translateY(1px); }
.cx[data-mood="oops"] .cx-body { animation: cxWobble .5s ease-in-out 1; }
.cx-tessel .cx-glow { animation: cxGlow 2.8s ease-in-out infinite; transform-box: fill-box; transform-origin: center; }
.cx-bram .cx-spark { opacity: 0; transform-box: fill-box; transform-origin: center; }
.cx-bram[data-mood="happy"] .cx-spark, .cx-bram[data-mood="cheer"] .cx-spark { animation: cxSpark .8s ease-out 2; }
@keyframes cxBreathe { 0%, 100% { transform: none; } 50% { transform: scale(1.012, .988); } }
@keyframes cxHop { 0%, 100% { transform: none; } 40% { transform: translateY(-9px) scale(1.02, .98); } 70% { transform: translateY(0) scale(1.04, .95); } }
@keyframes cxWobble { 0%, 100% { transform: none; } 30% { transform: rotate(-3deg); } 65% { transform: rotate(2.5deg); } }
@keyframes cxGlow { 0%, 100% { transform: scale(1); opacity: .9; } 50% { transform: scale(1.25); opacity: .55; } }
@keyframes cxSpark { 0% { opacity: 0; transform: scale(.4); } 30% { opacity: 1; transform: scale(1.1) rotate(20deg); } 100% { opacity: 0; transform: scale(.6) rotate(45deg); } }
@media (prefers-reduced-motion: reduce) { .cx .cx-body, .cx .cx-glow, .cx .cx-spark { animation: none !important; } .cx .cx-head, .cx .cx-arm-l, .cx .cx-arm-r { transition: none; } }
:root[data-motion="reduced"] .cx .cx-body, :root[data-motion="reduced"] .cx .cx-glow { animation: none !important; }
