/* tokens/colors.css */
/* Terpel × Data Knowledge — color. Dos escalas: documentos (impresión) y pantalla.
   :root lleva la escala DOCUMENTAL. [data-scale="screen"] conmuta a la escala PANTALLA.
   Nunca mezclar ambas dentro de un mismo artefacto (§2.1). */
:root{
  /* primarios — escala documental */
  --navy:#012A5C;
  --red:#E30613;
  --yellow:#FFC72C;
  --orange:#F26A21;

  /* neutros */
  --ink:#2B2F36;
  --ink-2:#5B6470;
  --ink-3:#9AA1AB;
  --footer:#8A919B;

  /* bordes */
  --border:#E4E7EB;
  --border-soft:#EEF0F2;
  --border-table:#C8D2E3;
  --border-input:#DCE1E8;
  --border-hairline:#EEF1F5;
  --logo-divider:#DFE3E8;
  --logo-divider-on-color:rgba(255,255,255,.35);

  /* superficies */
  --surface:#FFFFFF;
  --surface-alt:#F1F3F5;
  --canvas:#E7E9EC;

  /* semánticos */
  --positive:#1E7A3D;
  --positive-bg:#F4FAF0;
  --positive-border:#BFD8B0;
  --warning:#8A5A00;
  --warning-bg:#FDF3E3;
  --warning-border:#F3DDB3;
  --risk:#C0392B;
  --risk-bg:#FFFAF9;
  --risk-border:#F5C6C0;
  --info:#012A5C;
  --info-bg:#F2F6FC;
  --info-border:#B8C9E6;
  --conclusion:#2B2F36;
  --conclusion-bg:#FFF7E1;
  --conclusion-border:#EAD9A0;
  --draft-bg:#F2A900;
  --selection:#FFE08A;

  /* alias semánticos de uso */
  --text-title:var(--navy);
  --text-body:var(--ink);
  --text-muted:var(--ink-2);
  --text-label:var(--ink-3);
  --text-pending:var(--red);
  --text-eyebrow:var(--red);
  --surface-card:var(--surface);
  --surface-page:var(--surface);
  --table-head-bg:var(--navy);
  --table-head-fg:#FFFFFF;
  --table-head-divider:rgba(255,255,255,.28);
  --divider-page-bg:var(--red);
  --closing-page-bg:var(--navy);
}

/* escala PANTALLA — presentaciones 1920×1080 y aplicaciones de assessment */
[data-scale="screen"]{
  --navy:#082A63;
  --red:#E31B23;
  --yellow:#F7B500;
  --ink:#202A38;
  --ink-2:#5F6368;
  --ink-3:#8A929E;
  --border:#E3E8EF;
  --border-soft:#F0F2F6;
  --surface-alt:#EDF0F5;
  --canvas:#F4F6F9;
  --positive:#2F7D1B;
  --conclusion-bg:#FFFDF5;
  --conclusion-border:#F7B500;
}

/* tokens/typography.css */
/* Familia única Arial en todos los contextos. Sin @font-face, sin webfonts, sin monoespaciada (§3.1). */
:root{
  --font-sans:Arial, Helvetica, sans-serif;
  --font-body:var(--font-sans);
  --font-display:var(--font-sans);
  --font-code:var(--font-sans); /* códigos de documento: peso 700 + letter-spacing, no cambio de familia */
  --ls-code:.04em;

  --fw-body:400; /* @kind font */
  --fw-footer:500; /* @kind font */
  --fw-label:600; /* @kind font */
  --fw-bold:700; /* @kind font */
  --fw-title:800; /* @kind font */

  /* documentos A4 (820×1160) */
  --doc-title-divider:36px;
  --doc-title-section:28px;
  --doc-title-control:25px;
  --doc-title-closing:32px;
  --doc-eyebrow:12px;
  --doc-lead:15px;
  --doc-closing-body:16px;
  --doc-block-subtitle:11px;
  --doc-card-body:13px;
  --doc-table:12px;
  --doc-field-label:10px;
  --doc-chip:10px;
  --doc-footer:10.5px;

  /* presentaciones (1920×1080) — mínimo absoluto 24px */
  --slide-title-cover:100px;
  --slide-title:58px;
  --slide-eyebrow:26px;
  --slide-lead:32px;
  --slide-card-title:34px;
  --slide-card-body:26px;
  --slide-figure:72px;
  --slide-table:25px;
  --slide-footer:17px;
  --slide-min:24px;

  /* aplicaciones de assessment */
  --app-eyebrow:10px;
  --app-title:21px;
  --app-lead:11.5px;
  --app-kpi:24px;
  --app-card-title:15px;
  --app-section-title:12px;
  --app-body:12px;
  --app-field-label:10px;
  --app-chip:10px;

  /* letter-spacing */
  --ls-eyebrow:.14em;
  --ls-eyebrow-divider:.22em;
  --ls-eyebrow-closing:.20em;
  --ls-block-subtitle:.12em;
  --ls-field-label:.08em;
  --ls-footer-class:.15em;
}

/* tokens/spacing.css */
/* Escala base 4px con pasos preferentes 2·4·6·9·12·14·18·24·32·42·52 (§4). */
:root{
  --sp-1:2px;
  --sp-2:4px;
  --sp-3:6px;
  --sp-4:9px;
  --sp-5:12px;
  --sp-6:14px;
  --sp-7:18px;
  --sp-8:24px;
  --sp-9:32px;
  --sp-10:42px;
  --sp-11:52px;

  --gap-chips:5px;
  --gap-rows:7px;
  --gap-cards:12px;
  --gap-blocks:20px;
  --gap-pages:46px;

  --pad-chip:3px 8px;
  --pad-button:8px 14px;
  --pad-cell:9px 14px;
  --pad-card:14px 18px;
  --pad-page-a4:42px 52px 70px;
  --pad-page-land:38px 56px 66px;
  --pad-canvas:52px 40px 80px;

  /* geometría de artefactos */
  --a4-w:820px;
  --a4-h:1160px;
  --land-w:1280px;
  --land-h:720px;
  --slide-w:1920px;
  --slide-h:1080px;
}

/* tokens/borders.css */
/* Radios, bordes y las dos únicas sombras del sistema (§5). */
:root{
  --r-1:2px;   /* cuadrito rojo 6×6 de subtítulo de bloque */
  --r-2:3px;   /* subrayado amarillo/rojo, riel fino */
  --r-3:4px;   /* casilla de verificación 15×15 */
  --r-4:5px;   /* tarjeta de página, barra tricolor, badge cuadrado */
  --r-5:7px;   /* botón pequeño, celda de nivel, input, select */
  --r-6:8px;   /* botón estándar, fila seleccionable */
  --r-tab:9px 9px 0 0; /* @kind radius */
  --r-7:10px;  /* tarjeta compacta, tarjeta KPI */
  --r-8:12px;  /* tarjeta estándar, contenedor de tabla, bloque navy */
  --r-pill:15px;

  --bw:1px;
  --accent-top:4px;   /* border-top de tarjeta de persona */
  --accent-left:3px;  /* border-left de ítem de agenda */
  --accent-stripe:6px;/* franja lateral de caja de conclusión */
  --footer-rule:3px;  /* barra roja al pie del footer documental */

  --shadow-page:0 16px 40px rgba(2,12,32,.16);
  --shadow-card:0 6px 18px rgba(2,12,32,.06);
  --shadow-none:none;

  --transition:120ms ease; /* @kind other */
}

/* tokens/base.css */
/* Reset mínimo. Arial es fuente de sistema: no hay @font-face en todo el sistema. */
*{box-sizing:border-box}
html,body{margin:0}
body{background:var(--canvas);color:var(--text-body);font-family:var(--font-sans);-webkit-font-smoothing:antialiased}
h1,h2,h3,h4,h5,h6{margin:0;text-wrap:balance}
p{margin:0;text-wrap:pretty}
a{color:var(--navy);text-decoration:none}
a:hover{color:var(--red)}
::selection{background:var(--selection)}
table{width:100%;border-collapse:collapse}
.tabular{font-variant-numeric:tabular-nums}
@media print{*{print-color-adjust:exact;-webkit-print-color-adjust:exact}}

/* styles.css */






