/* URSO · tokens de marca · v1.0 · 2026-11-10
   Un solo archivo para todas las pieles y los dos modos.
   Las pantallas usan SOLO los tokens semánticos (--fondo, --texto, --acento…);
   los de marca (--noche, --papel…) existen para definirlos, no para usarlos sueltos. */

:root {
  /* ---- Marca URSO (5.1) ---- */
  --noche: #171614;
  --papel: #f4f1ea;
  --gris-100: #e9e5dd;
  --gris-200: #d4cfc6;
  --gris-400: #a6a29a;
  --gris-700: #5f5b54;
  --tierra-500: #bd5a2c;   /* el punto y los gráficos, en los dos modos */
  --tierra-600: #9b4a2c;   /* texto y enlaces en modo claro */
  --tierra-400: #c97550;   /* texto y enlaces en modo oscuro */
  --noche-2: #232220;
  --noche-3: #2f2d29;

  /* ---- Color de datos, modo claro (5.3) · siempre con forma o palabra ---- */
  --necesario: #2f5f9e;    /* ● información, en proceso */
  --atencion:  #9a5c0b;    /* ▲ actuar pronto */
  --alerta:    #a01a1f;    /* ✕ actuar ya */
  --bien:      #1b6e45;    /* ✓ nada que hacer */
  --previsto:  var(--gris-700);  /* ○ todavía no cuenta */

  /* ---- Semánticos · piel URSO, modo claro ---- */
  --fondo:      var(--papel);
  --superficie: var(--gris-100);
  --linea:      var(--gris-200);
  --texto:      var(--noche);
  --texto-2:    var(--gris-700);
  --acento:     var(--tierra-500);
  --enlace:     var(--tierra-600);
  --marca:      var(--noche);      /* color del logotipo o la palabra en el encabezado */
  --foco:       var(--tierra-500); /* anillo de foco, 2 px, separado 2 px */
  --sobre-acento: var(--papel);    /* texto sobre --acento */

  /* ---- Tipografía (6) ---- */
  --f-marca: 'Cardo', Georgia, 'Times New Roman', serif;             /* marca, títulos, lectura ≥ 18 px, papel */
  --f-ui: 'Archivo', system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif; /* interfaz, cifras, correo */
  --t-12: 12px; --t-13: 13px; --t-14: 14px; --t-15: 15px;
  --t-18: 18px; --t-22: 22px; --t-30: 30px; --t-40: 40px;
  --lh-ui: 1.4; --lh-lectura: 1.5; --lh-titulo: 1.1;
  --rotulo: 600 var(--t-12)/1.2 var(--f-ui); /* mayúsculas espaciadas: letter-spacing .14em; text-transform uppercase */

  /* ---- Espacio, forma y tiempo (7.1, 7.3) ---- */
  --e-1: 4px; --e-2: 8px; --e-3: 12px; --e-4: 16px;
  --e-6: 24px; --e-8: 32px; --e-12: 48px; --e-16: 64px;
  --radio: 4px;      /* botones, campos, chips, tarjetas */
  --radio-2: 8px;    /* mensajes y paneles grandes */
  --radio-0: 0;      /* tablas, papel */
  --borde: 1px;
  --fila: 32px;      /* tabla densa, escritorio */
  --fila-c: 44px;    /* tabla cómoda, celular */
  --boton: 44px; --boton-e: 36px; --chip: 24px;
  --ancho-max: 1280px; --nav-lateral: 240px; --margen-celular: 20px;
  --dur-1: 150ms; --dur-2: 200ms; --dur-3: 250ms;
  --curva: cubic-bezier(.2, .7, .2, 1);
  --sombra: none;    /* no hay sombras: el borde separa */
}

/* ---- Modo oscuro · piel URSO (5.2) ---- */
[data-tema="oscuro"] {
  --fondo:      var(--noche);
  --superficie: var(--noche-2);
  --linea:      var(--noche-3);
  --texto:      var(--papel);
  --texto-2:    var(--gris-400);
  --enlace:     var(--tierra-400);
  --marca:      var(--papel);
  --sobre-acento: var(--noche);
  --necesario: #7fa6dd; --atencion: #e0a63a; --alerta: #f07a70; --bien: #5fbf8a;
  --previsto: var(--gris-400);
}
@media (prefers-color-scheme: dark) {
  :root:not([data-tema="claro"]) {
    --fondo: var(--noche); --superficie: var(--noche-2); --linea: var(--noche-3);
    --texto: var(--papel); --texto-2: var(--gris-400); --enlace: var(--tierra-400);
    --marca: var(--papel); --sobre-acento: var(--noche);
    --necesario: #7fa6dd; --atencion: #e0a63a; --alerta: #f07a70; --bien: #5fbf8a;
    --previsto: var(--gris-400);
  }
}

/* ---- Piel Aura Control (2.6, 4.4) · también la de Segel Gadol: mismo azul, misma letra; el oro es solo de Aura ---- */
[data-piel="aura"], [data-piel="segel"] {
  --fondo: #efedf2; --superficie: #ffffff; --linea: #dcd9e2;
  --texto: #383838; --texto-2: #5d6680;
  --acento: #00153f; --marca: #00153f; --enlace: #1b2d5a; --foco: #00153f;
  --sobre-acento: #ffffff;
}
[data-piel="aura"] {
  --oro: #d4af37;        /* solo sobre azul: el punto del signo y el acento en modo oscuro */
  --oro-claro: #a8841c;  /* el oro sobre fondo claro: filete y punto; nunca texto */
}
[data-piel="aura"][data-tema="oscuro"], [data-piel="segel"][data-tema="oscuro"] {
  --fondo: #0b1326; --superficie: #142040; --linea: #24335c;
  --texto: #f4f3f7; --texto-2: #a9b1c4;
  --acento: #d4af37; --marca: #dcd9e2; --enlace: #d4af37; --foco: #d4af37;
  --sobre-acento: #0b1326;
}
[data-piel="segel"][data-tema="oscuro"] { /* Segel no lleva oro: el acento oscuro es la lavanda */
  --acento: #dcd9e2; --enlace: #dcd9e2; --foco: #dcd9e2;
}

/* ---- Piel neutra (2.3) · la base que recibe un tercero hasta cargar su marca ---- */
[data-piel="neutra"] {
  --fondo: #f7f7f5; --superficie: #ffffff; --linea: #e1e1de;
  --texto: #1f1f1f; --texto-2: #6a6a66;
  --acento: #1f1f1f; --marca: #1f1f1f; --enlace: #1f1f1f; --foco: #1f1f1f;
  --sobre-acento: #ffffff;
}
[data-piel="neutra"][data-tema="oscuro"] {
  --fondo: #141414; --superficie: #1f1f1f; --linea: #2c2c2c;
  --texto: #f2f2f0; --texto-2: #a3a3a0;
  --acento: #f2f2f0; --marca: #f2f2f0; --enlace: #f2f2f0; --foco: #f2f2f0;
  --sobre-acento: #141414;
}

/* ---- Una piel nueva (2.6): copiar este bloque, cambiar los valores, nada más ---- */
/* [data-piel="nombre"] { --fondo: ; --superficie: ; --linea: ; --texto: ; --texto-2: ; --acento: ; --marca: ; --enlace: ; --foco: ; --sobre-acento: ; } */

/* ---- Movimiento reducido (7.3) ---- */
@media (prefers-reduced-motion: reduce) {
  :root { --dur-1: 0ms; --dur-2: 0ms; --dur-3: 0ms; }
}