/**
 * Design tokens Mobbi (radios, sombras, grises, transiciones, tipografía).
 */
:root {
  --mobbi-radius-sm: 10px;
  --mobbi-radius-md: 12px;
  --mobbi-radius-card: 20px;
  --mobbi-radius-pill: 999px;
  --mobbi-shadow-card: 0 4px 6px rgba(0, 0, 0, 0.1);
  --mobbi-shadow-soft: 0 2px 8px rgba(0, 0, 0, 0.06);
  --mobbi-shadow-header: 0 1px 3px rgba(0, 0, 0, 0.06);
  --mobbi-shadow-dropdown: 0 12px 40px -8px rgba(0, 0, 0, 0.18);
  --mobbi-gray-50: #f9fafb;
  --mobbi-gray-100: #f3f4f6;
  --mobbi-gray-200: #e5e7eb;
  --mobbi-gray-300: #d1d5db;
  --mobbi-gray-400: #9ca3af;
  --mobbi-gray-500: #6b7280;
  --mobbi-gray-600: #4b5563;
  --mobbi-gray-700: #374151;
  --mobbi-gray-900: #111827;
  --mobbi-ease: cubic-bezier(0.4, 0, 0.2, 1);
  --mobbi-transition: 0.2s var(--mobbi-ease);
  /* Tipografía (escala compacta app) */
  --mobbi-text-xs: 0.65rem;
  --mobbi-text-sm: 0.8rem;
  --mobbi-text-base: 0.9rem;
  --mobbi-text-md: 1rem;
  --mobbi-text-lg: 1.1rem;
  --mobbi-text-xl: 1.35rem;
  --mobbi-font-weight-medium: 500;
  --mobbi-font-weight-semibold: 600;
  --mobbi-font-weight-bold: 700;
  /* Enlace / marca (alineado con Bootstrap primary) */
  --mobbi-brand: #0d6efd;
  --mobbi-brand-hover: #0a58ca;
  --mobbi-brand-muted: rgba(13, 110, 253, 0.12);
  --mobbi-focus-ring: 0 0 0 3px rgba(13, 110, 253, 0.25);
  --mobbi-success: #198754;
  --mobbi-danger: #dc3545;
  --mobbi-accent-warm: #ff6b35;
}