feat: version 2.17.10 -- Panel: medidor en "Avance promedio"

Ademas: sin punto suelto en 0% y letra reducida para valores largos.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

frontend/src/components/KpiCard.jsx

@@ -10,13 +10,16 @@ function Gauge({ ratio, color, value, caption }) {
       <div className="kpi-gauge-dial">
       <svg viewBox="0 0 100 56" aria-hidden="true">
         <path d={arc} fill="none" stroke="rgb(var(--line))" strokeWidth="9" strokeLinecap="round" />
-        <path
-          d={arc} fill="none" stroke={`rgb(var(--${color}))`} strokeWidth="9" strokeLinecap="round"
-          strokeDasharray={`${length * clamped} ${length}`}
-          style={{ transition: 'stroke-dasharray .6s ease' }}
-        />
+        {/* En 0 no se dibuja: con strokeLinecap="round" quedaria un punto suelto al inicio del arco. */}
+        {clamped > 0 && (
+          <path
+            d={arc} fill="none" stroke={`rgb(var(--${color}))`} strokeWidth="9" strokeLinecap="round"
+            strokeDasharray={`${length * clamped} ${length}`}
+            style={{ transition: 'stroke-dasharray .6s ease' }}
+          />
+        )}
       </svg>
-      <div className="kpi-gauge-value">{value}</div>
+      <div className={`kpi-gauge-value ${String(value).length > 5 ? 'long' : ''}`}>{value}</div>
       </div>
       {caption && <div className="kpi-gauge-caption">{caption}</div>}
     </div>