/* SmartPit-Barbacoa · tablero del pozo · Roberto Ocampo */
@font-face{font-family:"Barlow Condensed";font-weight:500;font-display:swap;src:url(/static/fonts/barlow-condensed-latin-500-normal.woff2) format("woff2")}
@font-face{font-family:"Barlow Condensed";font-weight:600;font-display:swap;src:url(/static/fonts/barlow-condensed-latin-600-normal.woff2) format("woff2")}
@font-face{font-family:"Barlow Condensed";font-weight:700;font-display:swap;src:url(/static/fonts/barlow-condensed-latin-700-normal.woff2) format("woff2")}
@font-face{font-family:"Inter";font-weight:400;font-display:swap;src:url(/static/fonts/inter-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"Inter";font-weight:500;font-display:swap;src:url(/static/fonts/inter-latin-500-normal.woff2) format("woff2")}
@font-face{font-family:"Inter";font-weight:600;font-display:swap;src:url(/static/fonts/inter-latin-600-normal.woff2) format("woff2")}

:root{
  --fondo:#0B1120; --panel:#0F172A; --panel-2:#131C31; --borde:#1E293B; --borde-2:#334155;
  --texto:#F1F5F9; --texto-2:#94A3B8; --texto-3:#64748B;
  --brasa:#FF3B00; --brasa-2:#FF6A2B; --ambar:#FFB020; --oro:#FCD34D;
  --boveda:#38BDF8; --alimento:#34D399; --peligro:#EF4444; --peligro-2:#B91C1C;
  --toque:56px; --radio:18px;
  color-scheme:dark;
}
html[data-tema="sol"]{
  --fondo:#FFFFFF; --panel:#FFFFFF; --panel-2:#F1F5F9; --borde:#0F172A; --borde-2:#0F172A;
  --texto:#000000; --texto-2:#111827; --texto-3:#1F2937;
  --brasa:#C2410C; --brasa-2:#9A3412; --ambar:#92400E; --oro:#78350F;
  --boveda:#0369A1; --alimento:#047857; --peligro:#DC2626; --peligro-2:#991B1B;
  color-scheme:light;
}
html[data-quiosco="1"]{ --toque:72px; font-size:19px }

*{box-sizing:border-box}
body{margin:0;background:var(--fondo);color:var(--texto);font-family:Inter,system-ui,sans-serif;
  -webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent}
html[data-tema="noche"] body{background:
  radial-gradient(1200px 600px at 20% -10%, rgba(255,59,0,.10), transparent 60%),
  radial-gradient(900px 500px at 110% 10%, rgba(56,189,248,.06), transparent 60%), var(--fondo)}
.num{font-family:"Barlow Condensed","Arial Narrow",sans-serif;font-variant-numeric:tabular-nums;letter-spacing:.01em}
.rotulo{font-size:.72rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--texto-2)}
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.salto{position:absolute;left:-999px;top:8px;background:var(--ambar);color:#000;padding:10px 14px;border-radius:10px;z-index:99}
.salto:focus{left:8px}
:focus-visible{outline:3px solid var(--ambar);outline-offset:3px}

.panel{background:linear-gradient(180deg,var(--panel-2),var(--panel));border:1px solid var(--borde);border-radius:var(--radio)}
html[data-tema="sol"] .panel{background:var(--panel);border-width:2px}

/* selector de idioma: globo + idioma contrario, arriba a la derecha, flotando (E4/E5/E8) */
.selector-idioma{position:fixed;top:14px;right:14px;z-index:60;display:inline-flex;align-items:center;gap:6px;
  min-height:44px;min-width:44px;padding:0 12px;border-radius:999px;border:1px solid var(--borde-2);
  background:color-mix(in srgb,var(--panel) 85%,transparent);backdrop-filter:blur(8px);color:var(--texto);
  font:600 .85rem/1 Inter,sans-serif;letter-spacing:.06em;cursor:pointer}
.selector-idioma svg{width:18px;height:18px}

/* botones */
.btn{min-height:var(--toque);padding:0 18px;border-radius:14px;border:1px solid var(--borde-2);background:var(--panel-2);
  color:var(--texto);font:600 1rem/1 Inter,sans-serif;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:8px;
  touch-action:manipulation;transition:transform .08s,background .2s,border-color .2s}
.btn:active{transform:scale(.97)}
.btn[disabled]{opacity:.4;cursor:not-allowed}
.btn-primario{background:linear-gradient(180deg,var(--brasa-2),var(--brasa));border-color:transparent;color:#fff;box-shadow:0 8px 28px -10px rgba(255,59,0,.7)}
html[data-tema="sol"] .btn-primario{box-shadow:none}
.btn-sutil{background:transparent}
.seg{display:flex;padding:4px;gap:4px;border-radius:16px;background:var(--fondo);border:1px solid var(--borde)}
.seg button{flex:1;min-height:calc(var(--toque) - 8px);border:0;border-radius:12px;background:transparent;color:var(--texto-2);
  font:600 .95rem Inter,sans-serif;cursor:pointer}
.seg button[aria-pressed="true"]{background:var(--panel-2);color:var(--texto);box-shadow:inset 0 0 0 1px var(--borde-2)}

/* parada de emergencia */
.menu-config{position:relative}
.menu-config>summary{list-style:none;display:inline-flex;align-items:center;gap:8px;cursor:pointer}
.menu-config>summary::-webkit-details-marker{display:none}
.menu-config>summary svg{width:20px;height:20px}
.menu-config-panel{position:absolute;right:0;top:calc(100% + 8px);z-index:70;min-width:220px;padding:6px;border-radius:14px;
  background:var(--panel);border:1px solid var(--borde-2);box-shadow:0 18px 40px -16px rgba(0,0,0,.8);display:grid;gap:2px}
.menu-item{display:block;width:100%;text-align:left;min-height:46px;padding:0 14px;border:0;border-radius:10px;background:transparent;
  color:var(--texto);font:500 .95rem Inter,sans-serif;text-decoration:none;line-height:46px;cursor:pointer}
.menu-item:hover,.menu-item:focus-visible{background:var(--panel-2)}
.menu-salir{color:#FCA5A5;border-top:1px solid var(--borde);border-radius:0 0 10px 10px;margin-top:4px}
html[data-tema="sol"] .menu-salir{color:#991B1B}

/* parada: arriba junto a «Modo sol», sin gritar (ronda 4, orden de Roberto); el corte físico es el seccionador de 4 polos */
.estop{min-height:var(--toque);padding:0 22px 0 16px;border-radius:999px;border:1.5px solid rgba(248,113,113,.75);
  background:rgba(15,23,42,.92);color:#FECACA;cursor:pointer;backdrop-filter:blur(8px);
  font:600 1.05rem/1 "Barlow Condensed",sans-serif;letter-spacing:.08em;text-transform:uppercase;
  display:inline-flex;align-items:center;gap:10px}
.estop:hover{background:rgba(127,29,29,.85);color:#fff}
.estop:active{transform:scale(.97)}
.estop:focus-visible{outline:3px solid #FCA5A5;outline-offset:3px}
.estop svg{width:22px;height:22px;color:#F87171}
.estop:hover svg{color:#fff}
html[data-tema="sol"] .estop{background:#fff;color:#991B1B;border-color:#991B1B;box-shadow:none}

/* visor del corte */
.visor{position:relative;aspect-ratio:16/9;border-radius:var(--radio);overflow:hidden;background:#0F172A;isolation:isolate}
.visor canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.chip{position:absolute;transform:translate(-50%,-50%);display:flex;align-items:center;gap:6px;padding:5px 10px 5px 8px;border-radius:999px;
  background:rgba(2,6,23,.72);border:1px solid rgba(148,163,184,.35);backdrop-filter:blur(6px);color:#F8FAFC;white-space:nowrap;
  font:600 .8rem Inter,sans-serif;pointer-events:none}
.chip b{font:700 1.15rem/1 "Barlow Condensed",sans-serif}
.chip i{width:9px;height:9px;border-radius:50%;display:inline-block}
.visor .etiqueta-fase{position:absolute;left:14px;top:14px;padding:7px 12px;border-radius:999px;background:rgba(2,6,23,.72);
  border:1px solid rgba(255,106,43,.5);color:#FFEDD5;font:600 .78rem Inter,sans-serif;letter-spacing:.08em;text-transform:uppercase}
.visor .ssr{position:absolute;right:14px;bottom:14px;display:flex;align-items:center;gap:8px;padding:7px 12px;border-radius:999px;
  background:rgba(2,6,23,.72);border:1px solid rgba(148,163,184,.35);color:#E2E8F0;font:600 .78rem Inter,sans-serif}
.led{width:10px;height:10px;border-radius:50%;background:#334155;box-shadow:inset 0 0 0 1px rgba(255,255,255,.15)}
.led.on{background:var(--brasa);box-shadow:0 0 12px 2px rgba(255,59,0,.9)}
.visor .vitrina-btn{position:absolute;right:14px;top:14px;min-height:44px}
.visor.vitrina{position:fixed;inset:0;z-index:80;border-radius:0;aspect-ratio:auto;background:#000}
.visor.vitrina canvas{object-fit:contain}

/* tarjetas de sondas */
.sonda{position:relative;overflow:hidden;padding:16px 16px 14px}
.sonda .valor{font:700 3.4rem/1 "Barlow Condensed",sans-serif;font-variant-numeric:tabular-nums}
.sonda .unidad{font:600 1.2rem "Barlow Condensed",sans-serif;color:var(--texto-2);margin-left:2px}
.sonda .acento{position:absolute;left:0;top:0;bottom:0;width:4px}
.sonda .pista{height:8px;border-radius:99px;background:var(--fondo);position:relative;overflow:hidden;margin-top:12px}
.sonda .pista .relleno{position:absolute;left:0;top:0;bottom:0;border-radius:99px;transition:width .6s}
.sonda .pista .banda{position:absolute;top:0;bottom:0;background:rgba(255,255,255,.18);border-left:1px solid rgba(255,255,255,.5);border-right:1px solid rgba(255,255,255,.5)}
html[data-tema="sol"] .sonda .pista .banda{background:rgba(0,0,0,.18);border-color:#000}
.sonda.falla{border-color:var(--peligro)}
.sonda.falla .valor{color:var(--peligro)}

/* fases */
.fases{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.fase{position:relative;min-height:calc(var(--toque) + 30px);text-align:left;padding:12px;border-radius:14px;border:1px solid var(--borde);
  background:var(--fondo);color:var(--texto-2);cursor:pointer}
.fase .n{font:700 .74rem Inter,sans-serif;letter-spacing:.12em;text-transform:uppercase}
.fase .t{display:block;margin-top:4px;font:600 1.02rem/1.15 "Barlow Condensed",sans-serif;color:var(--texto)}
.fase .d{display:block;margin-top:2px;font-size:.74rem}
.fase[aria-current="step"]{border-color:var(--brasa-2);background:linear-gradient(180deg,rgba(255,59,0,.16),rgba(255,59,0,.04));color:#FED7AA}
html[data-tema="sol"] .fase[aria-current="step"]{background:#FFEDD5;color:#000;border-width:3px}
.fase.hecha{opacity:.65}
.fase .progreso{position:absolute;left:10px;right:10px;bottom:7px;height:3px;border-radius:9px;background:rgba(255,255,255,.08);overflow:hidden}
.fase .progreso span{display:block;height:100%;background:var(--ambar);width:0}

/* deslizador grande */
input[type=range].potencia{width:100%;height:var(--toque);background:transparent;-webkit-appearance:none;appearance:none}
input[type=range].potencia::-webkit-slider-runnable-track{height:14px;border-radius:99px;background:linear-gradient(90deg,var(--ambar),var(--brasa));}
input[type=range].potencia::-moz-range-track{height:14px;border-radius:99px;background:linear-gradient(90deg,var(--ambar),var(--brasa))}
input[type=range].potencia::-webkit-slider-thumb{-webkit-appearance:none;width:44px;height:44px;margin-top:-15px;border-radius:50%;background:#fff;border:4px solid var(--brasa);box-shadow:0 4px 14px rgba(0,0,0,.5)}
input[type=range].potencia::-moz-range-thumb{width:38px;height:38px;border-radius:50%;background:#fff;border:4px solid var(--brasa)}
input[type=range].potencia:disabled{opacity:.35}

/* PWM: ventana del ciclo */
.ciclo{position:relative;height:14px;border-radius:99px;background:var(--fondo);overflow:hidden;border:1px solid var(--borde)}
.ciclo .on{position:absolute;left:0;top:0;bottom:0;background:linear-gradient(90deg,var(--brasa),var(--ambar));opacity:.85}

/* formularios */
.campo label{display:block;margin-bottom:6px;font-size:.82rem;color:var(--texto-2);font-weight:500}
.campo input,.campo select{width:100%;min-height:var(--toque);border-radius:14px;border:1px solid var(--borde-2);background:var(--fondo);
  color:var(--texto);padding:0 14px;font:600 1.15rem "Barlow Condensed",sans-serif}
.cortes{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.cortes label{display:flex;flex-direction:column;justify-content:center;min-height:var(--toque);padding:8px 10px;border-radius:14px;border:1px solid var(--borde);
  background:var(--fondo);cursor:pointer;font-weight:600;font-size:.92rem}
.cortes input{position:absolute;opacity:0}
.cortes label:has(input:checked){border-color:var(--brasa-2);background:rgba(255,59,0,.1)}
.cortes label:has(input:focus-visible){outline:3px solid var(--ambar)}
.cortes small{font-weight:400;color:var(--texto-3);font-size:.74rem}

/* alarmas */
.alarma{border-radius:16px;padding:14px 16px;display:flex;gap:12px;align-items:flex-start;border:1px solid}
.alarma.critica{background:rgba(239,68,68,.14);border-color:var(--peligro);color:#FECACA}
.alarma.aviso{background:rgba(255,176,32,.10);border-color:var(--ambar);color:#FDE68A}
.alarma.info{background:rgba(56,189,248,.08);border-color:var(--boveda);color:#BAE6FD}
html[data-tema="sol"] .alarma{color:#000}
.mantener{position:relative;overflow:hidden}
.mantener .carga{position:absolute;left:0;top:0;bottom:0;width:0;background:rgba(255,255,255,.25)}

/* gráfica */
.uplot{font-family:Inter,sans-serif}
.u-legend{font-size:.8rem;color:var(--texto-2)}
.u-legend .u-marker{border-radius:3px}

/* bitácora */
.bitacora li{display:grid;grid-template-columns:auto 1fr;gap:10px;padding:8px 0;border-bottom:1px solid var(--borde);font-size:.86rem;color:var(--texto-2)}
.bitacora time{font:600 .9rem "Barlow Condensed",sans-serif;color:var(--texto-3)}

dialog{border:1px solid var(--borde-2);border-radius:20px;background:var(--panel);color:var(--texto);padding:22px;max-width:min(92vw,460px)}
dialog::backdrop{background:rgba(2,6,23,.7);backdrop-filter:blur(3px)}

.conexion{display:inline-flex;align-items:center;gap:8px;font-size:.8rem;color:var(--texto-2)}
.conexion .led.ok{background:var(--alimento);box-shadow:0 0 10px rgba(52,211,153,.7)}
.conexion .led.mal{background:var(--peligro)}

@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
.fases li{display:flex}
.fases li > .fase{width:100%}
@media (max-width:640px){
  .fases{grid-template-columns:repeat(2,1fr)}
  .chip{font-size:.7rem;padding:3px 8px 3px 6px}
  .chip b{font-size:.98rem}
  .visor .etiqueta-fase{font-size:.68rem;left:10px;top:10px}
  .visor .ssr{right:10px;bottom:10px;font-size:.7rem}
  .visor .vitrina-btn{right:10px;top:auto;bottom:10px;left:10px;width:auto;min-height:40px;padding:0 12px;font-size:.85rem;right:auto}
  .sonda .valor{font-size:2.8rem}
}
.consigna-fila{display:grid;grid-template-columns:repeat(2,minmax(44px,var(--toque))) 1fr repeat(2,minmax(44px,var(--toque)));gap:8px;align-items:center}
.consigna-fila .btn{padding:0;width:100%}
.consigna-fila > div{text-align:center;min-width:0}
.visor .vitrina-btn{padding:0 14px}
@media (max-width:640px){.visor .vitrina-btn{left:auto;right:10px;top:10px;bottom:auto;min-height:40px;width:40px;padding:0}}
.uplot .u-over,.uplot .u-under{background:transparent}

/* ---- corte: capas de foto compuestas por la GPU (opacidad), sin repintar ---- */
.capas{position:absolute;inset:0}
.capa{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;will-change:opacity}
.capa-piedras{opacity:var(--r);transition:opacity 1.6s linear}
.grupo-resist{position:absolute;inset:0;opacity:calc(var(--e) * (0.92 + 0.08 * var(--pulso)));will-change:opacity;transition:opacity .4s linear}
.capa-todo{opacity:var(--r);transition:opacity 1.6s linear}
/* calima: sólo la franja entre el lecho y la olla, filtro estático cuyo ruido se desplaza */
.calima{position:absolute;inset:0;clip-path:inset(var(--cal-y0,44%) var(--cal-x1,27%) var(--cal-y1,44%) var(--cal-x0,27%));
  opacity:clamp(0, calc((var(--r) - 0.15) * 1.6), 1);filter:url(#calima);pointer-events:none}
/* brasas: dos copias de la textura, en screen, con bucles de duración prima */
.brasas{position:absolute;inset:0;overflow:hidden;pointer-events:none;mix-blend-mode:screen;opacity:calc(var(--r) * (0.45 + 0.4 * var(--e)));
  -webkit-mask-image:radial-gradient(ellipse 34% 46% at 50% 52%,#000 45%,transparent 78%);mask-image:radial-gradient(ellipse 34% 46% at 50% 52%,#000 45%,transparent 78%)}
.brasas span{position:absolute;left:0;right:0;top:0;height:200%;background:url(/static/img/escena/brasas.webp) repeat-y center/100% 50%;will-change:transform}
.brasas span:nth-child(1){animation:subir 7.3s linear infinite}
.brasas span:nth-child(2){animation:subir 11.7s linear infinite;opacity:.6;transform:scaleX(-1)}
@keyframes subir{from{transform:translate3d(0,0,0)}to{transform:translate3d(0,-50%,0)}}
.brasas span:nth-child(2){animation-name:subir2}
@keyframes subir2{from{transform:scaleX(-1) translate3d(0,0,0)}to{transform:scaleX(-1) translate3d(0,-50%,0)}}
.capas canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.parada-velo{position:absolute;inset:0;background:rgba(127,29,29,.22);pointer-events:none}
@media (prefers-reduced-motion:reduce){.brasas span{animation:none}.calima{display:none}}
/* correcciones del gate de diseño (18/10/2026) */
.logo-sol{display:none}
html[data-tema="sol"] .logo-noche{display:none}
html[data-tema="sol"] .logo-sol{display:block}
.consigna-num{text-align:center;white-space:nowrap;min-width:0}
.consigna-num .num:first-child{font-size:2.25rem}
.consigna-num .num:last-child{font-size:1.05rem}
.boton-fase{flex:1 1 260px;white-space:nowrap}
.boton-pausa{flex:0 1 auto}
@media (max-width:640px){
  .consigna-fila{grid-template-columns:44px 44px 1fr 44px 44px;gap:6px}
  .consigna-num .num:first-child{font-size:1.8rem}
  .boton-fase{flex-basis:100%;font-size:.95rem}
  .boton-pausa{flex:1 1 100%}
  .visor .vitrina-btn{width:44px;min-height:44px}
}
.calc-res dd{white-space:nowrap}
.resumen-toque{min-height:var(--toque);display:flex;align-items:center;list-style-position:inside}
@media (max-width:640px){.calc-res dd{font-size:1.2rem}}
/* notas de la corrida: autoguardado (regla H del gate) */
.nota-estado{font-size:.72rem;color:var(--texto-3);font-weight:400;margin-left:6px}
textarea.nota{width:100%;min-height:var(--toque);border-radius:14px;border:1px solid var(--borde-2);background:var(--fondo);color:var(--texto);
  padding:12px 14px;font:400 1rem/1.4 Inter,sans-serif;resize:none;overflow:hidden;field-sizing:content}

/* ---- panel público (OLA 2): mismas variables de :root, tablero propio ---- */
body.publico{max-width:100vw;overflow-x:hidden}
.selector-unidad{position:fixed;top:14px;right:84px;z-index:60;display:inline-flex;align-items:center;justify-content:center;
  min-height:44px;min-width:44px;padding:0 12px;border-radius:999px;border:1px solid var(--borde-2);
  background:color-mix(in srgb,var(--panel) 85%,transparent);backdrop-filter:blur(8px);color:var(--texto);
  font:700 .85rem/1 "Barlow Condensed",sans-serif;text-decoration:none;cursor:pointer}
.logo-publico{height:40px;width:auto}
/* panel público, ronda 4: maquetación propia (la página pública no carga Tailwind).
   Las fotos de Gemini son fondo sugestivo y difuso, nunca la imagen principal (Roberto, 19/10/2026). */
.pub-cab,.pub-main,.pub-pie{max-width:1180px;margin:0 auto;padding-left:16px;padding-right:16px}
.pub-cab{padding-top:16px;padding-bottom:10px;padding-right:210px}
.pub-main{padding-bottom:24px}
.pub-pie{padding-bottom:32px;font-size:.75rem;color:var(--texto-3)}
.publico .pub-fondo{position:fixed;inset:-40px;z-index:-1;pointer-events:none;background:url(/static/img/escena/pozo-amanecer.webp) center/cover;
  filter:blur(36px) saturate(1.1);opacity:.22}
.pub-hero{position:relative;border-radius:24px;overflow:hidden;border:1px solid var(--borde);background:#0B1120;isolation:isolate}
.publico .visor{aspect-ratio:16/8;border-radius:0}
.pub-hero-reposo{position:absolute;inset:0;z-index:0;opacity:0;transition:opacity 1.2s}
.pub-hero-reposo img{position:absolute;inset:-30px;width:calc(100% + 60px);height:calc(100% + 60px);object-fit:cover;
  filter:blur(14px) brightness(.55) saturate(.8);transform:scale(1.04)}
.pub-hero[data-estado="reposo"] .pub-hero-reposo{opacity:1}
.pub-hero[data-estado="reposo"] .visor{opacity:0}
.pub-hero[data-estado="reposo"] .brasas,.pub-hero[data-estado="reposo"] canvas{opacity:0}
.pub-hero .visor{transition:opacity 1.2s;position:relative;z-index:1}
.pub-hero-txt{position:absolute;left:0;right:0;bottom:0;z-index:6;padding:90px 28px 26px;color:#F8FAFC;
  background:linear-gradient(180deg,transparent,rgba(2,6,23,.72) 45%,rgba(2,6,23,.95))}
.pub-hero[data-estado="reposo"] .pub-hero-txt{top:0;display:flex;flex-direction:column;justify-content:center;background:radial-gradient(80% 90% at 30% 60%,rgba(2,6,23,.55),transparent)}
.pub-kicker{margin:0;font:600 .78rem Inter,sans-serif;letter-spacing:.16em;text-transform:uppercase;color:var(--ambar)}
.pub-titulo{margin:6px 0 4px;font:700 clamp(2rem,5vw,3.4rem)/1 "Barlow Condensed",sans-serif;color:#fff}
.pub-frase{margin:0;max-width:56ch;font-size:1rem;color:#E2E8F0;opacity:.9}
.pub-cuenta{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap;margin:12px 0 0}
.pub-cuenta[hidden]{display:none}
.pub-cuenta b{font:700 clamp(3rem,9vw,6rem)/.9 "Barlow Condensed",sans-serif;color:#FFEDD5;text-shadow:0 0 40px rgba(255,106,43,.45)}
.pub-cuenta span{font:500 1.05rem Inter,sans-serif;color:#FED7AA}
.demo-badge{display:inline-block;margin:12px 0 0;padding:4px 10px;border-radius:999px;border:1px solid var(--ambar);align-self:flex-start;
  color:var(--ambar);font:600 .72rem Inter,sans-serif;text-transform:uppercase;letter-spacing:.1em}
.pub-linea{list-style:none;margin:16px 0 0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.pub-linea[hidden]{display:none}
.pub-fase{padding:12px 12px 10px;border-radius:14px;background:var(--panel);border:1px solid var(--borde);position:relative;overflow:hidden}
.pub-fase small{display:block;min-height:1em;font:600 .68rem Inter,sans-serif;letter-spacing:.12em;text-transform:uppercase;color:var(--texto-3)}
.pub-fase strong{display:block;font:600 1.25rem "Barlow Condensed",sans-serif;color:var(--texto-2);margin-top:2px}
.pub-fase em{font-style:normal;font:500 .8rem Inter,sans-serif;color:var(--texto-3)}
.pub-fase.hecha strong{color:var(--texto)}
.pub-fase.hecha::after{content:"✓";position:absolute;right:12px;top:10px;color:var(--alimento);font-weight:700}
.pub-fase.ahora{border-color:var(--brasa-2);background:linear-gradient(180deg,rgba(255,106,43,.16),var(--panel))}
.pub-fase.ahora strong{color:var(--texto)}.pub-fase.ahora small{color:var(--brasa-2)}
.pub-fase .barra{position:absolute;left:0;bottom:0;height:4px;width:0;background:linear-gradient(90deg,var(--brasa),var(--ambar));transition:width 1s}
.pub-temps{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:14px}
.sonda-pub{padding:16px 18px;border-radius:18px;background:linear-gradient(180deg,var(--panel-2),var(--panel));border:1px solid var(--borde);
  display:grid;grid-template-columns:auto 1fr;gap:14px;align-items:center}
.sonda-pub svg{width:78px;height:78px}
.sonda-pub .aro-fondo{fill:none;stroke:var(--borde);stroke-width:9}
.sonda-pub .aro{fill:none;stroke-width:9;stroke-linecap:round;transition:stroke-dasharray 1s}
.sonda-pub .rotulo{display:block;font:600 .7rem Inter,sans-serif;letter-spacing:.12em;text-transform:uppercase;color:var(--texto-2)}
.sonda-pub .valor{font:700 2.8rem/1 "Barlow Condensed",sans-serif;color:var(--texto)}
.sonda-pub .unidad-t{font:600 1rem "Barlow Condensed",sans-serif;color:var(--texto-2);margin-left:2px;vertical-align:top}
.sonda-pub .tend{display:block;font:500 .8rem Inter,sans-serif;color:var(--texto-3);margin-top:2px}
.pub-sec{margin-top:22px;padding:22px;border-radius:20px;background:var(--panel);border:1px solid var(--borde);position:relative;overflow:hidden}
.pub-sec[hidden]{display:none}
.pub-sec h2{margin:0 0 4px;font:700 1.6rem "Barlow Condensed",sans-serif;letter-spacing:.02em}
.pub-sec p.s{margin:0 0 14px;color:var(--texto-2);font-size:.92rem}
.pub-curva{min-height:200px}
.pub-historia{padding:0;min-height:320px;display:flex;align-items:flex-end}
.pub-historia-fondo{position:absolute;inset:-30px;width:calc(100% + 60px);height:calc(100% + 60px);object-fit:cover;z-index:0;
  filter:blur(10px) brightness(.42) saturate(.9);transform:scale(1.05)}
.pub-historia-txt{position:relative;z-index:1;padding:30px;max-width:640px;
  background:linear-gradient(90deg,rgba(2,6,23,.55),transparent)}
.pub-historia h2{font-size:2.1rem;color:#fff}
.pub-historia p{color:#E2E8F0;line-height:1.6;font-size:1rem}
.pub-compartir{display:inline-flex;align-items:center;gap:10px;min-height:52px;padding:0 22px;margin-top:8px;border-radius:999px;border:0;cursor:pointer;
  background:linear-gradient(180deg,#FF7A3D,#E8460C);color:#fff;font:600 1rem Inter,sans-serif;box-shadow:0 12px 30px -12px rgba(255,90,30,.8)}
.pub-compartir svg{width:20px;height:20px}
.pub-compartir:focus-visible{outline:3px solid #FDBA74;outline-offset:3px}
.conexion-pub{display:flex;align-items:center;gap:8px;margin-top:14px;font-size:.78rem;color:var(--texto-2)}
.conexion-pub .led.ok{background:var(--alimento);box-shadow:0 0 10px rgba(52,211,153,.7)}
.conexion-pub .led.mal{background:var(--peligro)}
.selector-unidad{right:96px}
html{background:var(--fondo)}
body{min-height:100vh}
a.selector-idioma{text-decoration:none}
@media (max-width:760px){
  .publico .visor{aspect-ratio:4/5}
  .pub-hero-txt{padding:70px 18px 18px}
  .pub-linea{grid-template-columns:repeat(2,1fr)}
  .pub-temps{grid-template-columns:1fr}
  .pub-historia-txt{padding:22px 18px}
  .pub-cab{padding-right:160px}
}
.selector-engrane{position:fixed;top:14px;right:150px;z-index:60;display:inline-flex;align-items:center;justify-content:center;
  width:44px;height:44px;border-radius:999px;border:1px solid var(--borde-2);background:color-mix(in srgb,var(--panel) 85%,transparent);
  backdrop-filter:blur(8px);color:var(--texto-2)}
.selector-engrane svg{width:20px;height:20px}
.selector-engrane:hover{color:var(--texto)}
.pub-historia .pub-kicker{color:var(--ambar)}
.sonda-pub .valor+.unidad-t{vertical-align:top}
.sonda-pub[data-sin="1"] .unidad-t{display:block;margin:4px 0 0;vertical-align:baseline;font:500 .85rem Inter,sans-serif}
.sonda-pub[data-sin="1"] .valor{display:none}
/* ronda 4 (Roberto): nada brinca. Cifras de ancho fijo y la tendencia en su propio renglón, siempre presente. */
.valor,.chip b,.pub-cuenta b,.pub-fase small,[id^="t-"],.cifra{font-variant-numeric:tabular-nums}
.sonda-pub .tend{min-height:1.2em}
.sonda-pub .valor{display:inline-block;min-width:2.6ch}