@khipu/design-system 0.2.0-alpha.42 → 0.2.0-alpha.44

package/dist/beercss/khipu-beercss.css

@@ -11,7 +11,7 @@
  *
  * AUTO-GENERATED FILE - DO NOT EDIT MANUALLY
  * Source: design-system/src/tokens/tokens.json
- * Generated: 2026-06-11T19:33:07.389Z
+ * Generated: 2026-06-11T20:11:47.479Z
  *
  * To regenerate:
  *   cd design-system && npm run tokens:generate
@@ -2141,7 +2141,7 @@ a.kds-btn-google:disabled {
 .kds-secure-loader-text {
     display: flex;
     flex-direction: column;
-    gap: var(--kds-spacing-1);
+    gap: var(--kds-spacing-0-25);
 }
 
 .kds-secure-loader-title {
@@ -2162,20 +2162,20 @@ a.kds-btn-google:disabled {
 }
 
 /* Caja del spinner con tamaño fijo: la animación no altera el layout.
-   8.5rem (136px) iguala el tamaño visual del loader original. */
+   6.25rem (100px) = tamaño del loader original (CircularProgress size=100). */
 .kds-secure-loader-spinner {
     position: relative;
     display: inline-grid;
     place-items: center;
-    inline-size: var(--kds-secure-loader-size, 8.5rem);
-    block-size: var(--kds-secure-loader-size, 8.5rem);
+    inline-size: var(--kds-secure-loader-size, 6.25rem);
+    block-size: var(--kds-secure-loader-size, 6.25rem);
 }
 
 /* Anillo: SVG nativo con arco vía stroke-dasharray, rotando. Replica el
-   CircularProgress original (viewBox 44u, thickness 2 → ~6px, arco ~63%, disableShrink). */
+   CircularProgress original (viewBox 44u, thickness 2, arco ~63%, disableShrink). */
 .kds-secure-loader-ring {
-    inline-size: var(--kds-secure-loader-size, 8.5rem);
-    block-size: var(--kds-secure-loader-size, 8.5rem);
+    inline-size: var(--kds-secure-loader-size, 6.25rem);
+    block-size: var(--kds-secure-loader-size, 6.25rem);
     animation: kds-secure-loader-spin 1.2s linear infinite;
 }
 
@@ -2194,11 +2194,16 @@ a.kds-btn-google:disabled {
     }
 }
 
-/* Candado centrado sobre el anillo (~0.3 del diámetro ≈ 40px, como el original) */
+/* Candado centrado sobre el anillo (~0.3 del diámetro). Centrado explícito
+   (top/left 50% + translate) para que no dependa del grid ni se recorte. */
 .kds-secure-loader-lock {
     position: absolute;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%);
     color: var(--kds-color-text-secondary);
-    font-size: calc(var(--kds-secure-loader-size, 8.5rem) * 0.3);
+    font-size: calc(var(--kds-secure-loader-size, 6.25rem) * 0.3);
+    line-height: 1;
     pointer-events: none;
 }