/**
 * Tokens de espaciado, radios, layout y elevación — sistema de diseño TMM.
 * Carga después de 01b-tokens-typography.css.
 *
 * Escala 4 px. Nunca usar valores en px arbitrarios en componentes;
 * combinar tokens (gap: var(--tm-space-3); padding-block: var(--tm-space-7); …).
 */
:root {
  /* Escala 4 px (alineada a malla iOS / Material) */
  --tm-space-1:  4px;
  --tm-space-2:  8px;
  --tm-space-3:  12px;
  --tm-space-4:  16px;
  --tm-space-5:  24px;
  --tm-space-6:  32px;
  --tm-space-7:  48px;
  --tm-space-8:  64px;
  --tm-space-9:  96px;
  --tm-space-10: 128px;

  /* Radios canónicos */
  --tm-radius-xs:   6px;
  --tm-radius-sm:   10px;
  --tm-radius-md:   14px;
  --tm-radius-lg:   18px;
  --tm-radius-xl:   28px;
  --tm-radius-pill: 999px;

  /* Layout */
  --tm-container-max:     1200px;
  --tm-container-reading: 760px;
  --tm-section-py:        clamp(48px, 6vw, 96px);
  --tm-grid-gap:          clamp(16px, 1.6vw, 32px);

  /* Áreas táctiles y focus */
  --tm-touch-min: 44px;
  --tm-focus-ring-width: 2px;
  --tm-focus-ring-offset: 3px;

  /* Elevación (light por defecto; se reescribe abajo para dark) */
  --tm-elev-1: 0 1px 2px rgba(15, 23, 42, 0.04), 0 1px 1px rgba(15, 23, 42, 0.04);
  --tm-elev-2: 0 4px 12px rgba(15, 23, 42, 0.06), 0 2px 4px rgba(15, 23, 42, 0.04);
  --tm-elev-3: 0 12px 28px rgba(15, 23, 42, 0.08), 0 4px 10px rgba(15, 23, 42, 0.04);
  --tm-elev-4: 0 24px 56px rgba(15, 23, 42, 0.12), 0 8px 16px rgba(15, 23, 42, 0.06);

  /* Movimiento */
  --tm-ease-standard: cubic-bezier(0.4, 0, 0.2, 1);
  --tm-ease-emphasis: cubic-bezier(0.2, 0.8, 0.2, 1);
  --tm-dur-fast: 120ms;
  --tm-dur-base: 200ms;
  --tm-dur-slow: 320ms;
}

/*
 * Dark (default si no hay data-theme="light") usa sombras con scrim negro.
 * Light ya queda con los valores de :root.
 */
:root:not([data-theme="light"]) {
  --tm-elev-1: 0 1px 2px rgba(0, 0, 0, 0.40);
  --tm-elev-2: 0 4px 12px rgba(0, 0, 0, 0.45);
  --tm-elev-3: 0 12px 28px rgba(0, 0, 0, 0.55);
  --tm-elev-4: 0 24px 56px rgba(0, 0, 0, 0.65);
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --tm-dur-fast: 0ms;
    --tm-dur-base: 0ms;
    --tm-dur-slow: 0ms;
  }
}