/* Mapa de «Calor» (web/mapa-calor.js): mismo panel lateral que Explicar/Funciones y una capa <canvas> sobre el
   mockup. Texto ≥ 14 px y áreas táctiles ≥ 44 px. */
#calorBtn[aria-pressed="true"]{background:var(--accent);color:var(--accent-ink)}
.cal-capa{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:2;animation:calEntra .3s ease-out}
@keyframes calEntra{from{opacity:0}to{opacity:1}}
.cal-panel .exp-cerrar{min-width:44px;min-height:44px}
.cal-filtros{display:grid;gap:8px;margin-bottom:10px}
.cal-lbl{display:grid;gap:4px;font-size:.875rem;font-weight:700;color:rgba(255,255,255,.75)}
.cal-ruta{width:100%;min-height:44px;padding:0 12px;border-radius:12px;border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.07);color:var(--blanco);font-size:1rem}
.cal-ruta option{color:var(--esc-sobre-claro)}
.cal-ruta:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
.cal-resumen{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;margin:4px 0 10px}
.cal-resumen div{padding:10px 12px;border-radius:12px;background:rgba(255,255,255,.06)}
.cal-resumen dt{font-size:.875rem;color:rgba(255,255,255,.7)}
.cal-resumen dd{margin:2px 0 0;font-family:var(--display);font-size:1.375rem;font-weight:800;font-variant-numeric:tabular-nums}
.cal-resumen dd small{font-family:var(--sans,system-ui);font-size:.875rem;font-weight:700;color:rgba(255,255,255,.7)}
.cal-resumen .cal-conv{grid-column:1/-1;background:rgba(255,255,255,.1)}
.cal-leyenda{display:flex;align-items:center;gap:8px;font-size:.875rem;color:rgba(255,255,255,.75)}
.cal-leyenda i{flex:1;height:10px;border-radius:6px;background:linear-gradient(90deg,var(--calor-1),var(--calor-2) 35%,var(--calor-3) 60%,var(--calor-4) 80%,var(--luz-err))}
.cal-scroll,.cal-evs{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.cal-scroll li{display:grid;grid-template-columns:48px 1fr 48px;align-items:center;gap:8px;font-size:.875rem}
.cal-scroll span{color:rgba(255,255,255,.7)}
.cal-scroll b{text-align:right;font-variant-numeric:tabular-nums}
.cal-barra{height:10px;border-radius:6px;background:rgba(255,255,255,.1);position:relative;overflow:hidden}
.cal-barra::after{content:"";position:absolute;inset:0 auto 0 0;width:var(--pc,0%);background:var(--accent);border-radius:6px;transition:width .4s ease-out}
.cal-secs{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.cal-sec-btn{all:unset;box-sizing:border-box;display:grid;gap:2px;width:100%;min-height:48px;padding:8px 12px;border-radius:14px;background:rgba(255,255,255,.04);cursor:pointer}
.cal-sec-btn:hover{background:rgba(255,255,255,.09)}
.cal-sec-btn:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.cal-sec-nom{font-size:.9375rem;font-weight:700;overflow-wrap:anywhere}
.cal-sec-nom small{display:block;font-size:.875rem;font-weight:600;color:rgba(255,255,255,.6)}
.cal-sec-n{font-size:.875rem;color:rgba(255,255,255,.8)}
.cal-sec-n em{font-style:normal;font-weight:700;color:var(--esc-amarillo-2)}
.cal-sec-n em.rabia{color:var(--esc-rojo)}
.cal-evs li{display:flex;justify-content:space-between;padding:8px 12px;border-radius:12px;background:rgba(255,255,255,.05);font-size:.9375rem}
.cal-copiar{width:100%;min-height:44px;margin-top:14px;color:var(--blanco);border-color:rgba(255,255,255,.25)}
.cal-nota{margin:.6rem 0 0;font-size:.875rem;color:rgba(255,255,255,.6)}
.app.presenting #calPanel,.app.presenting #calCapa,.app.presenting #calorBtn{display:none!important}
/* En celulares angostos los botones del visor ya no caben todos: la fila se desliza de lado en vez de desbordar. */
@media (max-width:480px){.bar-r{min-width:0;justify-content:flex-start;overflow-x:auto;scrollbar-width:none;overscroll-behavior-x:contain}.bar-r>*{flex:none}.bar-r::-webkit-scrollbar{display:none}}
/* Texto del panel ≥ 14 px (las etiquetas compartidas con Explicar son de 13 px). */
.cal-panel .exp-sub,.cal-panel .exp-vivo{font-size:.875rem}
@media (prefers-reduced-motion:reduce){.cal-capa{animation:none}.cal-barra::after{transition:none}}