/* =========================================================
   BIENESTAR: ejercicios interactivos (mapa, pausa, respiración, progreso)
   Solo lo cargan los artículos que tienen ejercicios.
   ========================================================= */
.bn{margin:1.6em 0}
.bn-caja{background:var(--blanco);border:1px solid var(--linea);border-radius:var(--r);padding:24px;box-shadow:0 20px 45px -30px rgba(0,0,0,.25)}
.bn-caja[hidden]{display:none}
.bn-t,.prose h2.bn-t{font-family:var(--display);font-size:22px;font-weight:560;margin:0 0 12px;color:var(--negro)}
.bn-pregunta{font-size:14.5px;font-weight:650;color:var(--negro);margin:0 0 10px!important}
.bn-caja .bn-pregunta+.bn-chips{margin-bottom:18px}
.bn-chips{display:flex;flex-wrap:wrap;gap:8px}
.bn-chips .chip[aria-pressed="true"]{background:var(--azul);color:var(--negro);border-color:var(--negro)}
.bn-chips .chip:disabled{opacity:.55;cursor:not-allowed}
.bn-hint{font-size:13px;color:var(--texto-suave);line-height:1.5;margin-top:10px!important}
.bn-sub{font-size:14.5px;margin:16px 0 8px!important}
.bn-seg{font-size:12.5px;font-weight:500;color:var(--texto-suave)}
.bn-error{color:var(--error-texto);font-weight:700;font-size:14px;margin:0 0 12px!important}
.bn-error::before{content:"!";display:inline-grid;place-items:center;width:20px;height:20px;margin-right:8px;border-radius:50%;background:var(--error);color:var(--blanco);font-weight:800;font-size:.8rem;line-height:1;vertical-align:1px}
.bn-error[hidden]{display:none}
.bn-botones{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}
.bn-lista{padding-left:1.3em;margin:0 0 18px!important;display:flex;flex-direction:column;gap:12px;font-size:15px;line-height:1.55}
.prose .bn-lista{list-style:decimal}
.prose .bn-lista li+li{margin-top:0}
.bn-lista small{color:var(--texto-suave);font-size:13px}
.bn-lista-compacta{gap:6px}
.btn-link{background:none;border:0;padding:10px 0;min-height:44px;color:var(--texto-suave);font:inherit;font-size:13px;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.btn-link:hover{color:var(--negro);text-decoration-thickness:2px}
.bn-vibrar{display:inline-flex;align-items:center;gap:8px;font-size:13.5px;color:var(--texto-suave);min-height:44px;margin-top:6px}
.bn-vibrar input{width:18px;height:18px;accent-color:var(--negro)}

/* ---------- mapa corporal ---------- */
.bn-mapa{display:grid;grid-template-columns:220px 1fr;gap:28px;align-items:start;background:var(--blanco);border:1px solid var(--linea);border-radius:var(--r);padding:24px;box-shadow:0 20px 45px -30px rgba(0,0,0,.25)}
.bn-figura{margin:0;text-align:center;position:sticky;top:96px}
.bn-figura svg{width:100%;max-width:200px;height:auto;display:block;margin:0 auto}
.bn-figura figcaption{font-size:12.5px;color:var(--texto-suave);margin-top:8px}
.bn-silueta>*{fill:var(--tinte);stroke:var(--turquesa);stroke-width:1.5}
.bn-punto{cursor:pointer}
.bn-punto circle:first-child{fill:var(--blanco);stroke:var(--negro);stroke-width:2.5}
.bn-punto .bn-nucleo{fill:var(--azul)}
.bn-punto:hover circle:first-child{fill:var(--tinte-2)}
.bn-punto.on circle:first-child{fill:var(--azul);stroke:var(--negro);stroke-width:3.5}
.bn-punto.on .bn-nucleo{fill:var(--negro)}
@media (prefers-reduced-motion: no-preference){
  .bn-punto:not(.on) circle:first-child{animation:bn-latido 2.4s ease-in-out infinite;transform-box:fill-box;transform-origin:center}
}
@keyframes bn-latido{50%{transform:scale(1.18)}}
.bn-detalle .bn-t,.prose .bn-detalle h2.bn-t{margin-top:18px}
.bn-alerta,.bn-urgente{border-radius:14px;padding:12px 14px;font-size:14px;line-height:1.55;margin:12px 0!important}
.bn-alerta{background:var(--tinte);color:var(--negro);border-left:5px solid var(--azul)}
.bn-urgente{background:var(--error-suave);color:var(--negro);border:2px solid var(--error);font-weight:600}
.bn-urgente::before{content:"!";display:inline-grid;place-items:center;width:20px;height:20px;margin-right:8px;border-radius:50%;background:var(--error);color:var(--blanco);font-weight:800;font-size:.8rem;line-height:1;vertical-align:1px}
.bn-alerta ul,.bn-urgente ul{margin:6px 0 4px!important;padding-left:1.2em}
.prose .bn-alerta a.link-arrow{color:var(--negro);text-decoration:underline;min-height:40px}

/* ---------- escala de dolor ---------- */
.bn-dolor{margin-top:18px}
.bn-dolor label{font-size:14.5px;font-weight:650;display:block;margin-bottom:8px}
.bn-dolor-fila{display:flex;align-items:center;gap:10px;font-size:13px;color:var(--texto-suave)}
.bn-dolor-fila input{flex:1;accent-color:var(--negro);min-height:44px}
.bn-dolor-fila output{font-family:var(--display);font-size:26px;color:var(--negro);min-width:34px;text-align:center}

/* ---------- reproductor de la pausa ---------- */
.bn-paso{font-size:12.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--texto-suave);margin:0 0 12px!important}
.bn-reproductor{display:flex;gap:24px;align-items:center;flex-wrap:wrap}
/* Reloj: el avance se dibuja con transform (scaleX), sin recalcular el diseño de la página */
.bn-reloj{width:132px;height:132px;flex-shrink:0;border-radius:50%;background:var(--tinte);border:6px solid var(--blanco);box-shadow:0 0 0 2px var(--borde);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px}
.bn-seg-grande{font-family:var(--display);font-size:30px;font-weight:560;line-height:1}
.bn-reloj-barra{width:72px;height:8px;border-radius:8px;background:var(--blanco);border:1.5px solid var(--negro);overflow:hidden}
.bn-reloj-barra span{display:block;height:100%;background:var(--azul);transform:scaleX(0);transform-origin:left}
.bn-reloj-barra.prep span{background:var(--turquesa)}
.bn-texto{flex:1 1 240px;min-width:0}
.bn-texto .bn-t{margin-bottom:6px}
.bn-pasos{font-size:16px;line-height:1.55}
.bn-cuidado{font-size:13.5px;color:var(--texto-suave);margin-top:6px!important}
.bn-siguiente{font-size:13px;font-weight:700;color:var(--negro);margin-top:10px!important}
.bn-resultado{margin-top:14px!important;font-weight:600}
.bn-resultado a{color:var(--negro);text-decoration:underline;text-decoration-color:var(--azul);text-decoration-thickness:2px}

/* ---------- respiración ---------- */
.bn-respira{display:grid;grid-template-columns:1fr 1fr;gap:10px 28px;align-items:center}
.bn-respira>.bn-botones,.bn-respira>.bn-hint{grid-column:1/-1}
.bn-burbuja-zona{display:flex;flex-direction:column;align-items:center;gap:6px;min-height:260px;justify-content:center}
.bn-burbuja{width:190px;height:190px;border-radius:50%;background:radial-gradient(circle at 35% 30%,var(--blanco),var(--tinte-2) 60%,var(--turquesa));border:2px solid var(--negro);display:flex;align-items:center;justify-content:center;transform:scale(.62);transition-property:transform;transition-timing-function:ease-in-out;box-shadow:0 18px 40px -22px rgba(0,0,0,.45)}
.bn-burbuja.grande{transform:scale(1)}
.bn-burbuja.quieta{transform:none!important;transition:none!important;width:120px;height:120px}
.bn-burbuja img{width:44%;height:auto}
.bn-fase{font-family:var(--display);font-size:26px;font-weight:560;color:var(--negro);margin-top:8px!important;text-align:center}
.bn-conteo{font-size:15px;font-weight:700;color:var(--negro);min-height:22px}
.bn-barra{width:180px;height:8px;background:var(--tinte-2);border:1.5px solid var(--negro);border-radius:8px;overflow:hidden}
.bn-barra span{display:block;height:100%;background:var(--azul);transform:scaleX(0);transform-origin:left}
.bn-restante{font-size:13px;color:var(--texto-suave);min-height:18px}

/* ---------- progreso ---------- */
.bn-progreso .bn-t .bn-seg{font-family:var(--sans)}
.bn-racha{display:flex;align-items:baseline;gap:8px;margin-bottom:12px}
.bn-racha b{font-family:var(--display);font-size:40px;font-weight:700;color:var(--negro);line-height:1}
.bn-racha span{font-size:14px;color:var(--texto-suave)}
.bn-semana{list-style:none!important;padding:0!important;margin:0 0 14px!important;display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:4px;max-width:320px}
.bn-semana li{display:flex;flex-direction:column;align-items:center;gap:4px;margin:0!important}
.bn-semana li>span:first-child{width:100%;max-width:36px;aspect-ratio:1;border-radius:50%;border:2px dashed var(--negro);display:flex;align-items:center;justify-content:center;font-weight:800;color:var(--negro)}
.bn-semana li.hecho>span:first-child{background:var(--azul);border:2px solid var(--negro)}
.bn-semana li.hoy>span:first-child{box-shadow:0 0 0 3px var(--turquesa)}
.bn-semana small{font-size:12px;font-weight:700;color:var(--texto-suave)}
.bn-insignias{list-style:none!important;padding:0!important;margin:0 0 16px!important;display:flex;flex-wrap:wrap;gap:8px}
.bn-insignias li{margin:0!important;font-size:13px;font-weight:600;border-radius:100px;padding:6px 12px;background:var(--tinte);color:var(--negro)}
.bn-insignias li.ok{background:var(--turquesa);border:1.5px solid var(--negro);color:var(--negro)}
.bn-grafica{margin:0}
.bn-grafica svg{width:100%;max-width:420px;height:auto;display:block}
.bn-grafica rect.antes{fill:var(--error)}
.bn-grafica rect.despues{fill:var(--exito)}
.bn-grafica text{font-size:9px;fill:var(--negro);font-family:var(--sans)}
.bn-grafica figcaption{font-size:12.5px;color:var(--texto-suave);display:flex;align-items:center;gap:6px;margin-top:4px}
.bn-grafica .ley{display:inline-block;width:10px;height:10px;border-radius:3px;margin-left:6px}
.bn-grafica .ley.antes{background:var(--error)}
.bn-grafica .ley.despues{background:var(--exito)}

@media (max-width:920px){
  .bn-mapa{grid-template-columns:1fr;padding:18px}
  .bn-figura{position:static}
  .bn-figura svg{max-width:150px}
  .bn-respira{grid-template-columns:1fr}
  .bn-caja{padding:18px}
}

/* Botones dentro de artículos: la regla de enlaces de .prose no debe pisar sus colores */
.prose a.btn{text-decoration:none}
.prose a.btn-teal{color:var(--negro)}
.prose a.btn-outline{color:var(--negro)}

.bn-alerta strong,.bn-alerta b,.bn-urgente strong,.bn-urgente b{color:inherit}

/* Mis pausas del último mes: estado de cada una (completa, incompleta o saltada) */
.bn-t2{font-size:1.05rem;margin:18px 0 8px}
.bn-pausas-lista{list-style:none!important;padding:0!important;margin:0 0 16px!important;display:grid;gap:8px}
.bn-pausas-lista li{margin:0!important;padding:10px 12px;border-radius:10px;border-left:6px solid var(--tinte);background:var(--tinte);font-size:14px}
.bn-pausas-lista li.completa{border-left-color:var(--exito)}
.bn-pausas-lista li.incompleta{border-left-color:var(--azul)}
.bn-pausas-lista li.saltada{border-left-color:var(--error)}
.bn-pausas-lista span{color:var(--texto-suave)}
.bn-estado-fin{font-weight:600}

/* PDF del progreso: se imprime desde la página; la hoja solo aparece al imprimir */
.bn-pdf{margin-top:18px;padding-top:14px;border-top:1px dashed var(--negro)}
.bn-pdf-ops{display:flex;flex-wrap:wrap;gap:10px 18px;margin:0 0 12px}
.bn-pdf-op{display:inline-flex;align-items:center;gap:6px;font-size:14px;min-height:44px}
.bn-imprimir{display:none}
@media print{
  body.bn-imprimiendo > *:not(.bn-imprimir){display:none!important}
  .bn-imprimir{display:block!important;color:#000;background:#fff;padding:24px;font-size:12pt}
  .bn-imprimir table{width:100%;border-collapse:collapse;margin-bottom:12px}
  .bn-imprimir th,.bn-imprimir td{border:1px solid #999;padding:4px 6px;text-align:left}
}

/* Envío voluntario al panel de la IPS */
.bn-envio{margin-top:18px;padding-top:14px;border-top:1px dashed var(--negro)}
.bn-envio .bn-campo{display:block;font-weight:700;margin-bottom:6px}
.bn-envio input[type=text]{display:block;width:100%;max-width:340px;min-height:44px;padding:8px 12px;margin:0 0 12px;border:1.5px solid var(--negro);border-radius:10px;font:inherit;color:var(--negro);background:none}
.bn-autoriza{align-items:flex-start;line-height:1.45;max-width:60ch;margin:4px 0 12px}
.bn-aviso{min-height:1.4em;margin:6px 0;color:var(--error);font-weight:600}
.bn-listo{font-weight:600}