/* morphy-sprites.css — All CSS animations for the 8-state Morphy avatar */

/* --- Base transitions --- */
svg .morphy-head,
svg .morphy-mouth,
svg .morphy-body {
    transition: stroke 0.4s ease, filter 0.4s ease;
}
svg .morphy-eyeball-left,
svg .morphy-eyeball-right {
    transition: stroke 0.4s ease;
}
svg .morphy-iris-left,
svg .morphy-iris-right {
    transition: fill 0.4s ease, transform 0.4s ease;
    transform-origin: center;
}
svg .morphy-name {
    transition: fill 0.4s ease;
}
svg .morphy-waves,
svg .morphy-thoughts,
svg .morphy-lightbulb,
svg .morphy-listen-waves {
    transition: opacity 0.3s ease;
}
svg .morphy-brow-left,
svg .morphy-brow-right {
    transition: opacity 0.3s ease, transform 0.3s ease;
}

/* --- Keyframe animations --- */

@keyframes morphy-blink {
    0%, 90%  { transform: scaleY(1); }
    95%      { transform: scaleY(0.1); }
    100%     { transform: scaleY(1); }
}

@keyframes morphy-speak-pulse {
    0%   { filter: drop-shadow(0 0 4px #1D9E75); }
    100% { filter: drop-shadow(0 0 12px #1D9E75); }
}

@keyframes morphy-waves {
    0%, 100% { transform: scaleY(1); }
    50%      { transform: scaleY(1.3); }
}

@keyframes morphy-tilt {
    0%   { transform: rotate(0deg); }
    100% { transform: rotate(-8deg); }
}

@keyframes morphy-listenwave {
    0%, 100% { opacity: 0.5; }
    50%      { opacity: 1; }
}

@keyframes morphy-think-pupils {
    0%   { transform: translateX(0); }
    33%  { transform: translateX(3px); }
    66%  { transform: translateX(-3px); }
    100% { transform: translateX(0); }
}

@keyframes morphy-bounce {
    0%   { transform: translateY(0); }
    100% { transform: translateY(-4px); }
}

@keyframes morphy-glow-pulse {
    0%   { filter: drop-shadow(0 0 8px #EF9F27); }
    100% { filter: drop-shadow(0 0 20px #EF9F27); }
}

@keyframes morphy-brow-raise {
    0%   { transform: translateY(0); }
    100% { transform: translateY(-4px); }
}

/* ==========================================================
   State: IDLE (#378ADD blue)
   ========================================================== */
svg[data-state="IDLE"] .morphy-head         { stroke: #378ADD; }
svg[data-state="IDLE"] .morphy-body         { stroke: #378ADD; }
svg[data-state="IDLE"] .morphy-eyeball-left,
svg[data-state="IDLE"] .morphy-eyeball-right { stroke: #378ADD; }
svg[data-state="IDLE"] .morphy-iris-left,
svg[data-state="IDLE"] .morphy-iris-right   { fill: #378ADD; animation: morphy-blink 4s infinite; }
svg[data-state="IDLE"] .morphy-mouth        { stroke: #378ADD; }
svg[data-state="IDLE"] .morphy-name         { fill: #378ADD; }
svg[data-state="IDLE"] .morphy-brow-left    { stroke: #378ADD; }
svg[data-state="IDLE"] .morphy-brow-right   { stroke: #378ADD; }

/* ==========================================================
   State: SPEAKING (#1D9E75 green)
   ========================================================== */
svg[data-state="SPEAKING"] .morphy-head         { stroke: #1D9E75; animation: morphy-speak-pulse 0.6s alternate infinite; }
svg[data-state="SPEAKING"] .morphy-body         { stroke: #1D9E75; }
svg[data-state="SPEAKING"] .morphy-eyeball-left,
svg[data-state="SPEAKING"] .morphy-eyeball-right { stroke: #1D9E75; }
svg[data-state="SPEAKING"] .morphy-iris-left,
svg[data-state="SPEAKING"] .morphy-iris-right   { fill: #1D9E75; }
svg[data-state="SPEAKING"] .morphy-mouth        { stroke: #1D9E75; }
svg[data-state="SPEAKING"] .morphy-name         { fill: #1D9E75; }
svg[data-state="SPEAKING"] .morphy-brow-left    { stroke: #1D9E75; }
svg[data-state="SPEAKING"] .morphy-brow-right   { stroke: #1D9E75; }
svg[data-state="SPEAKING"] .morphy-waves        { opacity: 1; }
svg[data-state="SPEAKING"] .morphy-waves path   { animation: morphy-waves 1s ease infinite; transform-origin: center; }

/* ==========================================================
   State: LISTENING (#EF9F27 amber)
   ========================================================== */
svg[data-state="LISTENING"] { animation: morphy-tilt 0.4s ease forwards; transform-origin: center bottom; }
svg[data-state="LISTENING"] .morphy-head         { stroke: #EF9F27; }
svg[data-state="LISTENING"] .morphy-body         { stroke: #EF9F27; }
svg[data-state="LISTENING"] .morphy-eyeball-left,
svg[data-state="LISTENING"] .morphy-eyeball-right { stroke: #EF9F27; }
svg[data-state="LISTENING"] .morphy-iris-left,
svg[data-state="LISTENING"] .morphy-iris-right   { fill: #EF9F27; }
svg[data-state="LISTENING"] .morphy-mouth        { stroke: #EF9F27; }
svg[data-state="LISTENING"] .morphy-name         { fill: #EF9F27; }
svg[data-state="LISTENING"] .morphy-brow-left    { stroke: #EF9F27; }
svg[data-state="LISTENING"] .morphy-brow-right   { stroke: #EF9F27; }
svg[data-state="LISTENING"] .morphy-listen-waves { opacity: 1; animation: morphy-listenwave 1.5s ease infinite; }

/* ==========================================================
   State: THINKING (#7F77DD purple)
   ========================================================== */
svg[data-state="THINKING"] .morphy-head         { stroke: #7F77DD; }
svg[data-state="THINKING"] .morphy-body         { stroke: #7F77DD; }
svg[data-state="THINKING"] .morphy-eyeball-left,
svg[data-state="THINKING"] .morphy-eyeball-right { stroke: #7F77DD; }
svg[data-state="THINKING"] .morphy-iris-left,
svg[data-state="THINKING"] .morphy-iris-right   { fill: #7F77DD; }
svg[data-state="THINKING"] .morphy-mouth        { stroke: #7F77DD; }
svg[data-state="THINKING"] .morphy-name         { fill: #7F77DD; }
svg[data-state="THINKING"] .morphy-brow-left    { stroke: #7F77DD; }
svg[data-state="THINKING"] .morphy-brow-right   { stroke: #7F77DD; }
svg[data-state="THINKING"] .morphy-thoughts     { opacity: 1; }
svg[data-state="THINKING"] .morphy-pupil-left,
svg[data-state="THINKING"] .morphy-pupil-right  { animation: morphy-think-pupils 2s ease-in-out infinite; transform-origin: center; }

/* ==========================================================
   State: EXCITED (#FF6B35 orange)
   ========================================================== */
svg[data-state="EXCITED"] { animation: morphy-bounce 0.4s ease alternate infinite; transform-origin: center bottom; }
svg[data-state="EXCITED"] .morphy-head         { stroke: #FF6B35; }
svg[data-state="EXCITED"] .morphy-body         { stroke: #FF6B35; }
svg[data-state="EXCITED"] .morphy-eyeball-left,
svg[data-state="EXCITED"] .morphy-eyeball-right { stroke: #FF6B35; }
svg[data-state="EXCITED"] .morphy-iris-left,
svg[data-state="EXCITED"] .morphy-iris-right   { fill: #FF6B35; transform: scale(1.15); }
svg[data-state="EXCITED"] .morphy-mouth        { stroke: #FF6B35; }
svg[data-state="EXCITED"] .morphy-name         { fill: #FF6B35; }
svg[data-state="EXCITED"] .morphy-brow-left    { stroke: #FF6B35; }
svg[data-state="EXCITED"] .morphy-brow-right   { stroke: #FF6B35; }

/* ==========================================================
   State: SKEPTICAL (#8B8B9E grey)
   ========================================================== */
svg[data-state="SKEPTICAL"] .morphy-head         { stroke: #8B8B9E; }
svg[data-state="SKEPTICAL"] .morphy-body         { stroke: #8B8B9E; }
svg[data-state="SKEPTICAL"] .morphy-eyeball-left,
svg[data-state="SKEPTICAL"] .morphy-eyeball-right { stroke: #8B8B9E; }
svg[data-state="SKEPTICAL"] .morphy-iris-left,
svg[data-state="SKEPTICAL"] .morphy-iris-right   { fill: #8B8B9E; }
svg[data-state="SKEPTICAL"] .morphy-mouth        { stroke: #8B8B9E; }
svg[data-state="SKEPTICAL"] .morphy-name         { fill: #8B8B9E; }
svg[data-state="SKEPTICAL"] .morphy-brow-left    { stroke: #8B8B9E; }
svg[data-state="SKEPTICAL"] .morphy-brow-right   { stroke: #8B8B9E; opacity: 1; animation: morphy-brow-raise 0.3s ease forwards; transform-origin: center; }

/* ==========================================================
   State: INSIGHT (#EF9F27 gold)
   ========================================================== */
svg[data-state="INSIGHT"] .morphy-head         { stroke: #EF9F27; animation: morphy-glow-pulse 0.8s ease 3; }
svg[data-state="INSIGHT"] .morphy-body         { stroke: #EF9F27; }
svg[data-state="INSIGHT"] .morphy-eyeball-left,
svg[data-state="INSIGHT"] .morphy-eyeball-right { stroke: #EF9F27; }
svg[data-state="INSIGHT"] .morphy-iris-left,
svg[data-state="INSIGHT"] .morphy-iris-right   { fill: #EF9F27; }
svg[data-state="INSIGHT"] .morphy-mouth        { stroke: #EF9F27; }
svg[data-state="INSIGHT"] .morphy-name         { fill: #EF9F27; }
svg[data-state="INSIGHT"] .morphy-brow-left    { stroke: #EF9F27; }
svg[data-state="INSIGHT"] .morphy-brow-right   { stroke: #EF9F27; }
svg[data-state="INSIGHT"] .morphy-lightbulb    { opacity: 1; }

/* ==========================================================
   State: SERIOUS (#534AB7 deep purple)
   ========================================================== */
svg[data-state="SERIOUS"] .morphy-head         { stroke: #534AB7; }
svg[data-state="SERIOUS"] .morphy-body         { stroke: #534AB7; }
svg[data-state="SERIOUS"] .morphy-eyeball-left,
svg[data-state="SERIOUS"] .morphy-eyeball-right { stroke: #534AB7; }
svg[data-state="SERIOUS"] .morphy-iris-left,
svg[data-state="SERIOUS"] .morphy-iris-right   { fill: #534AB7; }
svg[data-state="SERIOUS"] .morphy-mouth        { stroke: #534AB7; }
svg[data-state="SERIOUS"] .morphy-name         { fill: #534AB7; }
svg[data-state="SERIOUS"] .morphy-brow-left    { stroke: #534AB7; opacity: 1; }
svg[data-state="SERIOUS"] .morphy-brow-right   { stroke: #534AB7; opacity: 1; }