/* VELAEA Chart Entrance Animation Pro
   Subtle one-time chart reveal for line / donut / bar / drawdown charts.
   Keeps existing chart colors and supports dark + light themes. */

.velaea-chart-entrance{
  --vc-chart-delay:0ms;
  --vc-ease:cubic-bezier(.18,.82,.24,1);
  opacity:0;
  transform:translateY(12px) scale(.992);
  will-change:opacity,transform,filter;
}

.velaea-chart-entrance.is-chart-visible{
  animation:velaeaChartPanelIn .62s var(--vc-ease) both;
}

.velaea-chart-entrance.velaea-chart-no-anim{
  opacity:1!important;
  transform:none!important;
  animation:none!important;
  will-change:auto!important;
}

.velaea-chart-path{
  stroke-dasharray:var(--vc-path-length, 1000);
  stroke-dashoffset:var(--vc-path-length, 1000);
  opacity:.42;
  will-change:stroke-dashoffset,opacity,filter;
}

.velaea-chart-entrance.is-chart-visible .velaea-chart-path{
  animation:velaeaChartDrawLine .98s cubic-bezier(.22,.9,.28,1) both;
  animation-delay:calc(90ms + var(--vc-chart-delay, 0ms));
}

.velaea-chart-entrance.velaea-chart-no-anim .velaea-chart-path{
  stroke-dasharray:none!important;
  stroke-dashoffset:0!important;
  opacity:1!important;
  animation:none!important;
}

.velaea-chart-area{
  opacity:0;
  transform:scaleY(.92);
  transform-origin:center bottom;
  transform-box:fill-box;
  will-change:opacity,transform;
}

.velaea-chart-entrance.is-chart-visible .velaea-chart-area{
  animation:velaeaChartAreaRise .78s cubic-bezier(.2,.84,.26,1) both;
  animation-delay:calc(210ms + var(--vc-chart-delay, 0ms));
}

.velaea-chart-point{
  opacity:0;
  transform:scale(.25);
  transform-origin:center;
  transform-box:fill-box;
  will-change:opacity,transform,filter;
}

.velaea-chart-entrance.is-chart-visible .velaea-chart-point{
  animation:velaeaChartPointPop .58s cubic-bezier(.2,1.45,.34,1) both;
  animation-delay:calc(720ms + var(--vc-index, 0) * 24ms + var(--vc-chart-delay, 0ms));
}

.velaea-chart-bar{
  opacity:.28;
  transform:scaleY(.08);
  transform-origin:center bottom;
  transform-box:fill-box;
  will-change:opacity,transform,filter;
}

.velaea-chart-bar.velaea-chart-bar-negative{
  transform-origin:center top;
}

.velaea-chart-entrance.is-chart-visible .velaea-chart-bar{
  animation:velaeaChartBarGrow .68s cubic-bezier(.18,1.12,.28,1) both;
  animation-delay:calc(120ms + var(--vc-index, 0) * 35ms + var(--vc-chart-delay, 0ms));
}

.velaea-chart-donut{
  opacity:0;
  transform:scale(.92) rotate(-8deg);
  will-change:opacity,transform,filter;
}

.velaea-chart-entrance.is-chart-visible .velaea-chart-donut,
.velaea-chart-donut.is-chart-visible{
  animation:velaeaChartDonutIn .88s cubic-bezier(.18,1.02,.25,1) both;
  animation-delay:calc(80ms + var(--vc-chart-delay, 0ms));
}

.velaea-chart-entrance.is-chart-visible .velaea-chart-donut::before,
.velaea-chart-donut.is-chart-visible::before{
  animation:velaeaChartGlowPulse 1.05s ease-out both;
  animation-delay:160ms;
}

.velaea-chart-entrance.is-chart-visible .velaea-chart-donut strong,
.velaea-chart-donut.is-chart-visible strong{
  animation:velaeaChartNumberPop .72s cubic-bezier(.2,1.22,.3,1) both;
  animation-delay:400ms;
}

.velaea-chart-entrance.velaea-chart-no-anim .velaea-chart-area,
.velaea-chart-entrance.velaea-chart-no-anim .velaea-chart-point,
.velaea-chart-entrance.velaea-chart-no-anim .velaea-chart-bar,
.velaea-chart-entrance.velaea-chart-no-anim .velaea-chart-donut,
.velaea-chart-donut.velaea-chart-no-anim{
  opacity:1!important;
  transform:none!important;
  animation:none!important;
}

.velaea-chart-entrance.velaea-chart-no-anim .velaea-chart-donut strong,
.velaea-chart-donut.velaea-chart-no-anim strong{
  animation:none!important;
}

@keyframes velaeaChartPanelIn{
  0%{opacity:0;transform:translateY(12px) scale(.992);filter:saturate(.9)}
  100%{opacity:1;transform:translateY(0) scale(1);filter:saturate(1)}
}

@keyframes velaeaChartDrawLine{
  0%{stroke-dashoffset:var(--vc-path-length, 1000);opacity:.38;filter:brightness(.92)}
  72%{opacity:1;filter:brightness(1.16)}
  100%{stroke-dashoffset:0;opacity:1;filter:brightness(1)}
}

@keyframes velaeaChartAreaRise{
  0%{opacity:0;transform:scaleY(.92)}
  100%{opacity:1;transform:scaleY(1)}
}

@keyframes velaeaChartPointPop{
  0%{opacity:0;transform:scale(.25)}
  70%{opacity:1;transform:scale(1.18)}
  100%{opacity:1;transform:scale(1)}
}

@keyframes velaeaChartBarGrow{
  0%{opacity:.22;transform:scaleY(.08);filter:brightness(.88)}
  72%{opacity:1;transform:scaleY(1.05);filter:brightness(1.08)}
  100%{opacity:1;transform:scaleY(1);filter:brightness(1)}
}

@keyframes velaeaChartDonutIn{
  0%{opacity:0;transform:scale(.92) rotate(-8deg);filter:saturate(.9) brightness(.92)}
  76%{opacity:1;transform:scale(1.025) rotate(1.2deg);filter:saturate(1.06) brightness(1.05)}
  100%{opacity:1;transform:scale(1) rotate(0deg);filter:saturate(1) brightness(1)}
}

@keyframes velaeaChartGlowPulse{
  0%{opacity:.16;filter:blur(2px)}
  55%{opacity:.72;filter:blur(8px)}
  100%{opacity:.34;filter:blur(0)}
}

@keyframes velaeaChartNumberPop{
  0%{opacity:0;transform:translateY(4px) scale(.86)}
  74%{opacity:1;transform:translateY(0) scale(1.06)}
  100%{opacity:1;transform:translateY(0) scale(1)}
}

/* Preserve accessibility and avoid heavy motion for users/devices that request it. */
@media (prefers-reduced-motion: reduce){
  .velaea-chart-entrance,
  .velaea-chart-entrance.is-chart-visible,
  .velaea-chart-path,
  .velaea-chart-area,
  .velaea-chart-point,
  .velaea-chart-bar,
  .velaea-chart-donut,
  .velaea-chart-donut strong{
    opacity:1!important;
    transform:none!important;
    animation:none!important;
    transition:none!important;
    stroke-dasharray:none!important;
    stroke-dashoffset:0!important;
    will-change:auto!important;
  }
}