/* File: public/css/components/ecg-trace.css
   The animated monitor ECG trace (homepage « Moniteur » direction, 2026-08-12).
   Inline SVG polyline (no image); the dash length equals the hero polyline's
   measured length (831.1 for the 620×74 viewBox trace), swept linearly.

   ⚠ LAW: ONE animated ECG trace per page — this is the page's single
   heartbeat, distinct from the ecgIndicator.js SELECTION language (data-ecg),
   which keeps its own home. Under prefers-reduced-motion the trace is static. */

.ecg-trace {
  display: block;
  width: 100%;
  height: auto;
}

.ecg-trace polyline {
  fill: none;
  stroke: var(--screen-accent);
  stroke-width: 2.25;
  stroke-linecap: round;
  stroke-linejoin: round;
  filter: drop-shadow(0 0 5px rgba(var(--screen-accent-rgb), 0.7));
}

.ecg-trace--animated polyline {
  stroke-dasharray: 831.1;
  animation: ecg-sweep 6.5s linear infinite;
}

@keyframes ecg-sweep {
  from { stroke-dashoffset: 1662.2; }
  to   { stroke-dashoffset: 0; }
}

@media (prefers-reduced-motion: reduce) {
  .ecg-trace--animated polyline {
    animation: none;
    stroke-dasharray: none;
  }
}