/* Shared motion (assets/js/motion.js): reveal on scroll and the chart tokens of both themes. */
:root {
  --chart-grid: rgba(255, 255, 255, 0.08);
  --chart-axis: rgba(255, 255, 255, 0.22);
}
:root[data-theme="light"] {
  --chart-grid: rgba(15, 23, 42, 0.08);
  --chart-axis: rgba(15, 23, 42, 0.28);
}

.reveal {
  opacity: 0;
  transform: translateY(18px);
  transition: opacity 0.7s ease, transform 0.7s cubic-bezier(0.2, 0.7, 0.2, 1);
  transition-delay: var(--reveal-delay, 0ms);
}
.reveal.revealed {
  opacity: 1;
  transform: none;
}

@media (prefers-reduced-motion: reduce) {
  .reveal { opacity: 1; transform: none; transition: none; }
}