:root{
  --bg-top:#1C4382;--bg-mid:#12305F;--bg-bot:#0A1A38;--halo:#3A6FC4;
  --txt:#FFFFFF;--txt-2:#C4D6EE;--txt-3:#9FB5D4;
  --live:#5EF0C3;--live-2:#A6F5DA;--line:#7FD0FF;--warn:#FFC857;--warn-txt:#FFE2A6;
  --sep:rgba(255,255,255,.13);
  /* Acotada: en algunos iPhone la zona segura informa 70-95 pt abajo en vez de 34 (pasó en Fogón). */
  --safe-b:min(env(safe-area-inset-bottom,0px),34px);--safe-t:min(env(safe-area-inset-top,0px),64px);
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;min-height:100%}
body{min-height:100dvh}
html{background-color:var(--bg-bot)}
/* El fondo vive en una capa fija: Safari de iPhone ignora background-attachment:fixed
   y el degradé se cortaba al hacer scroll. */
body::before{content:"";position:fixed;inset:-1px;z-index:-1;pointer-events:none;
  background:radial-gradient(90% 40% at 80% 0%,var(--halo) 0%,rgba(58,111,196,0) 60%),linear-gradient(180deg,var(--bg-top) 0%,var(--bg-mid) 40%,var(--bg-bot) 100%)}
body{
  font-family:Inter,-apple-system,system-ui,sans-serif;color:var(--txt);background:transparent;
  -webkit-font-smoothing:antialiased;
}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;cursor:pointer}
.num{font-variant-numeric:tabular-nums;letter-spacing:-.02em}
.screen{max-width:480px;margin:0 auto;padding:calc(var(--safe-t) + 18px) 16px calc(var(--safe-b) + 112px);display:flex;flex-direction:column;gap:18px}

.glass{background:linear-gradient(160deg,rgba(255,255,255,.17),rgba(255,255,255,.05));border:1px solid rgba(255,255,255,.2);box-shadow:inset 0 1px 0 rgba(255,255,255,.28),0 12px 30px rgba(3,10,30,.35);backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px)}
.tile{display:flex;align-items:center;justify-content:center;flex-shrink:0;color:#fff;background:linear-gradient(145deg,#6CC4FF 0%,#2F7BF5 55%,#1B55D6 100%);box-shadow:inset 0 1px 0 rgba(255,255,255,.55),inset 0 -2px 6px rgba(10,30,90,.35),0 6px 16px rgba(29,108,240,.5)}
.tile.off{background:linear-gradient(145deg,#8A9BB5 0%,#56677F 100%);box-shadow:inset 0 1px 0 rgba(255,255,255,.4),0 4px 10px rgba(0,0,0,.25);color:#E9EEF5}
.tile.ok{background:linear-gradient(145deg,#8FF5D2 0%,#22C08F 100%);box-shadow:inset 0 1px 0 rgba(255,255,255,.55),0 6px 14px rgba(34,192,143,.45);color:#063B2B}
.tile.warn{background:linear-gradient(145deg,#FFD98A 0%,#F2A31B 100%);box-shadow:inset 0 1px 0 rgba(255,255,255,.55),0 6px 14px rgba(242,163,27,.45);color:#4A2C00}
.t46{width:46px;height:46px;border-radius:15px}.t40{width:40px;height:40px;border-radius:13px}.t30{width:30px;height:30px;border-radius:10px}

.head{border-radius:26px;padding:18px;display:flex;align-items:center;gap:12px}
.head h1{margin:0;font-size:30px;font-weight:800;letter-spacing:-.02em}
.head .sub{font-size:15px;color:var(--txt-2)}
.iconbtn{width:46px;height:46px;border-radius:15px;display:flex;align-items:center;justify-content:center;position:relative;border:0}
.avatar{width:52px;height:52px;border-radius:50%;background:linear-gradient(145deg,#F2F6FC,#B9C9E2);border:2px solid rgba(255,255,255,.7);display:flex;align-items:center;justify-content:center;color:#1B3F78;font-weight:800;font-size:17px;flex-shrink:0}
.dot-badge{position:absolute;top:11px;right:12px;width:8px;height:8px;border-radius:50%;background:#FF5A6E;box-shadow:0 0 0 2px #2A4F8C}

.row-title{display:flex;align-items:baseline;justify-content:space-between;padding:0 4px}
.row-title h2{margin:0;font-size:22px;font-weight:700}
.livecount{font-size:13px;color:var(--txt-2);display:flex;align-items:center;gap:7px}
.pulse{position:relative;width:8px;height:8px;display:inline-block}
.pulse::before,.pulse::after{content:"";position:absolute;inset:0;border-radius:50%;background:var(--live)}
.pulse::before{animation:latido 1.8s ease-out infinite}
.pulse.off::before,.pulse.off::after{background:#8A9BB5;animation:none}
@keyframes latido{0%{transform:scale(1);opacity:.6}100%{transform:scale(2.4);opacity:0}}

.carousel{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;margin:0 -16px;padding:2px 16px 8px;scrollbar-width:none}
.carousel::-webkit-scrollbar{display:none}
.livecard{flex:0 0 240px;scroll-snap-align:start;border-radius:24px;padding:16px;display:flex;flex-direction:column;gap:14px}
.livecard .top{display:flex;align-items:center;gap:12px}
.livecard .name{font-size:16px;font-weight:700}
.livecard .small{font-size:13px;color:var(--txt-2)}
.livecard .bottom{display:flex;align-items:flex-end;justify-content:space-between;border-top:1px solid var(--sep);padding-top:12px}
.big{font-size:34px;font-weight:700;line-height:1}
.empty-live{border-radius:24px;padding:18px;display:flex;align-items:center;gap:14px;font-size:14px;color:var(--txt-2)}

.grid2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.stat{border-radius:22px;padding:14px 15px;display:flex;flex-direction:column;gap:8px;min-width:0}
.stat .lbl{display:flex;justify-content:space-between;align-items:center;font-size:14.5px;font-weight:600}
.stat .val{font-size:28px;font-weight:700;line-height:1.05}
.stat .cap{font-size:12px;color:var(--txt-2)}
.sys{border-radius:22px;padding:14px 15px;display:flex;align-items:center;gap:11px;min-width:0;border:0;text-align:left;width:100%}
.sys.dim{opacity:.8}
.sys .n{font-size:14px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sys .s{font-size:12px;color:var(--txt-2)}
.sys .count{margin-left:auto;font-size:20px;font-weight:700;color:var(--line)}

.pill{align-self:center;height:46px;padding:0 22px;border-radius:999px;display:flex;align-items:center;gap:8px;font-size:15.5px;font-weight:600}
.alert{border-radius:18px;padding:12px 14px;display:flex;align-items:center;gap:10px;font-size:13.5px;color:var(--warn-txt);background:rgba(255,200,87,.1);border:1px solid rgba(255,200,87,.3)}

.list{border-radius:24px;display:flex;flex-direction:column;overflow:hidden}
.item{display:flex;align-items:center;gap:12px;padding:12px 14px;border-bottom:1px solid var(--sep)}
.item:last-child{border-bottom:0}
.item .main{display:flex;flex-direction:column;gap:2px;flex-grow:1;min-width:0}
.item .t{font-size:15px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.item .d{font-size:12.5px;color:var(--txt-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.item .when{font-size:12px;color:var(--txt-2);flex-shrink:0}
.person{position:relative;width:42px;height:42px;border-radius:50%;background:linear-gradient(145deg,#F2F6FC,#B9C9E2);color:#1B3F78;font-weight:800;font-size:14px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.person i{position:absolute;right:-1px;bottom:0;width:12px;height:12px;border-radius:50%;background:var(--live);border:2px solid #234A86}
.person.away{background:linear-gradient(145deg,#C9D3E2,#8D9DB6);color:#23395E}
.person.away i{background:var(--warn)}
.muted{color:var(--txt-2);font-size:14px;padding:16px;text-align:center}

.back{display:flex;align-items:center;gap:12px}
.back h1{margin:0;font-size:22px;font-weight:800}
.back .st{font-size:13px;color:var(--live-2)}
.back .st.off{color:var(--txt-3)}
.chips3{display:flex;gap:8px}
.chips3 .glass{flex:1;border-radius:16px;padding:10px 12px;display:flex;flex-direction:column}
.chips3 b{font-size:20px}
.chips3 span{font-size:12px;color:var(--txt-2)}

.filters{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none}
.filters button{height:38px;padding:0 16px;border-radius:999px;font-size:13.5px;font-weight:500;white-space:nowrap}
.filters button[aria-pressed="true"]{background:linear-gradient(145deg,#FFFFFF,#DCE7F7);color:#12305F;font-weight:700;border:0;box-shadow:0 6px 14px rgba(0,0,0,.25)}

.switchrow{border-radius:22px;padding:14px 16px;display:flex;align-items:center;gap:12px;width:100%;border:0;text-align:left}
.switch{width:50px;height:30px;border-radius:999px;background:rgba(255,255,255,.18);position:relative;flex-shrink:0;transition:background .2s}
.switch::after{content:"";position:absolute;left:3px;top:3px;width:24px;height:24px;border-radius:50%;background:#fff;box-shadow:0 2px 6px rgba(0,0,0,.3);transition:transform .2s}
[aria-checked="true"] .switch{background:linear-gradient(145deg,#6CC4FF,#2F7BF5)}
[aria-checked="true"] .switch::after{transform:translateX(20px)}



/* Entrar: claro y suave */
html:has(body.claro){background-color:#E2EAF9}
body.claro::before{background:linear-gradient(180deg,#EDF2FC 0%,#E2EAF9 100%)}
body.claro{color:#0B1430}
.login{max-width:440px;margin:0 auto;min-height:100dvh;padding:calc(var(--safe-t) + 56px) 26px calc(var(--safe-b) + 28px);display:flex;flex-direction:column;align-items:center;gap:22px;position:relative;overflow:hidden}
.blob{position:absolute;border-radius:50%;pointer-events:none}
.soft{background:linear-gradient(160deg,#F7FAFF,#E6EEFB);border:1px solid rgba(255,255,255,.9);box-shadow:-6px -6px 14px rgba(255,255,255,.9),8px 10px 22px rgba(70,100,170,.18)}
.logo{width:140px;height:140px;border-radius:40px;display:flex;align-items:center;justify-content:center;position:relative}
.login h1{margin:0;font-size:34px;font-weight:800;letter-spacing:-.025em;text-align:center}
.tag{margin:0;font-size:12.5px;letter-spacing:.32em;text-transform:uppercase;color:#4A5878;text-align:center}
.field{height:60px;border-radius:20px;display:flex;align-items:center;gap:14px;padding:0 18px;color:#4A5878;width:100%}
.field input{flex:1;border:0;background:transparent;font:500 16px Inter,sans-serif;color:#0B1430;outline:none;min-width:0}
.field:focus-within{box-shadow:0 0 0 3px rgba(29,79,224,.35),8px 10px 22px rgba(70,100,170,.18)}
.cta{width:100%;height:62px;border-radius:22px;border:0;background:linear-gradient(180deg,#4C8DFF 0%,#1D4FE0 100%);box-shadow:inset 0 1px 0 rgba(255,255,255,.5),0 14px 28px rgba(29,79,224,.4);color:#fff;font-size:19px;font-weight:700;display:flex;align-items:center;justify-content:center;position:relative}
.cta:disabled{opacity:.6}
.cta .arrow{position:absolute;right:10px;width:42px;height:42px;border-radius:50%;background:rgba(255,255,255,.2);display:flex;align-items:center;justify-content:center}
.or{display:flex;align-items:center;gap:12px;width:100%;color:#4A5878;font-size:11.5px;letter-spacing:.28em}
.or::before,.or::after{content:"";flex:1;height:1px;background:#B6C4E0}
.square{width:72px;height:72px;border-radius:22px;display:flex;align-items:center;justify-content:center;border:0}
.err{color:#B42318;font-size:14px;text-align:center;min-height:20px;margin:0}
.foot{margin-top:auto;font-size:12px;color:#4A5878}
.form{width:100%;display:flex;flex-direction:column;gap:14px}

@media (prefers-reduced-motion:reduce){.pulse::before{animation:none}*{transition:none!important}}
.screen.yo{min-height:100dvh}
.firma{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;color:var(--txt-2);font-size:14px;letter-spacing:.02em}
.firma img{height:40px;width:auto}
.firma .escala{margin-top:6px;font-size:13px;color:var(--txt-3)}
.firma .escala b{color:var(--live);font-weight:700}

a.stat{color:inherit}
.grid2 .stat{min-height:118px}

/* Entrada de pantalla */
.entra{animation:subir .6s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(var(--i,0) * 60ms)}
@keyframes subir{from{opacity:0;transform:translateY(14px);filter:blur(6px)}to{opacity:1;transform:none;filter:none}}
.letra{display:inline-block;animation:letra .5s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(var(--l) * 28ms)}
@keyframes letra{from{opacity:0;transform:translateY(.35em);filter:blur(4px)}to{opacity:1;transform:none;filter:none}}
.esqueleto{position:relative;overflow:hidden}
.esqueleto::after{content:"";position:absolute;inset:0;background:linear-gradient(100deg,transparent 20%,rgba(255,255,255,.14) 50%,transparent 80%);transform:translateX(-100%);animation:brillo 1.4s ease-in-out infinite}
@keyframes brillo{to{transform:translateX(100%)}}
@media (prefers-reduced-motion:reduce){.entra,.letra,.esqueleto::after{animation:none}}

/* Menú ☰ */
.menu-mas{position:fixed;z-index:11;right:max(12px,calc(50% - 228px));bottom:calc(var(--safe-b) + 96px);width:230px;border-radius:24px;padding:8px;display:flex;flex-direction:column;gap:2px;transform-origin:85% 100%;animation:menu .42s cubic-bezier(.34,1.4,.5,1) both}
@keyframes menu{from{opacity:0;transform:scale(.6) translateY(24px);filter:blur(6px)}to{opacity:1;transform:none;filter:none}}
.menu-mas a{display:flex;align-items:center;gap:12px;padding:8px 10px;border-radius:16px;font-size:16px;font-weight:600;animation:subir .45s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(60ms + var(--m) * 45ms)}
.menu-mas a:active,.menu-mas a:hover{background:rgba(255,255,255,.12)}
.menu-mas .ml{flex-grow:1}
.mb{min-width:20px;height:20px;padding:0 6px;box-sizing:border-box;border-radius:999px;background:#FF5A6E;color:#fff;font-size:11px;font-weight:700;display:inline-flex;align-items:center;justify-content:center}
nav.tabs a .mb{position:absolute;top:4px;right:calc(50% - 26px);box-shadow:0 0 0 2px #163A6E}
@media (prefers-reduced-motion:reduce){.menu-mas,.menu-mas a{animation:none}}
.menu-mas{background:linear-gradient(160deg,rgba(52,92,160,.82),rgba(16,38,78,.86))}

/* ── Barra de pestañas estilo Liquid Glass (iOS 26) ───────────────────────────
   En reposo: cápsula de vidrio y la pestaña elegida con una píldora suave.
   Al tocar: la píldora se levanta como una gota de vidrio que agranda lo que
   tiene abajo (lente), se estira con la velocidad del dedo y se asienta con
   un resorte. El movimiento lo maneja app.js (física de resorte), no CSS. */
nav.tabs{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(var(--safe-b) + 14px);width:calc(100% - 28px);max-width:440px;height:66px;
  border-radius:999px;padding:0 5px;box-sizing:border-box;display:flex;align-items:center;z-index:10;
  background:linear-gradient(180deg,rgba(255,255,255,.14),rgba(255,255,255,.06));border:1px solid rgba(255,255,255,.2);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.4),inset 0 -1px 0 rgba(255,255,255,.05),0 14px 34px rgba(2,8,26,.42);
  backdrop-filter:blur(26px) saturate(190%);-webkit-backdrop-filter:blur(26px) saturate(190%);
  touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}
nav.tabs a{flex:1 1 0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;height:56px;color:rgba(235,242,252,.82);font-size:11px;font-weight:500;letter-spacing:.01em;position:relative;z-index:2;transition:color .3s}
nav.tabs a svg{transition:transform .35s cubic-bezier(.34,1.5,.5,1)}
nav.tabs a[aria-current="page"]{color:#7FD0FF;font-weight:600}
nav.tabs.levantada a{color:rgba(235,242,252,.55)}
nav.tabs .burbuja{position:absolute;left:0;top:50%;height:56px;margin-top:-28px;border-radius:999px;pointer-events:none;z-index:1;will-change:transform;
  background:rgba(255,255,255,.15);box-shadow:inset 0 0 0 .5px rgba(255,255,255,.28),inset 0 1px 0 rgba(255,255,255,.22);
  transition:background .25s,box-shadow .25s,opacity .2s;overflow:hidden}
nav.tabs .burbuja .lente{position:absolute;top:0;left:0;height:56px;display:flex;align-items:center;opacity:0;transition:opacity .18s}
nav.tabs .burbuja .lente span{flex:1 1 0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;height:56px;color:#fff;font-size:11px;font-weight:600}
nav.tabs .burbuja .lente span.sel{color:#9BDBFF}
nav.tabs .burbuja::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:0;transition:opacity .2s;
  background:radial-gradient(60% 50% at 28% 18%,rgba(255,255,255,.55),rgba(255,255,255,0) 60%),radial-gradient(70% 60% at 80% 100%,rgba(127,208,255,.28),rgba(127,208,255,0) 70%)}
nav.tabs.levantada .burbuja{background:linear-gradient(180deg,rgba(104,150,222,.9),rgba(40,78,146,.92));backdrop-filter:blur(14px) saturate(220%) brightness(1.1);-webkit-backdrop-filter:blur(14px) saturate(220%) brightness(1.1);
  box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.7),inset 3px 4px 6px rgba(255,255,255,.55),inset -3px -5px 9px rgba(0,24,70,.32),0 12px 28px rgba(2,8,26,.45),0 0 22px rgba(127,208,255,.3)}
nav.tabs.levantada .burbuja .lente,nav.tabs.levantada .burbuja::after{opacity:1}
/* Menú ☰: mismos íconos de línea que la barra. */
.menu-mas .ico{width:28px;display:flex;justify-content:center;color:#7FD0FF}
/* Levantada, la gota pasa por encima de la barra: sólo se ve lo que agranda la lente. */
nav.tabs.levantada .burbuja{z-index:3}

/* Técnico: filas que se abren */
details.exp{border-bottom:1px solid var(--sep)}
details.exp:last-child{border-bottom:0}
details.exp>summary{list-style:none;cursor:pointer;border-bottom:0}
details.exp>summary::-webkit-details-marker{display:none}
details.exp .flecha{color:var(--txt-2);transition:transform .3s cubic-bezier(.34,1.4,.5,1)}
details.exp[open] .flecha{transform:rotate(90deg)}
details.exp .det{padding:2px 16px 14px 66px;animation:subir .35s cubic-bezier(.2,.8,.2,1) both}
.det .dato{display:flex;justify-content:space-between;gap:12px;padding:6px 0;font-size:13px;border-top:1px solid rgba(255,255,255,.07)}
.det .dato span{color:var(--txt-2);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:flex;align-items:center;gap:7px}
.det .dato b{font-weight:600;text-align:right;white-space:nowrap}
.det .det-t{margin:10px 0 2px;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--txt-3)}
.det .det-n{margin:8px 0 0;font-size:12.5px;color:var(--txt-2);line-height:1.45}
.det .err{display:flex;flex-direction:column;gap:3px;padding:8px 0;border-top:1px solid rgba(255,255,255,.07)}
.det .err b{font-size:13px;font-weight:600;line-height:1.35}
.det .err span{font-size:12px;color:var(--txt-2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.punto{width:8px;height:8px;border-radius:50%;display:inline-block;flex-shrink:0}
.punto.ok{background:var(--live);box-shadow:0 0 6px var(--live)}
.punto.mal{background:var(--warn);box-shadow:0 0 6px var(--warn)}

/* Ingresos: gráfico del año */
.anual{border-radius:24px;padding:16px;display:flex;flex-direction:column;gap:14px}
.anual-tot{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;font-size:12.5px;color:var(--txt-2)}
.anual-tot b{font-size:17px;color:#fff;margin-right:4px}
.anual-tot .esp-t b{color:#BFE6FF}
.barras{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:5px;height:130px;align-items:end}
.mes{display:flex;flex-direction:column;align-items:center;gap:6px;height:100%}
.mes .col{flex:1;width:100%;display:flex;flex-direction:column;justify-content:flex-end;border-radius:7px;background:rgba(255,255,255,.06);overflow:hidden}
.mes .cob{display:block;width:100%;border-radius:7px 7px 0 0;background:linear-gradient(180deg,#9BDBFF,#2F7BF5);box-shadow:0 0 12px rgba(79,168,255,.45);transform-origin:bottom;animation:crece .7s cubic-bezier(.34,1.3,.5,1) both;animation-delay:var(--d,0ms)}
.mes .esp{display:block;width:100%;border-radius:7px 7px 0 0;background:repeating-linear-gradient(135deg,rgba(155,219,255,.32) 0 4px,rgba(155,219,255,.16) 4px 8px);border:1px solid rgba(155,219,255,.4);border-bottom:0;box-sizing:border-box}
.mes .m{font-size:10.5px;color:var(--txt-3)}
.mes.hoy .m{color:#fff;font-weight:700}
.mes.hoy .col{box-shadow:inset 0 0 0 1px rgba(255,255,255,.25)}
@keyframes crece{from{transform:scaleY(0)}to{transform:scaleY(1)}}
.leyenda{display:flex;gap:16px;font-size:12px;color:var(--txt-2)}
.leyenda i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:6px;vertical-align:-1px}
.leyenda i.cob{background:linear-gradient(180deg,#9BDBFF,#2F7BF5)}
.leyenda i.esp{background:rgba(155,219,255,.3);border:1px solid rgba(155,219,255,.5)}
@media (prefers-reduced-motion:reduce){.mes .cob{animation:none}}

/* Inicio: tarjetas que se abren */
button.stat{font:inherit;color:inherit;text-align:left;cursor:pointer;width:100%;transition:transform .2s cubic-bezier(.34,1.4,.5,1)}
button.stat:active{transform:scale(.97)}
button.stat[aria-expanded="true"]{box-shadow:inset 0 0 0 1.5px rgba(127,208,255,.6),inset 0 1px 0 rgba(255,255,255,.28),0 12px 30px rgba(3,10,30,.35)}
.segs{display:flex;gap:3px;height:16px;align-items:center;margin-top:2px}
.segs span{flex:1;height:12px;border-radius:4px;background:rgba(255,255,255,.16)}
.segs span.si{background:#6CC4FF}
.segs span.ult{height:18px;background:#A6F5DA;box-shadow:0 0 10px #5EF0C3}
.minibar{display:flex;align-items:flex-end;gap:3px;margin-top:2px}
.minibar span{flex:1;border-radius:3px;background:rgba(255,255,255,.14)}
.minibar span.con{background:rgba(127,208,255,.6)}
.minibar span.ahora{background:rgba(255,255,255,.3)}
.minibar span.ahora.con{background:#6CC4FF;box-shadow:0 0 8px #4FA8FF}
.hoy-det{border-radius:24px;padding:14px 16px;display:flex;flex-direction:column;gap:2px;animation:subir .4s cubic-bezier(.2,.8,.2,1) both}
.hd-cab{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px}
.hd-cab b{font-size:16px}
.hd-x{width:34px;height:34px;border-radius:12px;border:0;background:rgba(255,255,255,.1);color:#fff;display:flex;align-items:center;justify-content:center;transform:rotate(90deg)}
.hd-fila{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:8px 0;border-top:1px solid rgba(255,255,255,.08);font-size:14px}
.hd-t{display:flex;flex-direction:column;min-width:0}
.hd-t small{font-size:12px;color:var(--txt-2);margin-top:2px}
.hd-barra{width:84px;height:8px;border-radius:8px;background:rgba(255,255,255,.12);flex-shrink:0;overflow:hidden}
.hd-barra i{display:block;height:100%;border-radius:8px;background:linear-gradient(90deg,#2F7BF5,#9BDBFF)}
.hd-sub{margin:12px 0 2px;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--txt-3)}
.hd-graf{padding:4px 0 8px}
.hd-ejes{display:flex;justify-content:space-between;font-size:10.5px;color:var(--txt-3);margin-top:4px}
.hd-link{margin-top:10px;align-self:flex-start;display:inline-flex;align-items:center;gap:6px;font-size:13.5px;font-weight:600;color:#9BDBFF}