/* Jygg · tokens de marca — generados, no editar a mano.
 * Fuente: manual de marca, etapa 5. Geometría del símbolo: k = 0,955.
 * Modo oscuro en tres estados: bare :root = claro; prefers-color-scheme
 * guardado con :not([data-theme="light"]); y [data-theme="dark"] explícito.
 */

:root{
  /* escala · arcilla */
  --jygg-clay-50: #FBF1EC;
  --jygg-clay-100: #F7E2D9;
  --jygg-clay-200: #F3C9B8;
  --jygg-clay-300: #F0A78E;
  --jygg-clay-400: #D2745A;
  --jygg-clay-500: #BC573D;
  --jygg-clay-600: #A53F2B;
  --jygg-clay-700: #8E3524;
  --jygg-clay-800: #7A2C1E;
  --jygg-clay-900: #4E1C13;

  /* escala · greda */
  --jygg-greda-01: #FDFAF8;
  --jygg-greda-02: #FAF5F1;
  --jygg-greda-03: #F3EBE5;
  --jygg-greda-04: #EDE4DF;
  --jygg-greda-05: #E3D6CE;
  --jygg-greda-06: #CDBBB1;
  --jygg-greda-07: #B8A79F;
  --jygg-greda-08: #8A7A74;
  --jygg-greda-09: #766660;
  --jygg-greda-10: #514440;
  --jygg-greda-11: #2E2422;
  --jygg-greda-12: #1D1613;
  --jygg-greda-13: #100C0B;

  /* espacio · base 4 */
  --jygg-esp-1: 4px;
  --jygg-esp-2: 8px;
  --jygg-esp-3: 12px;
  --jygg-esp-4: 16px;
  --jygg-esp-5: 24px;
  --jygg-esp-6: 32px;
  --jygg-esp-7: 48px;
  --jygg-esp-8: 64px;
  --jygg-esp-9: 96px;

  /* forma */
  --jygg-radio: 0;
  --jygg-radio-pildora: 999px;
  --jygg-borde: 1px;

  /* tipografía */
  --jygg-fuente-display: "Space Grotesk", system-ui, sans-serif;
  --jygg-fuente-cuerpo: "IBM Plex Sans", system-ui, sans-serif;
  --jygg-fuente-dato: "IBM Plex Mono", ui-monospace, monospace;

  /* roles · modo claro */
  --jygg-suelo: var(--jygg-greda-03);
  --jygg-panel: var(--jygg-greda-02);
  --jygg-panel-alto: var(--jygg-greda-01);
  --jygg-tinta: var(--jygg-greda-12);
  --jygg-tinta-2: var(--jygg-greda-10);
  --jygg-tinta-3: var(--jygg-greda-09);
  --jygg-regla: var(--jygg-greda-05);
  --jygg-regla-fuerte: var(--jygg-greda-06);
  --jygg-acento: var(--jygg-clay-600);
  --jygg-enfasis: var(--jygg-clay-800);
  --jygg-lavado: var(--jygg-clay-50);
  --jygg-vigente: #1F6F52;
  --jygg-alerta: #F2B705;
  --jygg-alerta-tinta: #7E5500;
  --jygg-alerta-lavado: #FDF3D7;
  --jygg-alerta-borde: #E0C77A;
  --jygg-error: #C0261B;
  --jygg-error-tinta: #8E1D14;
  --jygg-error-lavado: #FBE9E7;
  --jygg-error-borde: #EFBDB6;
  --jygg-sobre-acento: var(--jygg-greda-01);
  --jygg-sobre-error: var(--jygg-greda-01);
  --jygg-sobre-alerta: var(--jygg-greda-12);
}

@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --jygg-suelo: var(--jygg-greda-13);
    --jygg-panel: var(--jygg-greda-12);
    --jygg-panel-alto: var(--jygg-greda-11);
    --jygg-tinta: var(--jygg-greda-04);
    --jygg-tinta-2: var(--jygg-greda-07);
    --jygg-tinta-3: var(--jygg-greda-08);
    --jygg-regla: var(--jygg-greda-11);
    --jygg-regla-fuerte: var(--jygg-greda-10);
    --jygg-acento: var(--jygg-clay-400);
    --jygg-enfasis: var(--jygg-clay-300);
    --jygg-lavado: #241715;
    --jygg-vigente: #5FB894;
    --jygg-alerta: #F5C518;
    --jygg-alerta-tinta: #F5C518;
    --jygg-alerta-lavado: #2A2109;
    --jygg-alerta-borde: #5A4A12;
    --jygg-error: #FF6B5E;
    --jygg-error-tinta: #FF9A8F;
    --jygg-error-lavado: #2A100D;
    --jygg-error-borde: #5E2119;
    --jygg-sobre-acento: var(--jygg-greda-13);
    --jygg-sobre-error: var(--jygg-greda-13);
    --jygg-sobre-alerta: var(--jygg-greda-13);
  }
}

:root[data-theme="dark"]{
  --jygg-suelo: var(--jygg-greda-13);
  --jygg-panel: var(--jygg-greda-12);
  --jygg-panel-alto: var(--jygg-greda-11);
  --jygg-tinta: var(--jygg-greda-04);
  --jygg-tinta-2: var(--jygg-greda-07);
  --jygg-tinta-3: var(--jygg-greda-08);
  --jygg-regla: var(--jygg-greda-11);
  --jygg-regla-fuerte: var(--jygg-greda-10);
  --jygg-acento: var(--jygg-clay-400);
  --jygg-enfasis: var(--jygg-clay-300);
  --jygg-lavado: #241715;
  --jygg-vigente: #5FB894;
  --jygg-alerta: #F5C518;
  --jygg-alerta-tinta: #F5C518;
  --jygg-alerta-lavado: #2A2109;
  --jygg-alerta-borde: #5A4A12;
  --jygg-error: #FF6B5E;
  --jygg-error-tinta: #FF9A8F;
  --jygg-error-lavado: #2A100D;
  --jygg-error-borde: #5E2119;
  --jygg-sobre-acento: var(--jygg-greda-13);
  --jygg-sobre-error: var(--jygg-greda-13);
  --jygg-sobre-alerta: var(--jygg-greda-13);
}
