/* sapolsky.css · lo que la familia sapolsky tiene y el resto del proyecto no.
   Generado por scripts/convertir-sapolsky.py a partir del CSS de la página original
   (idéntico en las 16 páginas) — no se edita a mano.

   Clases del .md sin regla en guias.css + tema.css + musculo.css + video.css: 27
   Anclas sin regla: 32
   Reglas recuperadas del original: 106
   Variables nuevas: 3 (--cita, --cita-bg, --ctrl)
   Lo que NO se ha traído del original: su barra de progreso, su menú ☰, su
   conmutador de tema, su botón flotante de cerrar caja y su paleta `:root`
   (esos los pone el tema de este proyecto). */


/* fuera de at-rules */
section.lectura,#referencias { max-width:var(--maxw);margin:0 auto;padding:clamp(2.2rem,5vw,3.6rem) 1.15rem 0 }
section.lectura { border-top:1px solid var(--line) }
section.lectura:first-of-type { border-top:0 }
#referencias { border-top:1px solid var(--line);margin-top:3rem }
nav.menu-clase { display:flex;flex-wrap:wrap;gap:.3rem;margin:.2rem 0 1.8rem;padding:.5rem; background:var(--bg2);border:1px solid var(--line);border-radius:14px }
nav.menu-clase a { display:inline-flex;align-items:center;min-height:44px;padding:.3rem .8rem; border-radius:10px;color:var(--txt2);font-size:.85rem;font-weight:650; text-decoration:none;border:1px solid transparent;white-space:nowrap }
nav.menu-clase a:hover { background:var(--bg3);border-color:var(--line2);color:var(--txt) }
figure.dato .dato-num { display:block;font-size:clamp(1.9rem,5vw,2.7rem);font-weight:800; color:var(--amber);line-height:1.05;letter-spacing:-.02em }
figure.grafico { background:var(--card);border:1px solid var(--line);border-radius:var(--r2); padding:1rem 1.15rem;margin:1.5rem 0;overflow-x:auto;box-shadow:var(--sh) }
figure.grafico svg { width:100%;height:auto;display:block;color:var(--txt2);overflow:visible }
figure.grafico canvas { width:100%;max-width:100% }
figure.grafico figcaption { font-size:.78rem;color:var(--txt3);margin-top:.6rem;line-height:1.5 }
aside.honestidad { background:color-mix(in srgb,var(--cita) 7%,var(--card)); border:1px solid color-mix(in srgb,var(--cita) 45%,var(--line)); border-radius:var(--r2);padding:1rem 1.15rem;margin:1.6rem 0;display:block }
aside.honestidad h4 { color:var(--cita);font-size:1rem;margin-bottom:.45rem }
aside.honestidad p { margin-bottom:.6rem;font-size:.94rem }
aside.honestidad p:last-child { margin-bottom:0 }
details.transcripcion { background:var(--bg2);border:1px solid var(--line);border-radius:var(--r2); margin:1.5rem 0 2.2rem;padding:.2rem .2rem }
details.transcripcion>summary { cursor:pointer;list-style:none;min-height:44px; display:flex;align-items:center;gap:.6rem;padding:.6rem .9rem; font-weight:700;font-size:.95rem;color:var(--txt) }
details.transcripcion>summary::-webkit-details-marker { display:none }
details.transcripcion>summary::before { content:'▸';color:var(--amber);font-size:.95rem; display:inline-block;transition:transform .18s ease }
details.transcripcion[open]>summary::before { transform:rotate(90deg) }
details.transcripcion .texto { padding:0 1rem 1rem;border-top:1px solid var(--line) }
details.transcripcion .texto h4 { margin:1.4rem 0 .4rem;color:var(--amber);font-size:.95rem }
details.transcripcion .texto p { margin-bottom:.85rem;font-size:.93rem;line-height:1.75 }
details.transcripcion .texto .muted,details.transcripcion .texto .aviso { background:var(--bg3);border:1px dashed var(--line2);border-radius:10px;padding:.7rem .9rem; font-size:.85rem;color:var(--txt3) }
a.cita-estudio { color:var(--cita);background:var(--cita-bg);border-radius:5px; padding:.05em .25em;cursor:pointer;text-decoration:underline; text-decoration-style:dotted;text-underline-offset:3px;font-weight:600 }
a.cita-estudio:hover { background:color-mix(in srgb,var(--cita) 24%,transparent) }
a.cita-estudio::after { content:'↗';font-size:.72em;margin-left:.18em;opacity:.75 }
span.defecto { color:var(--red);background:color-mix(in srgb,var(--red) 12%,transparent); border-bottom:2px solid color-mix(in srgb,var(--red) 55%,transparent); border-radius:4px;padding:.05em .25em;cursor:pointer;font-weight:650 }
span.defecto::after { content:'⚑';font-size:.75em;margin-left:.2em }
a.cita-estudio:focus-visible,span.defecto:focus-visible,
.nav-links a:focus-visible,nav.menu-clase a:focus-visible,.btn-tema:focus-visible,
details.transcripcion>summary:focus-visible { outline:3px solid var(--amber);outline-offset:2px }
.ref-clase { position:absolute;left:2.3rem;top:2.65rem;font-size:.62rem;font-weight:800; letter-spacing:.05em;color:var(--txt3);background:var(--bg2);border:1px solid var(--line); border-radius:6px;padding:.05rem .32rem }
dialog#ficha { border:1px solid var(--line2);border-radius:var(--r);background:var(--card); color:var(--txt);max-width:min(680px,92vw);width:100%;padding:0;box-shadow:0 24px 60px rgba(0,0,0,.35); max-height:86vh }
dialog#ficha::backdrop { background:rgba(6,8,12,.62);backdrop-filter:blur(2px) }
.dlg-cab { display:flex;align-items:center;justify-content:flex-end;gap:1rem; padding:.55rem 1rem .4rem;border-bottom:1px solid var(--line) }
.dlg-cerrado { background:none;border:0;color:var(--txt3);cursor:pointer;font:inherit;font-size:.85rem; font-weight:700;min-height:44px;padding:0 .3rem }
.dlg-cerrado:hover { color:var(--txt) }
.dlg-cuerpo { padding:1rem 1.15rem 1.2rem;overflow-y:auto;max-height:70vh }
.dlg-cuerpo h3 { margin:.2rem 0 .4rem;font-size:1.15rem;line-height:1.3 }
.dlg-cuerpo p { font-size:.94rem }
.dlg-cuerpo blockquote { border-left:3px solid var(--red);padding:.3rem 0 .3rem .9rem;margin:.6rem 0 1rem; font-style:italic;color:var(--txt) }
.pie-datos { font-size:.92rem;color:var(--txt2);max-width:75ch }
.pie-datos strong { color:var(--amber);font-variant-numeric:tabular-nums }
.pie-nota { margin-top:1.2rem;font-size:.82rem;color:var(--txt3);max-width:75ch }

@media (max-width:760px) {
  nav.menu-clase { flex-wrap:nowrap;overflow-x:auto;scrollbar-width:thin }
  .wrap,section.lectura,#referencias,footer { padding-left:.9rem;padding-right:.9rem }
  .ref-clase { left:2rem }
  figure.dato,figure.grafico,aside.honestidad,div.anecdota { padding:.85rem .9rem }
  .dlg-cuerpo { padding:.9rem }
}

/* fuera de at-rules */
.resumen-1min { margin:1.6rem 0 2rem;padding:1.1rem 1.2rem 1.2rem;border-radius:16px; background:var(--bg2);border:1px solid var(--line2); border-left:4px solid var(--amber) }
.resumen-1min h3 { margin:0 0 .7rem;font-size:1rem;text-transform:uppercase;letter-spacing:.09em;color:var(--amber) }
.resumen-1min ul { margin:0;padding-left:1.1rem;list-style:none }
.resumen-1min li { position:relative;margin:.42rem 0;font-size:.95rem;line-height:1.6;padding-left:1rem }
.resumen-1min li::before { content:'▪';position:absolute;left:0;color:var(--amber);font-size:.8em;top:.2em }
details.quienes { margin:1.6rem 0;border:1px solid var(--line);border-radius:14px;background:var(--bg2) }
details.quienes>summary { cursor:pointer;padding:.85rem 1.1rem;font-weight:750;font-size:.95rem;list-style:none }
details.quienes>summary::-webkit-details-marker { display:none }
details.quienes>summary::before { content:'▸';color:var(--amber);margin-right:.5rem;display:inline-block }
details.quienes[open]>summary::before { content:'▾' }
details.quienes>summary::after { content:' · biografías colapsadas';color:var(--txt3);font-weight:500;font-size:.82rem }
details.quienes[open]>summary::after { content:'' }
.quienes-in,.quienes-cuerpo { padding:.2rem 1.1rem 1rem }
details.quienes h4 { margin:1.1rem 0 .35rem;font-size:.9rem;color:var(--amber); text-transform:uppercase;letter-spacing:.06em;font-weight:800 }
details.quienes p,details.quienes li { font-size:.93rem;line-height:1.68;margin:.3rem 0 }
details.quienes ul { padding-left:1.1rem }
details.quienes strong { color:var(--txt) }
.aviso-traduccion { margin:.4rem 0 .6rem;font-size:.86rem;color:var(--txt3) }
span.marca-registro { color:var(--txt2);background:color-mix(in srgb,var(--txt3) 14%,transparent); border-bottom:2px dotted color-mix(in srgb,var(--txt3) 65%,transparent); border-radius:4px;padding:.05em .25em;cursor:pointer;font-weight:650 }
span.marca-registro::after { content:'⟐';font-size:.7em;margin-left:.2em;color:var(--txt3) }
span.marca-registro[data-tipo-registro="afirmacion"] { color:var(--txt2);background:color-mix(in srgb,var(--txt3) 10%,transparent) }

@media(max-width:640px) {
  .resumen-1min { padding:.9rem 1rem }
}

@media(max-width:760px) {
  nav.menu-clase { flex-wrap:wrap;overflow-x:visible;white-space:normal }
  a.cita-estudio { padding:.38rem .2rem }
  .refs a,.quienes a,main li a { padding-block:.45rem }
  .ref-clase { font-size:.78rem }
  span.eyebrow,span.fin-etq,span.stat-src { font-size:.8rem }
  .dato figcaption,figure.grafico figcaption,figcaption { font-size:.8rem }
  figure.grafico { overflow-x:visible }
  figure.grafico svg { width:100%;max-width:100%;height:auto }
}

/* fuera de at-rules */
figure.dato .dato-num { display:inline;font-size:1rem;font-weight:700;color:var(--amber); letter-spacing:0;line-height:inherit }
figure.dato .dato-num::after { content:' ·' }
figure.grafico svg { display:block;margin:0 auto;width:100%;max-width:460px;height:auto }
#btn-menu,.btn-temas,.btn-tema,.pm-cerrar,.btn-cerrar-caja,.fin-clase a,.btn-idioma { border-color:var(--ctrl) }
details.transcripcion .texto p,.texto[data-idioma] p,
details.transcripcion .texto[data-idioma] p { font-size:1rem;line-height:1.72 }
section.lectura p,section.lectura .lead,section.lectura blockquote,
section.lectura ul,section.lectura ol,.texto[data-idioma] p { max-width:72ch }

@media(max-width:760px) {
  nav.menu-clase { overflow-x:visible;flex-wrap:wrap;scrollbar-width:none }
  nav.menu-clase a { white-space:normal;font-size:.82rem;text-align:left }
}

/* fuera de at-rules */
.fin-clase { display:flex;flex-wrap:wrap;align-items:center;gap:.5rem;justify-content:space-between; margin:2.2rem 0 .6rem;padding:.9rem;border:1px solid var(--line);border-radius:14px; background:var(--bg2) }
.fin-siguiente { display:flex;flex-direction:column;justify-content:center;gap:.1rem; flex:1 1 13rem;min-height:48px;padding:.5rem .85rem;border:1px solid var(--line2); border-radius:10px;background:var(--bg3);text-decoration:none }
.fin-etq { font-size:.72rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--txt3) }
.fin-siguiente strong { font-size:1rem;color:var(--txt) }
.fin-siguiente:hover { border-color:var(--amber) }
.fin-clase a.fin-arriba { display:inline-flex;align-items:center;justify-content:center; min-height:44px;padding:0 .9rem;border:1px solid var(--line2);border-radius:999px; color:var(--txt2);font-size:.85rem;font-weight:700;text-decoration:none }
.fin-arriba:hover { border-color:var(--amber);color:var(--amber) }
#btn-menu:focus-visible,.btn-temas:focus-visible,.btn-tema:focus-visible,
.btn-cerrar-caja:focus-visible,.fin-clase a:focus-visible { outline:2px solid var(--amber);outline-offset:2px }
.cab-pagina { max-width:var(--maxw);margin:0 auto;padding:clamp(1.7rem,4vw,2.9rem) 1.15rem .6rem }
.cab-pagina h1 { margin:.35rem 0 .5rem;font-size:clamp(1.5rem,3.6vw,2.3rem);line-height:1.2 }
details.refs-caja { margin:1rem 0 0;border:1px solid var(--line);border-radius:var(--r); background:var(--card);padding:.1rem .95rem }
details.refs-caja>summary { cursor:pointer;display:flex;align-items:center;min-height:52px; font-weight:700;color:var(--txt) }
details.refs-caja>summary::before { content:'\25B8';color:var(--amber);margin-right:.55rem }
details.refs-caja[open]>summary::before { content:'\25BE' }
details.refs-caja ol.refs { margin-top:.2rem;padding-bottom:.6rem }
details.refs-grupo { margin:1rem 0 0;background:var(--bg3) }
details.refs-grupo>summary { font-size:1.02rem }
details.refs-grupo details.refs-caja { margin:.3rem 0 .7rem;background:var(--card) }
details.refs-grupo ol.refs { margin-top:.2rem }


/* ═══════════════════════════════════════════════════════════════════════════════
   PUENTE CON EL TEMA DE ESTE PROYECTO
   El CSS de arriba es el de la página original (menos su barra y su menú, que pone
   el tema). Se escribe para el vocabulario de la casa: oscuro por defecto y claro
   cuando el conmutador de la barra pone `data-tema="claro"` / `data-md-color-scheme`.
   Las variables que el proyecto ya definía (--bg, --bg2, --txt, --amber…) NO se
   redefinen aquí: las pone guias.css. Solo se añaden las propias de esta familia.
   ═══════════════════════════════════════════════════════════════════════════════ */

/* ── oscuro (el que arranca por defecto en las guías) ── */
:root,
[data-md-color-scheme="slate"] {   --ctrl: #5a6a86; }

/* ── claro (lo enciende el conmutador de la barra) ── */
html[data-tema="claro"],
[data-md-color-scheme="default"] {   --ctrl: #5a6a86; }

/* ── las pestañas de la transcripción (pymdownx.tabbed) ─────────────────────────
   El original cambiaba de idioma con dos botones de 44 px. Los rótulos de las
   pestañas hacen ese papel: se les da el mismo alto pulsable y el mismo aire, para
   que el cambio de idioma siga siendo cómodo con el dedo. */
.md-typeset .tabbed-set { margin: .6rem 0 0; border: 0; }
.md-typeset .tabbed-labels > label {
  min-height: 44px; display: inline-flex; align-items: center;
  padding: .5rem .95rem; font-size: .85rem; font-weight: 700;
  border: 1px solid var(--line2); border-radius: 999px; margin-right: .45rem;
}
.md-typeset .tabbed-labels { gap: 0; flex-wrap: wrap; box-shadow: none; }
.md-typeset .tabbed-labels > label > a { color: inherit; }
.md-typeset .tabbed-content { box-shadow: none; }
.md-typeset .tabbed-block > p { font-size: 1rem; line-height: 1.72; max-width: 72ch; }
.md-typeset .tabbed-block > p.muted,
.md-typeset .tabbed-block > p.aviso-traduccion { max-width: 72ch; }

/* ── el relleno lateral, una sola vez ───────────────────────────────────────────
   El original traía el margen lateral en cada sección y en cada `.wrap`; aquí el
   tema ya lo pone en `.md-content__inner` (y `guias.css` da a las `section` un marco
   inferior y un relleno de bloque que el original no tenía). Sumados, el contenido
   perdía 25 px de ancho: las gráficas se dibujaban a escala 0,72 y sus rótulos
   bajaban de 12,6 a 11,6 px reales, y entre sección y sección aparecía una raya de
   más. Se anula el lateral duplicado y el marco inferior; el de arriba, que es el
   del original, se queda. */
.md-typeset .wrap,
.md-typeset section.lectura,
.md-typeset #referencias,
.md-typeset footer { padding-left: 0; padding-right: 0; }
.md-typeset section.lectura { border-bottom: 0; }
.md-typeset section#fuentes { padding-block: 0; }

/* ── el tamaño de letra de los desplegables ─────────────────────────────────────
   Material da a sus `<details>` un cuerpo de 10,24 px (0,64 rem), que el original no
   tenía: el resumen de cada caja de fuentes (el que no lleva tamaño propio) se
   quedaba en 10,2 px reales donde el original está en 16. Se devuelve el tamaño que
   hereda de su sección; los hijos que ya traen el suyo no se tocan. */
.md-typeset details.transcripcion,
.md-typeset details.quienes,
.md-typeset details.refs-caja { font-size: 1rem; }
.md-typeset details.refs-caja > summary { font-size: 1.02rem; }

