/* Personajes del tiempo (ui/weather.js). Solo transform y opacity: fluido incluso en un Intel N5000. */
.wx-buddy { display: block; overflow: visible; flex: none; }
.wx-buddy * { transform-box: fill-box; transform-origin: center; }
.wx-buddy .b-bob { animation: wxb-bob 3.6s ease-in-out infinite; }
.wx-buddy .b-spin { animation: wxb-spin 14s linear infinite; transform-origin: 48px 18px; transform-box: view-box; }
.wx-buddy .b-drift { animation: wxb-drift 6s ease-in-out infinite alternate; }
.wx-buddy .b-slide { animation: wxb-slide 4s ease-in-out infinite alternate; }
.wx-buddy .b-fall { opacity: 0; animation: wxb-fall 1.05s linear infinite; }
.wx-buddy .b-flake { opacity: 0; animation: wxb-flake 2.2s linear infinite; }
.wx-buddy .b-flash { opacity: 0; animation: wxb-flash 3.2s steps(1) infinite; }
.wx-buddy .b-twinkle { animation: wxb-tw 2.4s ease-in-out infinite alternate; }
.wx-buddy .b-eyes { animation: wxb-blink 4.5s infinite; }
.b-storm .b-bob { animation: wxb-shiver 3.2s ease-in-out infinite; }

@keyframes wxb-bob { 50% { transform: translateY(-2px); } }
@keyframes wxb-spin { to { transform: rotate(360deg); } }
@keyframes wxb-drift { to { transform: translateX(-6px); } }
@keyframes wxb-slide { to { transform: translateX(6px); } }
@keyframes wxb-fall { 0% { opacity: 0; transform: translateY(-4px); } 20% { opacity: 1; } 100% { opacity: 0; transform: translateY(8px); } }
@keyframes wxb-flake { 0% { opacity: 0; transform: translate(0, -4px); } 25% { opacity: 1; } 50% { transform: translate(2px, 3px); } 100% { opacity: 0; transform: translate(-1px, 10px); } }
@keyframes wxb-flash { 0%, 70%, 78%, 100% { opacity: 0; } 72%, 80% { opacity: 1; } }
@keyframes wxb-tw { to { opacity: .35; } }
@keyframes wxb-blink { 0%, 92%, 100% { transform: scaleY(1); } 95% { transform: scaleY(.1); } }
@keyframes wxb-shiver { 0%, 68%, 84%, 100% { transform: none; } 72% { transform: translateX(-1px); } 76% { transform: translateX(1px); } 80% { transform: translateX(-1px); } }

html.cb-lite .wx-buddy .b-spin, html.cb-lite .wx-buddy .b-drift, html.cb-lite .wx-buddy .b-slide, html.cb-lite .wx-buddy .b-twinkle { animation: none; }
html[data-reduce-motion] .wx-buddy * { animation: none !important; }

/* Chip del tiempo en el chat: personaje + texto */
.wx-chip { gap: 6px !important; }
.wx-chip .wx-buddy { margin: -6px 0 -6px -4px; }