/* --------------------------------------------------------------------------
   El personaje: «el Forzudo». Una cara con dos mancuernas y una barra con discos (todo en em: el tamaño lo da
   font-size). js/asistente.js le pone data-mood (cómo vas) y data-move (un ejercicio):
   mancuernas d-curl, d-press, d-lateral, d-alt, d-front; barra b-squat, b-press, b-deadlift, b-curl.
   -------------------------------------------------------------------------- */
.buddy {
    --buddy-face-a: #d9714a;
    --buddy-face-b: #b4502f;
    --buddy-glow: rgba(212, 103, 63, .45);
    --buddy-eye: #fff4ee;
    --buddy-iron: #2b1610;
    --buddy-grip: #6b3322;
    --buddy-spring: cubic-bezier(.3, 1.45, .5, 1);
    position: relative;
    display: inline-block;
    width: 3em;
    height: 3em;
    flex: 0 0 auto;
    transition: transform .4s var(--app-ease);
}
.buddy__face {
    position: absolute;
    z-index: 2;
    left: .45em;
    top: .32em;
    width: 2.1em;
    height: 2.1em;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .27em;
    border-radius: .74em;
    background: linear-gradient(160deg, var(--buddy-face-a), var(--buddy-face-b));
    box-shadow: inset 0 .1em .2em rgba(255, 255, 255, .22), inset 0 -.12em .25em rgba(0, 0, 0, .14), 0 0 .6em var(--buddy-glow);
    transition: background .45s ease, box-shadow .45s ease;
}
.buddy__eye {
    width: .22em;
    height: .54em;
    border-radius: .12em;
    background: var(--buddy-eye);
    transform: translate(calc(var(--look-x, 0) * .1em), calc(var(--look-y, 0) * .07em));
    transition: height .25s ease, width .25s ease, border-radius .25s ease, transform .3s var(--app-ease), background .3s ease;
}
/* Sudor al esforzarse. */
.buddy__face::after {
    content: "";
    position: absolute;
    top: .18em;
    right: .2em;
    width: .2em;
    height: .28em;
    border-radius: 50% 50% 50% 50% / 60% 60% 40% 40%;
    background: #a9d8ff;
    opacity: 0;
}
.buddy[data-move] .buddy__face::after { animation: buddy-sweat 1.1s ease-out .3s; }

/* Mancuernas: dos discos (::before y ::after) y el agarre (b). --dir: -1 izquierda, 1 derecha. */
.buddy__arm {
    position: absolute;
    z-index: 3;
    top: 1.72em;
    width: 1.05em;
    height: .78em;
    font-style: normal;
    transition: translate .5s var(--buddy-spring), rotate .5s var(--buddy-spring), opacity .25s ease, scale .25s ease;
}
.buddy__arm--l { --dir: -1; left: -.14em; }
.buddy__arm--r { --dir: 1; right: -.14em; }
.buddy__arm::before,
.buddy__arm::after,
.buddy__bar::before,
.buddy__bar::after {
    content: "";
    position: absolute;
    top: 0;
    width: .29em;
    height: 100%;
    border-radius: .1em;
    background: var(--buddy-iron);
    box-shadow: inset 0 .05em 0 rgba(255, 255, 255, .14);
}
.buddy__arm::before { left: 0; }
.buddy__arm::after { right: 0; }
.buddy__arm b,
.buddy__bar b {
    position: absolute;
    top: 50%;
    left: .18em;
    right: .18em;
    height: .13em;
    margin-top: -.065em;
    border-radius: .07em;
    background: var(--buddy-grip);
}

/* Barra con discos: oculta salvo en los ejercicios con barra (data-move="b-…"). */
.buddy__bar {
    position: absolute;
    z-index: 3;
    left: -.55em;
    right: -.55em;
    top: 1.85em;
    height: .92em;
    font-style: normal;
    opacity: 0;
    scale: .7 1;
    transition: opacity .25s ease, scale .3s var(--buddy-spring);
}
.buddy__bar::before { left: 0; width: .3em; }
.buddy__bar::after { right: 0; width: .3em; }
.buddy__bar b { left: .1em; right: .1em; height: .12em; margin-top: -.06em; }
/* Segundo disco, más pequeño, en cada lado. */
.buddy__bar b::before,
.buddy__bar b::after {
    content: "";
    position: absolute;
    top: -.24em;
    width: .16em;
    height: .6em;
    border-radius: .07em;
    background: var(--buddy-iron);
}
.buddy__bar b::before { left: .26em; }
.buddy__bar b::after { right: .26em; }
.buddy[data-move^="b-"] .buddy__bar { opacity: 1; scale: 1; }
.buddy[data-move^="b-"] .buddy__arm { opacity: 0; scale: .6; }

/* Esfuerzo: ojos entornados mientras hace la serie. */
.buddy[data-move] .buddy__eye { width: .3em; height: .12em; border-radius: 99px; }

/* Ejercicios con mancuernas. */
.buddy[data-move="d-curl"] .buddy__arm { animation: buddy-curl .7s var(--app-ease) 2; }
.buddy[data-move="d-alt"] .buddy__arm--l { animation: buddy-curl .7s var(--app-ease); }
.buddy[data-move="d-alt"] .buddy__arm--r { animation: buddy-curl .7s var(--app-ease) .7s; }
.buddy[data-move="d-press"] .buddy__arm { animation: buddy-press .8s var(--app-ease) 2; }
.buddy[data-move="d-press"] .buddy__face { animation: buddy-brace .8s ease-in-out 2; }
.buddy[data-move="d-lateral"] .buddy__arm { animation: buddy-lateral .8s var(--app-ease) 2; }
.buddy[data-move="d-front"] .buddy__arm { animation: buddy-front .8s var(--app-ease) 2; }
/* Ejercicios con barra. */
.buddy[data-move="b-squat"] .buddy__bar { z-index: 1; animation: buddy-bar-squat .9s ease-in-out 2; }
.buddy[data-move="b-squat"] .buddy__face { animation: buddy-squat .9s ease-in-out 2; }
.buddy[data-move="b-press"] .buddy__bar { animation: buddy-bar-press .85s var(--app-ease) 2; }
.buddy[data-move="b-press"] .buddy__face { animation: buddy-brace .85s ease-in-out 2; }
.buddy[data-move="b-deadlift"] .buddy__bar { animation: buddy-bar-deadlift 1s ease-in-out 2; }
.buddy[data-move="b-deadlift"] .buddy__face { animation: buddy-deadlift 1s ease-in-out 2; }
.buddy[data-move="b-curl"] .buddy__bar { animation: buddy-bar-curl .75s var(--app-ease) 2; }

@keyframes buddy-curl { 40%, 55% { translate: calc(var(--dir) * -.12em) -.95em; rotate: calc(var(--dir) * -28deg); } }
@keyframes buddy-press { 45%, 60% { translate: calc(var(--dir) * -.22em) -1.95em; } }
@keyframes buddy-lateral { 45%, 60% { translate: calc(var(--dir) * .55em) -.8em; rotate: calc(var(--dir) * 32deg); } }
@keyframes buddy-front { 45%, 60% { translate: calc(var(--dir) * -.38em) -.65em; scale: 1.3; } }
@keyframes buddy-brace { 50% { scale: 1.04 .95; } }
@keyframes buddy-bar-squat { 0%, 100% { translate: 0 -1.75em; } 45%, 55% { translate: 0 -1.3em; } }
@keyframes buddy-squat { 45%, 55% { translate: 0 .45em; scale: 1.07 .9; } }
@keyframes buddy-bar-press { 0%, 100% { translate: 0 -.75em; } 45%, 60% { translate: 0 -2.35em; } }
@keyframes buddy-bar-deadlift { 0%, 100% { translate: 0 .55em; } 45%, 60% { translate: 0 -.15em; } }
@keyframes buddy-deadlift { 0%, 100% { translate: 0 .22em; rotate: 0deg; scale: 1 .96; } 45%, 60% { translate: 0 -.05em; scale: 1; } }
@keyframes buddy-bar-curl { 0%, 100% { translate: 0 .15em; } 45%, 55% { translate: 0 -.5em; } }
@keyframes buddy-sweat { 0% { opacity: 0; } 25% { opacity: 1; } 100% { opacity: 0; translate: .06em .7em; } }

/* Ánimos. */
.buddy[data-mood="happy"] .buddy__eye { height: .2em; width: .36em; background: transparent; border: .09em solid var(--buddy-eye); border-bottom: 0; border-radius: .3em .3em 0 0; }
.buddy[data-mood="happy"]:not([data-move]) .buddy__arm { translate: calc(var(--dir) * .08em) -.28em; rotate: calc(var(--dir) * 14deg); }
.buddy[data-mood="sleepy"] { --buddy-face-a: #bdb6af; --buddy-face-b: #a09890; --buddy-glow: transparent; }
.buddy[data-mood="sleepy"] .buddy__eye { height: .07em; width: .3em; border-radius: 99px; opacity: .8; }
.buddy[data-mood="sleepy"] .buddy__arm { translate: 0 .55em; }
.buddy[data-mood="worried"] { --buddy-face-a: #e0a347; --buddy-face-b: #bd7d1f; --buddy-glow: rgba(224, 163, 71, .42); }
.buddy[data-mood="worried"] .buddy__eye { height: .4em; }
.buddy[data-mood="worried"] .buddy__eye:first-child { transform: rotate(-20deg); }
.buddy[data-mood="worried"] .buddy__eye:last-child { transform: rotate(20deg); }
.buddy[data-mood="thinking"] .buddy__eye { transform: translate(.1em, -.12em); }
.buddy[data-mood="thinking"] .buddy__eye:last-child { height: .4em; }
.buddy[data-mood="thinking"]:not([data-move]) .buddy__arm--l { translate: .3em -1.05em; rotate: -38deg; }
.buddy[data-mood="confused"] { transform: rotate(-7deg); }
.buddy[data-mood="confused"] .buddy__eye:last-child { height: .32em; }
.buddy[data-mood="listening"] .buddy__face { animation: buddy-listen 1.2s ease-in-out infinite; }
.buddy[data-mood="listening"] .buddy__eye { height: .62em; }
.buddy.is-blink .buddy__eye { animation: buddy-blink .22s ease; }
.buddy.is-hop { animation: buddy-hop .7s var(--app-ease); }
[data-bs-theme="dark"] .buddy { --buddy-iron: #3a2018; --buddy-grip: #8a4630; }
[data-bs-theme="dark"] .buddy__arm::before,
[data-bs-theme="dark"] .buddy__arm::after,
[data-bs-theme="dark"] .buddy__bar::before,
[data-bs-theme="dark"] .buddy__bar::after { box-shadow: inset 0 .05em 0 rgba(255, 255, 255, .2), 0 0 0 .03em rgba(255, 219, 209, .18); }
@keyframes buddy-blink { 50% { scale: 1 .1; } }
@keyframes buddy-hop { 30% { transform: translateY(-.35em) scale(1.04, .96); } 55% { transform: translateY(0) scale(.96, 1.04); } 75% { transform: translateY(-.08em); } }
@keyframes buddy-listen { 50% { scale: 1.06; } }
@media (prefers-reduced-motion: reduce) { .buddy *, .buddy *::before, .buddy *::after { animation: none !important; } }
.buddy--sm { font-size: .9rem; }
.buddy--md { font-size: 1.05rem; }
.buddy--xl { font-size: 1.9rem; }
/* En la barra inferior: grande y asomando por encima, con un anillo del color del fondo que lo separa (como el
   orbe de Finance) y respirando cuando no entrena. */
.app-dock__orb { width: 4.6rem; height: 3.7rem; padding: 0; overflow: visible; background: transparent !important; box-shadow: none !important; }
.app-dock__orb .buddy { font-size: 1.62rem; margin-top: -1.7rem; }
.app-dock__orb .buddy__face { box-shadow: inset 0 .1em .2em rgba(255, 255, 255, .22), inset 0 -.12em .25em rgba(0, 0, 0, .14), 0 0 0 .13em var(--app-bg), 0 .35em .7em -.2em var(--buddy-glow); }
.app-dock__orb .buddy:not([data-move]):not([data-mood="listening"]) .buddy__face { animation: buddy-breathe 4.5s ease-in-out infinite; }
@keyframes buddy-breathe { 50% { scale: 1.04; } }
