/* ─────────────────────────────────────────
   canvas.css — SVG preview area styles
───────────────────────────────────────── */

/* Canvas frame transition on resize */
.canvas-frame {
  transition: width var(--t-slow), height var(--t-slow);
}

/* Fade-in on first render */
.canvas-frame.ready {
  animation: canvasFadeIn 0.4s ease both;
}

@keyframes canvasFadeIn {
  from {
    opacity: 0;
    transform: scale(0.97);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}

/* Regenerating pulse */
.canvas-frame.regenerating {
  animation: pulse 0.25s ease;
}

@keyframes pulse {
  0%   { opacity: 1; }
  50%  { opacity: 0.6; }
  100% { opacity: 1; }
}