/* Hoja de estilos compartida por las páginas legales públicas de ErgoMetrika.
   Sin dependencias externas: el CSP de producción bloquea cualquier host de terceros. */
:root {
  --bosque: #051811;
  --bosque-2: #0a2419;
  --oro: #f5c542;
  --texto: #1a1a1a;
  --texto-suave: #4a5350;
  --borde: #dfe5e2;
  --fondo: #fbfcfb;
  --aviso-bg: #fff8e6;
  --aviso-borde: #e0a800;
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--fondo);
  color: var(--texto);
  font: 16px/1.65 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}
header {
  background: var(--bosque);
  color: #fff;
  padding: 28px 20px;
}
header .wrap { max-width: 820px; margin: 0 auto; }
header a.marca {
  color: var(--oro);
  font-weight: 700;
  font-size: 20px;
  text-decoration: none;
  letter-spacing: -0.01em;
}
header h1 {
  margin: 14px 0 6px;
  font-size: clamp(24px, 5vw, 34px);
  line-height: 1.2;
  font-weight: 700;
}
header .meta { color: #9fb3aa; font-size: 14px; margin: 0; }
main {
  max-width: 820px;
  margin: 0 auto;
  padding: 32px 20px 72px;
}
h2 {
  margin: 40px 0 12px;
  font-size: 20px;
  line-height: 1.3;
  color: var(--bosque);
  border-bottom: 2px solid var(--oro);
  padding-bottom: 6px;
}
h3 { margin: 24px 0 8px; font-size: 16.5px; color: var(--bosque-2); }
p, li { color: var(--texto-suave); }
li { margin-bottom: 6px; }
strong { color: var(--texto); }
a { color: #0f6b4f; }
a:hover { color: #0a4a37; }
code {
  background: #eef2f0;
  padding: 1px 5px;
  border-radius: 4px;
  font-size: 0.9em;
  word-break: break-word;
}
/* Admonición de documento legal: marca los avisos que el lector NO debe saltear.
   Se distingue por fondo + borde parejo (sin barra lateral de acento). */
.aviso {
  background: var(--aviso-bg);
  border: 1px solid var(--aviso-borde);
  padding: 14px 18px;
  margin: 20px 0;
  border-radius: 6px;
}
.aviso > p:first-child strong { color: #7a5c00; }
@media (prefers-color-scheme: dark) {
  .aviso > p:first-child strong { color: var(--oro); }
}
.aviso p:first-child { margin-top: 0; }
.aviso p:last-child { margin-bottom: 0; }
.caja {
  background: #fff;
  border: 1px solid var(--borde);
  border-radius: 10px;
  padding: 18px 20px;
  margin: 20px 0;
}
.tabla-wrap { overflow-x: auto; margin: 18px 0; }
table { border-collapse: collapse; width: 100%; min-width: 520px; font-size: 14.5px; }
th, td { text-align: left; padding: 9px 12px; border-bottom: 1px solid var(--borde); vertical-align: top; }
th { background: #eef2f0; color: var(--bosque); font-weight: 600; }
.toc { background: #fff; border: 1px solid var(--borde); border-radius: 10px; padding: 16px 20px; margin: 24px 0; }
.toc ol { margin: 8px 0 0; padding-left: 20px; }
.toc li { margin-bottom: 3px; }
.btn {
  display: inline-block;
  background: var(--bosque);
  color: var(--oro);
  padding: 13px 26px;
  border-radius: 8px;
  text-decoration: none;
  font-weight: 600;
  margin: 6px 8px 6px 0;
}
.btn:hover { background: var(--bosque-2); color: var(--oro); }
footer {
  border-top: 1px solid var(--borde);
  margin-top: 48px;
  padding: 24px 20px 40px;
  font-size: 14px;
  color: var(--texto-suave);
  text-align: center;
}
footer a { margin: 0 8px; }
@media (prefers-color-scheme: dark) {
  :root {
    --texto: #e8edeb;
    --texto-suave: #b3c0bb;
    --borde: #23342c;
    --fondo: #0b1512;
    --bosque: #04120d;
    --bosque-2: #0d2b1f;
    --aviso-bg: #2a2312;
  }
  body { background: var(--fondo); }
  h2, h3 { color: #e8edeb; }
  a { color: #6ee7b7; }
  a:hover { color: #a7f3d0; }
  .caja, .toc { background: #101d18; }
  th { background: #16261f; color: #e8edeb; }
  code { background: #16261f; }
}
