/* «Por qué falló» (/por-que-fallo/ y /por-que-fallo/<episodio>, lib/porquefallo.mjs). Encima de sitio.css y tiempo.css.
   Móvil primero: el gráfico es un SVG con viewBox y width:100%; las tablas se deslizan dentro de su caja
   (t-scroll, contain:inline-size) y no ensanchan la página. Colores de sitio.css: valen en tema claro y oscuro. */
.pf-cab h1{font-size:clamp(28px,4vw,46px);line-height:1.15;max-width:22em}
.pf-tipo{font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:var(--s-muted);margin:10px 0 0}
.pf-causas{margin:0 0 14px;padding-left:1.2em;max-width:46em}
.pf-causas li{margin:0 0 8px;color:var(--s-ink2)}
.pf-ficha{background:var(--s-accent-bg);border-left:4px solid var(--s-accent);padding:10px 14px;border-radius:6px;max-width:46em}
.pf-ficha p{margin:0 0 6px;color:var(--s-ink)}
.pf-ficha p:last-child{margin:0}
.pf-graf{margin:10px 0 6px;max-width:680px}
.pf-graf svg{display:block;width:100%;height:auto}
.pf-graf figcaption{margin-top:6px}
.pf-eje{font-size:12px;fill:var(--s-muted);font-variant-numeric:tabular-nums}
.pf-rej{stroke:var(--s-line);stroke-width:1}
.pf-graf path{fill:none;stroke-linejoin:round;stroke-linecap:round}
.pf-obs{stroke:var(--s-hot);stroke-width:3}
.pf-med{stroke:var(--s-ink);stroke-width:2;stroke-dasharray:6 4}
.pf-vio{stroke:var(--s-accent);stroke-width:2.5}
.pf-mod{stroke:var(--s-coast);stroke-width:1.2;opacity:.75}
.pf-leyenda{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:4px 16px;font-size:14px;color:var(--s-ink2)}
.pf-leyenda li{display:flex;align-items:center;gap:6px;min-width:0}
.pf-k{display:inline-block;width:22px;height:0;border-top:3px solid var(--s-coast);flex:none}
.pf-k-obs{border-top-color:var(--s-hot)}
.pf-k-med{border-top:2px dashed var(--s-ink)}
.pf-k-vio{border-top-color:var(--s-accent)}
.pf-k-mod{border-top-width:1px}
.pf-datos{margin-top:10px}
.pf-datos>summary{cursor:pointer;color:var(--s-accent);padding:6px 0}
.pf-tabla{border-collapse:collapse;font-variant-numeric:tabular-nums}
.pf-tabla caption{text-align:left;font-size:14px;color:var(--s-muted);padding:0 0 6px}
.pf-tabla th,.pf-tabla td{border-bottom:1px solid var(--s-line);text-align:right}
.pf-tabla th[scope=row],.pf-tabla thead th:first-child{text-align:left}
.pf-si th,.pf-si td{background:var(--s-accent-bg)}
.pf-med-fila th,.pf-med-fila td{font-style:italic}
.pf-obs-fila th,.pf-obs-fila td{font-weight:700;color:var(--s-ink)}
.pf-lista{list-style:none;margin:0;padding:0;max-width:52em}
.pf-lista li{padding:10px 0;border-bottom:1px solid var(--s-line);overflow-wrap:anywhere}
.pf-lista .muted{font-size:14px}
@media (max-width:640px){
  .pf-tabla th,.pf-tabla td{padding:7px 5px;font-size:14px}
}
