/* ==========================================================================
   Piel · Agencia (diseño, mercadotecnia e IA) — v1 · 26-sep-2026
   --------------------------------------------------------------------------
   Decidido por Paul: «me agrada el lima de Higgsfield, sigamos». Tema CLARO
   para trabajar (fondo blanco, píldoras negras, el lima como luz) y NOCHE para
   las escenas de presentación (negro con resplandor lima). El magenta es el
   CONTRASTE: gasto, alerta, lo que baja. Referencias y patrones en
   Agencia IA/marca/PATRONES-HIGGSFIELD.md. El NOMBRE de la agencia aún no
   está decidido (grill pendiente): esta piel no lleva nombre ni logo final.

   Reglas de color (no negociables):
   - El lima es LUZ y RELLENO: subrayador detrás de tinta negra, píldoras con
     texto negro, botón de noche, resplandor. Nunca texto lima sobre blanco ni
     un indicador lima solo sobre blanco (no llega a 3:1): en claro, un dato en
     lima va con borde o tinta negra encima.
   - El magenta es CONTRASTE: negativo, gasto, peligro, etiquetas de golpe.
   - Negro #0B0C0E es la acción en claro (botón píldora negra, como Higgsfield).

   Letras: Space Grotesk (títulos y cifras, la del video), Inter (texto),
   JetBrains Mono (etiquetas técnicas, coordenadas, código).
   Uso: <html data-piel="agencia" data-tema="panel-claro | sitio-noche">
   ========================================================================== */

[data-piel="agencia"] {
  /* Semillas ------------------------------------------------------------- */
  --piel-profunda: #0b0c0e;      /* negro tinta */
  --piel-marca: #0b0c0e;         /* acción en claro: píldora negra */
  --piel-sobre-marca: #ffffff;
  --piel-luz: #d1fe17;           /* EL lima: la luz de la marca */
  --piel-sobre-luz: #0b0c0e;

  /* Efectos (base/efectos.css) */
  --piel-efecto-luz: #d1fe17;
  --piel-efecto-contraste: #ff1f7a;
  --piel-fuente-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;

  --piel-fuente-texto: "Inter", ui-sans-serif, system-ui, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --piel-fuente-display: "Space Grotesk", "Inter", ui-sans-serif, system-ui, sans-serif;
  --piel-display-peso: 700;
  --piel-display-estilo: normal;
  --piel-display-tracking: -0.035em;
  --piel-radio: 12px;

  /* Panel claro: fondo blanco, para trabajar ------------------------------ */
  --piel-claro-fondo: #ffffff;
  --piel-claro-superficie: #ffffff;
  --piel-claro-superficie-2: #f3f4f1;     /* píldora gris suave */
  --piel-claro-tinta: #0b0c0e;
  --piel-claro-tinta-suave: #555a63;      /* 7.0:1 sobre blanco */
  --piel-claro-linea: #e7e8e4;
  --piel-claro-linea-fuerte: #8b9098;     /* 3.3:1: borde de controles */
  --piel-claro-marca: #0b0c0e;
  --piel-claro-marca-hover: #2a2d33;
  --piel-claro-sobre-marca: #ffffff;
  --piel-claro-marca-tinta: #0b0c0e;      /* enlaces en tinta; el subrayado va en lima */
  --piel-claro-acento: #0b0c0e;           /* indicadores en claro van en tinta (lima sobre blanco = 1.1:1); el lima vive en --efecto-luz */
  --piel-claro-foco: #0b0c0e;             /* el foco sobre blanco va en negro (3:1) */
  --piel-claro-velo: rgba(11, 12, 14, 0.55);
  --piel-claro-exito: #4f6100;            /* lima profundo: 7:1 */
  --piel-claro-exito-fondo: #f1ffc2;
  --piel-claro-aviso: #8a5a00;
  --piel-claro-aviso-fondo: #fff3d6;
  --piel-claro-peligro: #c4005a;          /* magenta profundo: 5.6:1 */
  --piel-claro-peligro-fondo: #ffe3ef;

  /* Sitio noche: escenas de presentación ---------------------------------- */
  --piel-noche-fondo: #030304;
  --piel-noche-superficie: #0f1113;
  --piel-noche-superficie-2: #1c1e20;
  --piel-noche-tinta: #f5f5f5;
  --piel-noche-tinta-suave: #a3a7ae;
  --piel-noche-linea: rgba(255, 255, 255, 0.1);
  --piel-noche-linea-fuerte: #6b7078;
  --piel-noche-marca: #d1fe17;            /* botón lima con texto negro */
  --piel-noche-marca-hover: #e4ff6b;
  --piel-noche-sobre-marca: #0b0c0e;
  --piel-noche-marca-tinta: #d1fe17;      /* lima sobre negro: 16:1 */
  --piel-noche-acento: #d1fe17;
  --piel-noche-foco: #d1fe17;
  --piel-noche-velo: rgba(0, 0, 0, 0.7);
  --piel-noche-exito: #b8f000;
  --piel-noche-exito-fondo: #1b2400;
  --piel-noche-aviso: #ffc24a;
  --piel-noche-aviso-fondo: #2b1f00;
  --piel-noche-peligro: #ff4d94;
  --piel-noche-peligro-fondo: #2e0a1a;
}
