/* ═════════════════════════════
   VELTRIX — VELIX CHARACTER
   ═════════════════════════════ */
#velix-character-wrap {
  position: relative;
  width: 280px;
  flex-shrink: 0;
  z-index: 2;
}

#velix-svg {
  width: 100%;
  height: auto;
  filter: drop-shadow(0 0 30px rgba(245, 179, 1, 0.08));
  animation: velix-breathe 4s ease-in-out infinite;
}

@keyframes velix-breathe {
  0%, 100% { transform: translateY(0px); }
  50%       { transform: translateY(-6px); }
}

/* Dot indicators on chest */
.vx-dot {
  animation: dot-pulse 2.5s ease-in-out infinite;
}
.vx-dot:nth-child(2) { animation-delay: 0.3s; }
.vx-dot:nth-child(3) { animation-delay: 0.6s; }

@keyframes dot-pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.3; }
}

/* Holographic floaters */
.vx-holo {
  animation: holo-float 3s ease-in-out infinite;
}
#holo-r { animation-delay: 1.5s; }

@keyframes holo-float {
  0%, 100% { transform: translateY(0px); opacity: 0.7; }
  50%       { transform: translateY(-5px); opacity: 1; }
}

/* Eye glow pulse */
#vx-iris-l, #vx-iris-r {
  animation: eye-glow 3s ease-in-out infinite;
}
#vx-iris-r { animation-delay: 0.4s; }

@keyframes eye-glow {
  0%, 100% { filter: brightness(1); }
  50%       { filter: brightness(1.3) drop-shadow(0 0 4px rgba(245,179,1,0.8)); }
}

/* Blink animation */
.vx-blink {
  animation: velix-blink 4s ease-in-out infinite;
}
@keyframes velix-blink {
  0%, 94%, 100% { transform: scaleY(1); }
  96%, 98% { transform: scaleY(0.05); }
}

/* Mouth expression when "happy" */
.vx-mouth-happy {
  transition: d 0.3s ease-out;
}

/* Head subtle look animation (CSS fallback, JS overrides) */
#vx-head {
  transform-origin: 140px 135px;
  animation: head-idle 6s ease-in-out infinite;
}
@keyframes head-idle {
  0%, 100% { transform: rotate(0deg); }
  25%       { transform: rotate(1.5deg); }
  75%       { transform: rotate(-1deg); }
}

/* Arm typing animation */
#vx-arm-l {
  transform-origin: 65px 199px;
  animation: arm-type-l 0.6s ease-in-out infinite alternate;
}
#vx-arm-r {
  transform-origin: 215px 199px;
  animation: arm-type-r 0.7s ease-in-out infinite alternate;
}
@keyframes arm-type-l {
  from { transform: rotate(-1deg) translateY(0); }
  to   { transform: rotate(1deg) translateY(-2px); }
}
@keyframes arm-type-r {
  from { transform: rotate(1deg) translateY(-2px); }
  to   { transform: rotate(-1deg) translateY(0); }
}

/* Hover interaction: velix notices visitor */
#velix-svg.noticed #vx-head {
  animation: head-notice 1s ease-out forwards;
}
@keyframes head-notice {
  0% { transform: rotate(0deg); }
  30% { transform: rotate(-3deg); }
  60% { transform: rotate(2deg); }
  100% { transform: rotate(0deg); }
}

/* Wave animation */
#velix-svg.waving #vx-arm-r {
  animation: arm-wave 1.2s ease-in-out;
}
@keyframes arm-wave {
  0%   { transform: rotate(0deg); transform-origin: 215px 199px; }
  25%  { transform: rotate(-25deg); transform-origin: 215px 199px; }
  50%  { transform: rotate(-10deg); transform-origin: 215px 199px; }
  75%  { transform: rotate(-20deg); transform-origin: 215px 199px; }
  100% { transform: rotate(0deg); transform-origin: 215px 199px; }
}