
:root{
  --bg:#f7f9fb; --fg:#16202a; --muted:#4a5b6b; --line:#d6dee6;
  --brand:#0d3b66; --accent:#0b6e99; --card:#fff;
  /* --line es decorativo (separadores, contenedores). Los LÍMITES de un control
     (input de búsqueda) exigen ≥3:1 vs su fondo — WCAG 1.4.11 no-text contrast.
     --line da 1.29:1: invisible para baja visión. --borde-control da 4.07:1. */
  --borde-control:#6b7c8c;
  /* --brand cambia de tono entre temas (sirve de TEXTO: h1, .ficha caption).
     --brand-surface es un rol distinto — FONDO fijo detrás de texto blanco
     (.topbar, .card .count) O TEXTO fijo sobre blanco fijo (.skip:focus) —
     y por eso NO se redefine en oscuro: el mismo azul marca que funciona
     sobre/bajo blanco en tema claro sigue funcionando igual en oscuro, porque
     no depende de --bg. Mismo valor que --brand hoy, pero son dos tokens
     porque un solo valor no puede cumplir los dos roles a la vez una vez que
     el tema oscuro aclara --brand — el skip-link heredaba el color de marca de
     texto (regla `a`) y en oscuro daba 2.79:1 contra su fondo blanco fijo
     (Hallazgo A, propuesta lider-ux 2026-07-19), por debajo del umbral 4.5:1. */
  --brand-surface:#0d3b66;
  /* --danger: texto/borde de advertencia (wikilink roto). Token propio (no
     hex suelto) para que el tema oscuro pueda aclararlo igual que --brand. */
  --danger:#b71c1c;
  /* --foco: anillo de foco de teclado (WCAG 1.4.11, es información de estado,
     no decoración). El hex fijo #ffb703 que este token reemplaza daba 1.65:1
     contra --bg claro y 1.75:1 contra --card (umbral 3:1) — casi invisible
     para baja visión justo en el tema por defecto, aunque en oscuro pasaba
     (10.35:1). Ámbar más oscuro: mismo family de color, ratio ≥3:1 en claro;
     el tema oscuro redefine --foco al hex original (ya cumplía). */
  --foco:#b45f06;
}
*{box-sizing:border-box}
html{font-size:17px;scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--fg);
  font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;line-height:1.6}
a{color:var(--brand);text-decoration:underline}
a:focus,input:focus,summary:focus{outline:3px solid var(--foco);outline-offset:2px}
.skip{position:absolute;left:-999px}
.skip:focus{left:8px;top:8px;background:#fff;color:var(--brand-surface);
  padding:.5rem;z-index:10}
.topbar{display:flex;flex-wrap:wrap;gap:1rem;align-items:center;
  background:var(--brand-surface);color:#fff;padding:.7rem 1rem}
.topbar a{color:#fff;text-decoration:none}
.brand{font-weight:700;font-size:1.05rem}
.topbar nav{display:flex;flex-wrap:wrap;gap:.9rem;font-size:.95rem}
.topbar nav a:hover{text-decoration:underline}
.topbar nav a[aria-current='page']{text-decoration:underline;font-weight:700}
/* HU-CONSEJO-01: banner de apoyo, fuera de <main> (aparece en TODA página,
   incluida la ficha de un caso) — mismo ancho/márgenes que main para no
   quedar a ancho completo mientras el resto del sitio está centrado. */
.soporte-crisis{max-width:820px;margin:0 auto;padding:1rem 1.1rem 0}
.soporte-crisis .callout{margin:0}
main{max-width:820px;margin:0 auto;padding:1.5rem 1.1rem 3rem}
h1{color:var(--brand);line-height:1.2}
.breadcrumb{color:var(--muted);font-size:.9rem}
.titulo{display:flex;flex-wrap:wrap;gap:.6rem;align-items:baseline}
.subtitulo{color:var(--muted)}
.hero{background:var(--card);border:1px solid var(--line);border-radius:12px;
  padding:1.4rem;margin-bottom:1.4rem}
.stat{color:var(--muted)}
.grid{display:grid;gap:1rem;grid-template-columns:repeat(auto-fill,minmax(240px,1fr))}
.card{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:1rem}
.card h2{margin-top:0;font-size:1.1rem}
.card .count{background:var(--brand-surface);color:#fff;border-radius:999px;
  padding:.05rem .5rem;font-size:.8rem;vertical-align:middle}
.lista{line-height:1.9}
/* Ficha */
.ficha{width:100%;border-collapse:collapse;background:var(--card);
  border:1px solid var(--line);border-radius:8px;margin:1rem 0}
.ficha caption{text-align:left;font-weight:700;color:var(--brand);padding:.4rem}
.ficha th,.ficha td{border-top:1px solid var(--line);padding:.45rem .6rem;
  text-align:left;vertical-align:top}
.ficha th{width:9rem;color:var(--muted)}
/* Cuerpo */
.cuerpo table{border-collapse:collapse;width:100%;overflow-x:auto;display:block}
.cuerpo th,.cuerpo td{border:1px solid var(--line);padding:.4rem .6rem}
.cuerpo code{background:#eef2f6;padding:.1rem .3rem;border-radius:4px}
.cuerpo pre{background:#0d1b2a;color:#e8eef5;padding:1rem;border-radius:8px;overflow:auto}
.cuerpo h2{border-bottom:2px solid var(--line);padding-bottom:.2rem;margin-top:2rem}
/* Callouts jurídicos */
.callout{border-left:5px solid #999;background:#fff;color:#1a1f26;border-radius:8px;
  padding:.7rem 1rem;margin:1rem 0;box-shadow:0 1px 3px rgba(0,0,0,.06)}
/* Fondos pastel CLAROS → texto SIEMPRE oscuro (el tema es oscuro y el body es
   claro; sin esto el texto salía blanco sobre blanco: ilegible). WCAG AA. */
.callout,.callout-title,.callout-body,.callout-body *{color:#1a1f26}
.callout a{color:#0b5ea8;text-decoration:underline}
.callout code{background:rgba(0,0,0,.06);color:#7b1fa2}
.callout-title{font-weight:700;margin:.1rem 0 .4rem}
.callout-icon{margin-right:.3rem}
.callout-body>*:first-child{margin-top:0}
.callout-body>*:last-child{margin-bottom:0}
.callout-danger{border-color:#c62828;background:#fdecea}
.callout-important{border-color:#1565c0;background:#e8f1fb}
.callout-success{border-color:#2e7d32;background:#e9f5ea}
.callout-failure{border-color:#ad1457;background:#fce4ec}
.callout-warning{border-color:#f9a825;background:#fff8e1}
.callout-note{border-color:#546e7a;background:#eceff1}
.callout-quote{border-color:#00838f;background:#e0f7fa;font-style:italic}
.callout-info{border-color:#0277bd;background:#e1f5fe}
.callout-example{border-color:#6a1b9a;background:#f3e5f5}
.callout-tip{border-color:#00897b;background:#e0f2f1}
/* Chips, badges */
.chip{display:inline-block;background:#eef2f6;border:1px solid var(--line);
  border-radius:999px;padding:.1rem .6rem;margin:.15rem;font-size:.85rem;
  text-decoration:none;color:var(--accent)}
.leyenda{list-style:none;display:flex;flex-wrap:wrap;gap:.2rem;padding:0;margin:0 0 .8rem}
.leyenda .dot{display:inline-block;width:10px;height:10px;border-radius:50%;
  margin-right:.35rem;vertical-align:middle}
.badge{border-radius:999px;padding:.1rem .6rem;font-size:.85rem;font-weight:700;
  background:#eceff1;border:1px solid var(--line)}
.badge-sinverificar,.badge-disputado{background:#fdecea;color:#c62828}
.badge-verificado,.badge-firme{background:#e9f5ea;color:#2e7d32}
.badge-enformacion,.badge-uneditor{background:#fff8e1;color:#8d6e00}
.badge-metadatosilegibles{background:#f3e5f5;color:#6a1b9a}
.wl-missing{color:var(--danger);border-bottom:1px dashed var(--danger);cursor:help}
/* HU-UX-10: ahora es focusable (tabindex="0", ver ofm_html._convert_wikilinks) —
   necesita el mismo anillo de foco que el resto de la wiki (WCAG 1.4.11). */
.wl-missing:focus{outline:3px solid var(--foco);outline-offset:2px}
.backlinks{margin-top:2rem;border-top:1px solid var(--line);padding-top:1rem}
/* Buscador */
#q{width:100%;padding:.7rem;font-size:1.1rem;border:2px solid var(--borde-control);
  border-radius:8px}
.ex{color:var(--muted);font-size:.9rem}
/* Grafo */
.grafo{width:100%;height:auto;background:var(--card);border:1px solid var(--line);
  border-radius:12px}
.grafo .edge{stroke:#b0bec5;stroke-width:1}
.grafo .glabel{font-size:10px;fill:var(--fg);text-anchor:middle}
.grafo circle{cursor:pointer}
.grafo circle:hover,.grafo a:focus circle{stroke:var(--foco);stroke-width:3}
footer{max-width:820px;margin:0 auto;padding:1.2rem 1.1rem;color:var(--muted);
  font-size:.85rem;border-top:1px solid var(--line)}
@media (prefers-color-scheme:dark){
  :root{--bg:#0f171e;--fg:#e6edf3;--muted:#9fb0bf;--line:#26333f;--card:#16212b;--brand:#5aa0e0;
    --borde-control:#6a7d8d;  /* 4.24:1 vs fondo oscuro — WCAG 1.4.11 */
    --accent:#5ec2e8;  /* 6.66:1 vs el fondo oscuro de .chip (#22303c) — 1.4.3 */
    --danger:#ef5350;  /* 5.19:1 vs --bg oscuro — 1.4.3 */
    --foco:#ffb703}  /* hex original: 10.35:1 vs --bg oscuro, 9.35:1 vs --card oscuro — ya cumplía 1.4.11 */
  .cuerpo code{background:#22303c}
  /* Solo .chip se oscurece: cada .badge-* ya trae su propio par fondo pastel +
     color de texto (≥4.5:1, ver test_badges_cumplen_contraste_AA_con_su_propio_fondo)
     que se sostiene en cualquier tema. Si .badge volviera a esta regla, empataría en
     especificidad con .badge-* y el orden de aparición le pisaría el fondo propio
     dejando su texto sin contraste (regresión real, ver CLINE §41). */
  .chip{background:#22303c}
}
/* WCAG 2.3.3 (prefers-reduced-motion): hoy la wiki no anima nada más que el
   scroll-behavior:smooth de arriba, pero el contrato design_system_core exige
   este primitivo como defensa preventiva — si una animación se agrega después
   sin recordar este bloque, quedaría sin protección para quien la pidió apagada. */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.01ms!important;
    animation-iteration-count:1!important;
    transition-duration:.01ms!important;
    scroll-behavior:auto!important;
  }
}
