/* ==========================================================================
   Stackapital — utilities.css · SOLO las utilidades justificadas.
   Ninguna utilidad de espaciado/display suelta: para eso están las
   primitivas de layout.css (.stack/.cluster/.grid-auto/.split).
   ========================================================================== */

@layer utilities {
  /* Oculto visualmente pero disponible para lectores de pantalla */
  .visually-hidden {
    position: absolute !important;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    white-space: nowrap;
  }

  /* Cifras, dinero e identificadores: mono tabular (docs/06 §Tipografía) */
  .num {
    font-family: var(--f-mono);
    font-variant-numeric: tabular-nums;
  }

  /* Texto secundario y terciario SIN inventar color nuevo */
  .text-muted { color: var(--fg-2); }
  .text-faint { color: var(--fg-3); }

  /* Cifra con signo: lo que entra (pos) y lo que sale (neg) — los mismos
     tonos verificados de §4 que .stat__value--pos/--neg, para importes de
     tabla y bandejas (banking). Sin signo que leer, sin color. */
  .text-pos { color: var(--ok-text); }
  .text-neg { color: var(--error-text); }

  /* Enlace al que se llega con teclado saltándose el shell */
  .skip-link {
    position: fixed;
    top: var(--space-3);
    left: var(--space-3);
    z-index: 100;
    padding: var(--space-2) var(--space-4);
    background: var(--albero);
    color: var(--on-accent);
    border-radius: var(--radius-pill);
    font-weight: 600;
    transform: translateY(-200%);
    transition: transform var(--dur) var(--ease-out);
  }
  .skip-link:focus { transform: none; text-decoration: none; }
}