/* App FAT · estilo NOCTURNA (elegido por Marcos) — foto a la izquierda del header */
:root{
  color-scheme:dark;   /* controles nativos (input, checkbox, caret, scrollbar) en oscuro */
  --brand:#0EA5E9;
  --brand-deep:#23496d;
  --grad:linear-gradient(90deg,#00C9D9 0%,#1560FF 55%,#8B5CF6 100%);
  /* NOCTURNA suavizada (menos "cueva": fondos un punto más claros, texto más luminoso) */
  --scr:#101a26; --card:#1a2634;
  --ink:#eef4f9; --ink-soft:#c3cfda; --muted:#8899ab;
  --line:#2a3b4d; --chip:#12314a; --chip-ink:#8fdcff;
  --ok:#16a34a; --warn:#d97706;
  --tabbg:rgba(26,38,52,.96);
}
/* CLARA (para quien tenga el móvil en claro o lo elija en Yo) */
:root[data-theme="light"]{
  color-scheme:light;
  --scr:#f2f6fa; --card:#ffffff;
  --ink:#16283a; --ink-soft:#45596e; --muted:#7d90a3;
  --line:#dfe8f0; --chip:#e5f2fc; --chip-ink:#0369a1;
  --tabbg:rgba(255,255,255,.96);
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
/* body bloqueado: cada vista escrola por dentro → el menú inferior no se mueve
   ni rebota al llegar abajo (overscroll) ni al esconderse la barra del navegador */
html,body{margin:0;height:100%;overflow:hidden;overscroll-behavior:none}
body{
  background:var(--scr); color:var(--ink);
  font-family:'Poppins',-apple-system,'Segoe UI',Roboto,sans-serif;
  line-height:1.45; font-size:15px;
  max-width:520px; margin:0 auto;
}
button{font-family:inherit;border:none;cursor:pointer}
.hidden{display:none!important}

/* ---------- BIENVENIDA ---------- */
.welcome{
  height:100vh; height:100dvh; overflow-y:auto; overscroll-behavior:contain;
  display:flex; flex-direction:column; align-items:center;
  padding:calc(44px + env(safe-area-inset-top)) 26px 30px; text-align:center; gap:10px;
}
.wface{width:96px;height:96px;border-radius:50%;object-fit:cover;border:3px solid var(--brand)}
.welcome h1{font-size:24px;font-weight:900;margin:6px 0 0;letter-spacing:-.5px}
.wsub{color:var(--ink-soft);font-size:14px;margin:0 0 8px}
.welcome label{align-self:flex-start;font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-top:10px}
.welcome input{
  width:100%; background:var(--card); border:1.5px solid var(--brand); border-radius:13px;
  padding:13px 15px; font-size:16px; font-weight:600; color:var(--ink); font-family:inherit;
}
.welcome input:focus{outline:none;box-shadow:0 0 0 3px rgba(14,165,233,.25)}
.zgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;width:100%}
.zchip{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:12px 4px;font-size:13px;font-weight:700;color:var(--ink-soft)}
.zchip.on{background:var(--brand);border-color:var(--brand);color:#fff}
.btn-grad{
  width:100%; background:var(--grad); color:#fff; font-weight:800; font-size:16px;
  padding:14px; border-radius:14px; margin-top:14px;
}
.skip{background:none;color:var(--muted);font-size:13px;text-decoration:underline;padding:8px}
.wlegal{font-size:11px;color:var(--muted);margin-top:auto}

/* ---------- APP SHELL ---------- */
.app{height:100vh;height:100dvh;display:flex;flex-direction:column}
.view{display:none;flex:1;min-height:0;flex-direction:column;gap:12px;padding:calc(16px + env(safe-area-inset-top)) 16px calc(90px + env(safe-area-inset-bottom));overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
.view>*{flex-shrink:0}   /* la vista tiene altura fija: el contenido debe desbordar y escrolar, no comprimirse */
.view.on{display:flex}
.view-frame{padding:0 0 calc(72px + env(safe-area-inset-bottom));position:relative;background:var(--scr)}
.view-frame iframe{width:100%;flex:1;min-height:0;border:0;display:block;background:var(--scr)}
/* Consulta con la MISMA barra de cabecera que el resto de secciones (foto + nombre + campanita/perfil).
   El titular "¿En qué puedo ayudarte?" y el formulario los pinta el iframe (?app=1). */
.view-frame > .head{padding:calc(20px + env(safe-area-inset-top)) 16px 10px;flex-shrink:0}
.consulta-actions{position:absolute;top:20px;right:16px;display:flex;gap:8px;z-index:5}

.head{display:flex;align-items:flex-start;gap:11px;padding-top:4px}
.face{width:42px;height:42px;border-radius:50%;object-fit:cover;border:2px solid var(--brand);flex-shrink:0}
.hello{display:flex;flex-direction:column;flex:1;min-width:0}
.hello span{font-size:19px;font-weight:800;letter-spacing:-.3px}
.hello small{font-size:12px;color:var(--muted);font-weight:500}

.row-label{display:flex;justify-content:space-between;align-items:baseline;margin-top:4px}
.row-label b{font-size:15px;font-weight:800}
.row-label a{font-size:12px;color:var(--brand);text-decoration:none;font-weight:600;cursor:pointer}

.card{background:var(--card);border:1px solid var(--line);border-radius:15px;padding:13px}
.kicker{font-size:10px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--brand);margin-bottom:4px}
.vtitle{font-size:14px;font-weight:700;line-height:1.35}
.prog{height:5px;border-radius:99px;background:var(--line);margin-top:9px;overflow:hidden}
.prog i{display:block;height:100%;background:var(--grad);border-radius:99px}

.hscroll{display:flex;gap:10px;overflow-x:auto;scrollbar-width:none;margin:0 -16px;padding:2px 16px}
.hscroll::-webkit-scrollbar{display:none}
.mini{min-width:156px;max-width:156px;background:var(--card);border:1px solid var(--line);border-radius:13px;overflow:hidden;cursor:pointer}
.mini .th{height:88px;background:#0d3a5c center/cover no-repeat;position:relative}
.mini .th::after{content:"▶";position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:#fff;font-size:17px;text-shadow:0 1px 6px rgba(0,0,0,.6)}
.mini .dur{position:absolute;right:5px;bottom:5px;background:rgba(0,0,0,.75);color:#fff;font-size:9.5px;padding:1px 6px;border-radius:6px;font-weight:600}
/* ojo: el padding va FUERA de la caja con line-clamp (si va dentro, la 4ª línea recortada asoma por el padding) */
.mini p{font-size:12.5px;font-weight:600;line-height:1.3;margin:8px 10px 11px;padding:0;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}

.banner{background:var(--brand-deep);border-radius:15px;padding:14px 16px;color:#fff;position:relative;overflow:hidden;display:block;text-decoration:none}
.banner::before{content:"";position:absolute;right:-28px;top:-28px;width:110px;height:110px;border-radius:50%;background:rgba(255,255,255,.08)}
.banner .kicker{color:#7dd3fc}
.banner b{font-size:16px;display:block;line-height:1.25;color:#fff}
.banner span{font-size:11.5px;opacity:.8}
.banner .cta{display:inline-block;background:var(--grad);color:#fff;font-weight:700;font-size:12px;padding:8px 15px;border-radius:99px;margin-top:9px}
/* Contador "Faltan X días" del banner de evento (pastilla a la derecha del kicker) */
.banner .kicker-row{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:4px}
.banner .kicker-row .kicker{margin-bottom:0}
.banner .bn-dias{font-size:10px;font-weight:700;letter-spacing:.03em;background:rgba(255,255,255,.16);color:#fff;padding:3px 9px;border-radius:99px;white-space:nowrap;flex-shrink:0}
.banner .bn-dias.urge{background:#f1394f}
/* Banner de VÍDEO (story del finde): miniatura grande + botón play, abre el reproductor al tocar */
.banner-video{background-size:cover;background-position:center;min-height:158px;display:flex;flex-direction:column;justify-content:flex-end;cursor:pointer}
.banner-video::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.12) 0%,rgba(0,0,0,.62) 100%)}
.banner-video::before{display:none}
.banner-video>*{position:relative;z-index:1}
.banner-video .bn-play{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:2;width:56px;height:56px;border-radius:50%;background:rgba(255,255,255,.94);color:#23496d;font-size:20px;display:flex;align-items:center;justify-content:center;padding-left:4px;box-shadow:0 6px 20px rgba(0,0,0,.35)}
/* Reproductor a pantalla completa de la story */
.vstory-ov{position:fixed;inset:0;z-index:9999;background:rgba(0,0,0,.93);display:none;align-items:center;justify-content:center}
.vstory-ov.on{display:flex}
.vstory-vid{max-width:100%;max-height:100%;width:auto;background:#000}
.vstory-x{position:absolute;top:calc(env(safe-area-inset-top,0px) + 12px);right:16px;width:40px;height:40px;border-radius:50%;border:none;background:rgba(255,255,255,.16);color:#fff;font-size:18px;cursor:pointer;z-index:2}
/* Banner EN DIRECTO (rojo, punto parpadeante) */
.banner.directo{background:linear-gradient(135deg,#f1394f,#c11226)}
.banner.directo .kicker-live{display:flex;align-items:center;gap:7px;color:#fff;font-size:11px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;margin-bottom:4px}
.bn-live-dot{position:relative;width:9px;height:9px;border-radius:50%;background:#fff;flex-shrink:0}
.bn-live-dot::after{content:"";position:absolute;inset:0;border-radius:50%;background:#fff;animation:bnlive 1.5s ease-out infinite}
@keyframes bnlive{0%{transform:scale(1);opacity:.7}100%{transform:scale(2.6);opacity:0}}
.banner.directo .cta-live{background:#fff;color:#c11226}
/* ===== banners de SPONSOR (3 plantillas) ===== */
#banner-evento>a{margin-bottom:12px}
#banner-evento>a:last-child{margin-bottom:0}
.bn-tag{position:absolute;top:8px;right:10px;font-size:9px;font-weight:700;letter-spacing:.5px;padding:2px 7px;border-radius:99px;text-transform:uppercase;z-index:2;background:rgba(0,0,0,.4);color:#e8eef4}
/* logo opcional en el banner de evento (esquina superior derecha) */
.banner .bn-logo{position:absolute;top:12px;right:14px;height:34px;max-width:120px;object-fit:contain;z-index:2}
.banner.has-logo{padding-right:76px}
.sp-logo img{display:block;width:100%;height:100%;object-fit:contain}
/* A · imagen completa (la marca sube su creatividad 1080×340) */
.sp-img{position:relative;display:block;border-radius:15px;overflow:hidden;height:112px;background-size:cover;background-position:center;text-decoration:none}
.sp-img-txt{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;padding:0 20px;color:#fff}
.sp-img-txt b{font-size:17px;font-weight:800}
.sp-img-txt span{font-size:12.5px;opacity:.9}
/* B · logo + texto sobre fondo claro */
.sp-logo-card{position:relative;display:flex;align-items:center;gap:14px;background:#f4f7fb;border-radius:15px;padding:15px 16px;text-decoration:none}
.sp-logo-card .bn-tag{background:#e2e8f0;color:#5b6b7d}
.sp-logo-card .sp-logo{flex:0 0 auto;width:66px;height:66px;border-radius:12px;overflow:hidden;background:#fff;border:1px solid #e2e8f0;display:flex;align-items:center;justify-content:center}
.sp-logo-card .sp-txt b{display:block;font-size:15px;color:#16283a;font-weight:700;line-height:1.25}
.sp-logo-card .sp-txt span{font-size:12px;color:#5b6b7d;line-height:1.4;display:block}
.sp-logo-card .sp-ver{display:inline-block;margin-top:7px;font-size:12px;font-weight:700;color:#0b8f66;border:1px solid #0b8f66;padding:5px 13px;border-radius:99px}
/* C · con el color de la marca */
.sp-color{position:relative;display:flex;align-items:center;gap:14px;border-radius:15px;padding:15px 16px;text-decoration:none;overflow:hidden;background:#0b3d2e}
.sp-color .bn-tag{background:rgba(255,255,255,.18);color:#eafff6}
.sp-color .sp-logo{flex:0 0 auto;width:60px;height:60px;border-radius:14px;overflow:hidden;background:#fff;display:flex;align-items:center;justify-content:center}
.sp-color .sp-txt{flex:1}
.sp-color .sp-txt b{display:block;font-size:15px;color:#fff;font-weight:700;line-height:1.25}
.sp-color .sp-txt span{font-size:12px;color:rgba(255,255,255,.82);line-height:1.4;display:block}
.sp-color .sp-arrow{color:#fff;font-size:22px;font-weight:700;flex:0 0 auto}

.cta-consulta{display:flex;gap:12px;align-items:center;background:var(--card);border:1px solid var(--brand);border-radius:15px;padding:12px;cursor:pointer}
.cta-consulta img{width:44px;height:44px;border-radius:50%;object-fit:cover}
.cta-consulta b{display:block;font-size:14px}
.cta-consulta span{font-size:12px;color:var(--brand);font-weight:600}

/* ---------- BIBLIOTECA ---------- */
.search{display:flex;align-items:center;gap:8px;background:var(--card);border:1px solid var(--line);border-radius:99px;padding:4px 8px 4px 14px}
.search span{color:var(--muted);font-size:14px}
.search input{flex:1;background:none;border:none;color:var(--ink);font-size:16px;font-family:inherit;padding:9px 4px}
.search input:focus{outline:none}
.search input::placeholder{color:var(--muted);font-size:13.5px}
.chips{display:flex;gap:7px;overflow-x:auto;scrollbar-width:none;margin:0 -16px;padding:2px 16px}
.chips::-webkit-scrollbar{display:none}
.chips:empty{display:none}
.chip{white-space:nowrap;font-size:12.5px;font-weight:700;padding:8px 14px;border-radius:99px;background:var(--card);border:1px solid var(--line);color:var(--ink-soft)}
.chip.on{background:var(--brand);border-color:var(--brand);color:#fff}
.chip small{font-weight:600;opacity:.6;margin-left:4px;font-size:11px}

.vrow{display:flex;align-items:center;gap:10px;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:9px;cursor:pointer}
.vrow.done{border-color:rgba(22,163,74,.55)}
.vrow .tmb{width:96px;height:64px;border-radius:9px;flex-shrink:0;background:#0d3a5c center/cover no-repeat;position:relative}
.vrow .tmb::after{content:"▶";position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:#fff;font-size:15px;text-shadow:0 1px 6px rgba(0,0,0,.6)}
.vrow .tmb .dur{position:absolute;right:4px;bottom:4px;background:rgba(0,0,0,.75);color:#fff;font-size:9px;padding:1px 5px;border-radius:5px;font-weight:600}
.vrow .tmb .okmark{position:absolute;left:4px;top:4px;background:var(--ok);color:#fff;font-size:9px;width:16px;height:16px;border-radius:50%;display:flex;align-items:center;justify-content:center}
.vrow>div:last-child{min-width:0;display:flex;flex-direction:column;justify-content:center}
.vrow p{margin:0;font-size:12.5px;font-weight:700;line-height:1.32}
.tags{display:flex;gap:5px;margin-top:5px;flex-wrap:wrap}
.tag{font-size:9.5px;font-weight:700;background:var(--chip);color:var(--chip-ink);padding:2px 8px;border-radius:6px;white-space:nowrap}
#results{display:flex;flex-direction:column;gap:9px}
.noresult{text-align:center;color:var(--muted);font-size:13.5px;padding:26px 10px}
.btn-ghost{background:var(--card);border:1px solid var(--line);color:var(--ink-soft);font-weight:700;font-size:13.5px;padding:11px;border-radius:13px;text-align:center;display:block;text-decoration:none;width:100%}

/* ---------- YO ---------- */
.stat-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px}
.stat{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:12px}
.stat b{font-size:23px;font-weight:900;letter-spacing:-.5px;display:block;font-variant-numeric:tabular-nums}
.stat small{font-size:11px;color:var(--muted);font-weight:600}
.prog-card{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:13px;display:flex;flex-direction:column;gap:6px}
.prog-card b{font-size:14px}
.prog-card small{font-size:12px;color:var(--muted)}

/* ---------- TABBAR ---------- */
.tabbar{
  position:fixed; bottom:0; left:50%; transform:translateX(-50%);
  width:100%; max-width:520px;
  display:flex; border-top:1px solid var(--line); background:var(--tabbg);
  backdrop-filter:blur(10px); padding:8px 4px calc(10px + env(safe-area-inset-bottom)); z-index:40;
}
.tab{flex:1;display:flex;flex-direction:column;align-items:center;gap:3px;font-size:10px;color:var(--muted);font-weight:600;background:none;text-transform:uppercase;letter-spacing:.3px}
.tab svg{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.tab.on{color:var(--brand)}
.tab .ia{width:44px;height:44px;margin-top:-24px;border-radius:50%;background:var(--grad);display:flex;align-items:center;justify-content:center;box-shadow:0 6px 16px rgba(21,96,255,.5)}
.tab .ia svg{stroke:#fff;width:20px;height:20px}

/* ---------- FICHA ---------- */
.ficha{position:fixed;inset:0;background:var(--scr);z-index:60;display:flex;flex-direction:column;max-width:520px;margin:0 auto}
.ficha-top{padding:calc(12px + env(safe-area-inset-top)) 14px 6px}
.back{background:none;color:var(--brand);font-weight:700;font-size:14.5px;padding:6px 4px}
.ficha-body{flex:1;overflow-y:auto;padding:0 16px 30px;display:flex;flex-direction:column;gap:12px}
.playerwrap{position:relative;width:100%;aspect-ratio:16/9;border-radius:15px;overflow:hidden;background:#000;flex-shrink:0}
.playerwrap iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.ficha h2{font-size:17px;font-weight:800;line-height:1.3;margin:0}
.facts{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.fact{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:8px 11px}
.fact small{display:block;font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);font-weight:700}
.fact b{font-size:13px}
.btnrow{display:flex;gap:9px}
.btnrow .btn-ghost{flex:1}
.btn-ghost.fav-on{color:#f43f5e;border-color:#f43f5e}
.btn-grad.done-on{background:var(--ok)}
.fres{font-size:13px;color:var(--ink-soft);margin:0;line-height:1.5}
#f-rel{display:flex;flex-direction:column;gap:9px}
#favlist{display:flex;flex-direction:column;gap:9px}

/* ---------- TOAST ---------- */
.toast{
  position:fixed;bottom:86px;left:50%;transform:translateX(-50%);
  background:var(--card);border:1px solid var(--brand);color:var(--ink);
  font-size:13.5px;font-weight:600;padding:11px 18px;border-radius:99px;z-index:80;
  box-shadow:0 10px 26px rgba(0,0,0,.5);white-space:nowrap;
}

@media (prefers-reduced-motion: no-preference){
  .view.on{animation:fadein .18s ease}
  @keyframes fadein{from{opacity:.4;transform:translateY(4px)}to{opacity:1;transform:none}}
}

/* campanita de novedades */
.bell{margin-left:auto;align-self:flex-start;position:relative;background:var(--card);border:1px solid var(--line);border-radius:50%;width:42px;height:42px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.bell svg{width:20px;height:20px;stroke:var(--ink-soft);fill:none;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.bell-dot{position:absolute;top:9px;right:10px;width:9px;height:9px;border-radius:50%;background:#f43f5e;border:2px solid var(--card)}
.noti{position:fixed;inset:0;background:var(--scr);z-index:70;display:flex;flex-direction:column;max-width:520px;margin:0 auto}
.noti-head{display:flex;align-items:center;justify-content:space-between;padding:calc(16px + env(safe-area-inset-top)) 16px 16px}
.noti-head b{font-size:19px;font-weight:800}
.noti-list{flex:1;overflow-y:auto;padding:0 16px 30px;display:flex;flex-direction:column;gap:10px}
.noti-item{display:flex;gap:12px;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:12px;text-decoration:none;color:var(--ink)}
.noti-item.nueva{border-color:var(--brand)}
.noti-item .nico{width:38px;height:38px;border-radius:10px;background:var(--grad);display:flex;align-items:center;justify-content:center;font-size:17px;flex-shrink:0}
.noti-item b{font-size:13.5px;display:block;line-height:1.3}
.noti-item p{margin:2px 0 0;font-size:12px;color:var(--ink-soft)}
.noti-item small{font-size:10px;color:var(--muted);font-weight:600}
/* escaparate de programas */
.shop-card{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:13px;display:flex;flex-direction:column;gap:5px;margin-bottom:9px}
.shop-card .kicker{margin:0}
.shop-card b{font-size:14.5px}
.shop-card p{margin:0;font-size:12px;color:var(--ink-soft);line-height:1.45}
.shop-card a{margin-top:6px}

/* cuerpo humano nativo (modelo real de la web) */
.bmap{display:flex;flex-direction:column;align-items:center;gap:11px;padding:2px 0 6px;position:relative}
.bwrap{position:relative;width:min(320px,84vw)}
.bwrap img{width:100%;display:block;filter:drop-shadow(0 12px 24px rgba(0,0,0,.35))}
:root[data-theme="light"] .bwrap img{filter:drop-shadow(0 12px 24px rgba(22,40,58,.22))}
.bdot{position:absolute;width:26px;height:26px;margin:-13px 0 0 -13px;border-radius:50%;background:transparent;border:none;display:flex;align-items:center;justify-content:center;cursor:pointer;padding:0}
.bdot::after{content:"";width:9px;height:9px;border-radius:50%;background:var(--brand);border:1.5px solid #fff;box-shadow:0 0 0 2px rgba(14,165,233,.38);animation:latido 2.4s ease-in-out infinite}
/* botones Frente/Espalda en círculo, a un ladito del muñeco */
.vista-side{position:absolute;left:2px;top:56px;display:flex;flex-direction:column;gap:11px;z-index:5}
.vista-side button{width:70px;height:70px;border-radius:50%;background:var(--card);border:1.5px solid var(--line);color:var(--ink-soft);font-size:12.5px;font-weight:700;font-family:inherit;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:6px;box-shadow:0 3px 10px rgba(0,0,0,.12)}
.vista-side button.on{background:var(--brand);border-color:var(--brand);color:#fff;box-shadow:0 4px 14px rgba(14,165,233,.4)}
@keyframes latido{0%,100%{transform:scale(1)}50%{transform:scale(1.18)}}
@media (prefers-reduced-motion: reduce){.bdot::after{animation:none}}
.zgrid-cuerpo{grid-template-columns:repeat(2,1fr)}
.zgrid-cuerpo .zchip{display:flex;justify-content:space-between;align-items:center;padding:13px 14px;font-size:13.5px}
.zgrid-cuerpo .zchip small{color:var(--muted);font-weight:600;font-size:11px}

/* popup de zona (agrupado por patología) */
.zpop{position:fixed;inset:0;z-index:65}
.zpop-bg{position:absolute;inset:0;background:rgba(3,9,15,.6);backdrop-filter:blur(2px)}
.zpop-sheet{
  position:absolute;left:50%;transform:translateX(-50%);bottom:0;width:100%;max-width:520px;
  background:var(--scr);border:1px solid var(--line);border-bottom:none;border-radius:22px 22px 0 0;
  padding:14px 16px calc(18px + env(safe-area-inset-bottom));max-height:74dvh;
  display:flex;flex-direction:column;gap:11px;
}
.zpop-head{display:flex;justify-content:space-between;align-items:center}
.zpop-head b{font-size:18px;font-weight:800}
.zpop-list{overflow-y:auto;display:flex;flex-direction:column;gap:8px}
.zp-item{display:flex;justify-content:space-between;align-items:center;gap:10px;background:var(--card);border:1px solid var(--line);border-radius:13px;padding:12px 14px;font-size:13.5px;font-weight:700;color:var(--ink);text-align:left}
.zp-item small{color:var(--muted);font-weight:600;font-size:11px;white-space:nowrap}

/* fachada del reproductor (miniatura limpia, player solo al tocar) */
.facade{position:absolute;inset:0;width:100%;height:100%;background:#000 center/cover no-repeat;border:none;cursor:pointer}
.fplay{
  position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  width:62px;height:62px;border-radius:50%;background:var(--grad);
  display:flex;align-items:center;justify-content:center;color:#fff;font-size:21px;padding-left:5px;
  box-shadow:0 10px 26px rgba(0,0,0,.5);
}
.fdur{position:absolute;right:10px;bottom:10px;background:rgba(0,0,0,.75);color:#fff;font-size:11px;padding:2px 8px;border-radius:7px;font-weight:600}

/* reproductor con controles propios (sin chrome de YouTube) */
.yt-hit{position:absolute;inset:0;z-index:2;cursor:pointer;background:transparent}
.yt-toggle{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:3;
  width:58px;height:58px;border-radius:50%;border:none;background:rgba(0,0,0,.55);color:#fff;
  font-size:18px;display:flex;align-items:center;justify-content:center;
  opacity:0;pointer-events:none;transition:opacity .18s;backdrop-filter:blur(2px)}
.playerwrap.paused .yt-toggle{opacity:1;pointer-events:auto}
.yt-bar{position:absolute;left:0;right:0;bottom:0;height:30px;z-index:4;cursor:pointer}
.yt-bar::before{content:"";position:absolute;left:0;right:0;bottom:0;height:8px;background:rgba(255,255,255,.45)}
.yt-fill{position:absolute;left:0;bottom:0;height:8px;background:var(--brand);width:0;box-shadow:0 0 6px var(--brand)}
.yt-fill::after{content:"";position:absolute;right:-7px;bottom:-4px;width:16px;height:16px;border-radius:50%;background:#fff;border:3px solid var(--brand);box-shadow:0 1px 5px rgba(0,0,0,.5)}

/* página nativa de programa */
/* cabecera: tarjeta con imagen (izquierda) + título */
.pd-head{display:flex;align-items:center;gap:14px;background:var(--card);border:1px solid var(--line);border-radius:16px;padding:12px;margin:2px 0 14px}
.pd-img{width:92px;height:92px;flex-shrink:0;border-radius:13px;background:#0d3a5c center/cover no-repeat;display:block}
.pd-head-txt{min-width:0}
.pd-head-txt .kicker{margin-bottom:3px}
.pd-title{font-size:20px;line-height:1.18;font-weight:900;margin:2px 0 0}
.pd-desc{margin:0 0 16px}
.pd-desc p{font-size:14px;color:var(--ink-soft);line-height:1.55;margin:0 0 10px}
.pd-desc p:last-child{margin-bottom:0}
/* qué incluye: cuadro con separadores */
.pd-card{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:4px 15px;margin:0 0 16px}
.pd-card-title{font-size:12px;font-weight:800;letter-spacing:.6px;text-transform:uppercase;color:var(--brand);padding:13px 0 4px}
.pd-incluye{list-style:none;padding:0;margin:0}
.pd-incluye li{display:flex;align-items:flex-start;gap:11px;font-size:14px;line-height:1.4;color:var(--ink);padding:11px 0;border-top:1px solid var(--line)}
.pd-emoji{flex-shrink:0;font-size:17px;width:24px;text-align:center}
/* la ficha de producto deja visible (y usable) el menú inferior */
#prog-detail{bottom:calc(62px + env(safe-area-inset-bottom));z-index:39}
/* bloque de compra */
.pd-buy{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:16px}
/* secciones enriquecidas de la ficha de programa */
.pd-sec{margin:20px 0 0}
.pd-sec-title{font-size:16px;font-weight:800;margin:0 0 11px}
.pd-checks{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:9px}
.pd-checks li{position:relative;padding-left:26px;font-size:14px;line-height:1.45;color:var(--ink-soft)}
.pd-checks li::before{content:"✓";position:absolute;left:0;top:0;color:var(--brand);font-weight:800}
.pd-facts{display:grid;grid-template-columns:1fr 1fr 1fr 1fr;gap:8px;margin-bottom:12px}
.pd-fact{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:10px 6px;font-size:12px;font-weight:700;text-align:center;color:var(--ink)}
.pd-fact span{display:block;font-size:19px;margin-bottom:3px}
.pd-testi-strip{display:flex;gap:9px;overflow-x:auto;padding:2px 2px 10px;-webkit-overflow-scrolling:touch;scrollbar-width:none}
.pd-testi-strip::-webkit-scrollbar{display:none}
.pd-testi-thumb{position:relative;flex:0 0 auto;width:114px;height:157px;border-radius:13px;overflow:hidden;border:1px solid var(--line);background:var(--scr);cursor:pointer;padding:0}
.pd-testi-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.pd-testi-thumb .play{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:30px;height:30px;border-radius:50%;background:rgba(3,9,15,.55);backdrop-filter:blur(2px);color:#fff;display:flex;align-items:center;justify-content:center;font-size:11px;padding-left:2px}
.pd-testi-thumb .who{position:absolute;left:0;right:0;bottom:0;padding:12px 6px 5px;font-size:10.5px;font-weight:700;color:#fff;text-align:center;background:linear-gradient(to top,rgba(3,9,15,.85),transparent);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* modelo Semana: qué verás cada día */
.pd-dias{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.pd-dias li{display:flex;gap:11px;align-items:flex-start;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:11px 12px}
.pd-dias .dia-n{flex:0 0 auto;background:linear-gradient(135deg,#22d3ee,#3b82f6);color:#fff;font-weight:800;font-size:11px;border-radius:8px;padding:5px 8px;margin-top:1px;white-space:nowrap}
.pd-dias p{margin:0;font-size:13.5px;line-height:1.5;color:var(--ink-soft)}
/* reseñas en texto (Semanas: cientos de opiniones escritas) */
#pd-testi-txt{display:flex;flex-direction:column;gap:10px;margin-bottom:10px}
.testi-quote{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:13px 14px}
.testi-quote .tq-stars{color:#f5b301;font-size:12px;letter-spacing:1.5px}
.testi-quote p{margin:6px 0 8px;font-size:13.5px;line-height:1.5;color:var(--ink-soft)}
.testi-quote b{font-size:12.5px;color:var(--ink)}
/* reproductor de UN testimonio (vídeo directo de Mux, sin cargar el wall) */
.tp-card{position:relative;width:100%;max-width:400px;background:var(--card);border:1px solid var(--line);border-radius:18px;padding:12px;display:flex;flex-direction:column;gap:10px;box-shadow:0 20px 50px rgba(0,0,0,.5)}
.tp-x{top:-12px;right:-6px;background:var(--card);border:1px solid var(--line);border-radius:50%;width:30px;height:30px;display:flex;align-items:center;justify-content:center;font-size:14px}
#tp-video{width:100%;max-height:64vh;border-radius:12px;background:#000;display:block}
.tp-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:0 2px}
.tp-foot b{font-size:14.5px}
.tp-todos{background:none;border:0;color:var(--brand);font-family:inherit;font-weight:700;font-size:13.5px;cursor:pointer;padding:4px 0}
.pd-testi-btn{width:100%;display:flex;align-items:center;gap:11px;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:14px 16px;cursor:pointer;color:var(--ink);font-family:inherit;font-size:14px;font-weight:700;text-align:left}
.pd-testi-stars{color:#f5b301;font-size:15px;letter-spacing:1px;flex-shrink:0}
.pd-testi-lbl{flex:1}
.pd-testi-arrow{color:var(--brand);font-weight:800;font-size:16px}
.pd-faq{display:flex;flex-direction:column;gap:8px}
.pd-faq-item{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:12px 14px}
.pd-faq-item summary{cursor:pointer;font-weight:700;font-size:14px;list-style:none;position:relative;padding-right:24px}
.pd-faq-item summary::-webkit-details-marker{display:none}
.pd-faq-item summary::after{content:"+";position:absolute;right:0;top:-2px;color:var(--brand);font-weight:800;font-size:19px}
.pd-faq-item[open] summary::after{content:"−"}
.pd-faq-item p{margin:10px 0 0;font-size:13.5px;line-height:1.5;color:var(--ink-soft)}
.pd-nota{background:var(--scr);border-left:3px solid var(--brand);border-radius:0 12px 12px 0;padding:11px 13px;font-size:13.5px;line-height:1.55;color:var(--ink-soft);margin:12px 0 0;font-style:italic}
/* fotos de la ficha (equipo, videollamada grupal...) — tamaño contenido, formato banner */
#pd-media{overflow:hidden}
#pd-media figure{margin:0 0 14px}
#pd-media figure:last-child{margin-bottom:0}
#pd-media img{width:100%;max-width:100%;height:auto;max-height:215px;object-fit:cover;border-radius:14px;border:1px solid var(--line);display:block}
#pd-media figcaption{font-size:12.5px;color:var(--muted);text-align:center;margin-top:7px;line-height:1.45}
/* marco de portátil para capturas de pantalla (videollamadas, plataforma...) */
.pd-laptop{margin:0 auto;max-width:400px}
.pd-laptop .scr{border:8px solid #26313f;border-bottom-width:14px;border-radius:14px 14px 3px 3px;overflow:hidden;background:#000;box-shadow:0 12px 30px rgba(0,0,0,.4)}
.pd-laptop .scr img{max-height:none;object-fit:contain;border:0;border-radius:0}
.pd-laptop .base{height:12px;background:linear-gradient(180deg,#46566a,#232f3d);border-radius:3px 3px 15px 15px;margin:0 -6.5%;position:relative;box-shadow:0 6px 16px rgba(0,0,0,.35)}
.pd-laptop .base::after{content:"";position:absolute;left:50%;top:0;transform:translateX(-50%);width:62px;height:5px;background:#18222d;border-radius:0 0 9px 9px}
/* marco de tablet (apaisada) para fotos que no deben ir "desnudas" */
.pd-tablet{margin:0 auto;max-width:390px}
.pd-tablet .scr{position:relative;background:linear-gradient(180deg,#2c3948,#212c39);padding:17px 13px 14px;border-radius:24px;box-shadow:0 12px 30px rgba(0,0,0,.4);border:1px solid #3a4a5c}
.pd-tablet .scr::before{content:"";position:absolute;top:7px;left:50%;transform:translateX(-50%);width:6px;height:6px;background:#101821;border-radius:50%;box-shadow:inset 0 0 2px #000}
.pd-tablet .scr img{max-height:none;object-fit:contain;border:0;border-radius:9px}
/* botón de compra fijo mientras se hace scroll por la ficha */
.pd-sticky{position:absolute;left:0;right:0;bottom:0;padding:24px 18px calc(12px + env(safe-area-inset-bottom));background:linear-gradient(to top,var(--scr) 55%,transparent);transform:translateY(110%);transition:transform .28s ease;pointer-events:none;z-index:5}
.pd-sticky.on{transform:none;pointer-events:auto}
.pd-sticky-cta{display:block;text-align:center;text-decoration:none;box-shadow:0 8px 24px rgba(14,165,233,.35)}
.pd-antes{opacity:.6;font-weight:600;margin-right:2px}
.pd-garantia{background:var(--scr);border:1px solid var(--line);border-radius:12px;padding:12px;font-size:12.5px;line-height:1.5;color:var(--ink-soft);margin:0 0 12px}
.pd-precio-nota{font-size:12.5px;color:var(--muted);text-align:center;white-space:nowrap;margin:0 0 4px}
.pd-cuotas{font-size:13px;color:var(--ink);text-align:center;margin:0 0 12px;font-weight:600}
.pd-cta{display:block;text-align:center;text-decoration:none;margin:0 0 10px}
.pd-legal{font-size:11.5px;color:var(--muted);text-align:center;margin:0}
.pd-divisa{margin-top:6px}
/* botón WhatsApp al final del bloque de compra (no flotante) — verde WhatsApp sólido */
.pd-wa{display:flex;align-items:center;justify-content:center;gap:9px;margin-top:12px;padding:13px 14px;border:0;border-radius:13px;background:#25D366;color:#fff;font-size:14px;font-weight:700;text-decoration:none;box-shadow:0 6px 18px rgba(37,211,102,.35)}
.pd-wa svg{width:19px;height:19px;fill:#fff;flex-shrink:0}

/* modal de incidencias */
.modal{position:fixed;inset:0;z-index:75;display:flex;align-items:center;justify-content:center;padding:20px}
.modal-bg{position:absolute;inset:0;background:rgba(3,9,15,.62);backdrop-filter:blur(2px)}
.modal-card{position:relative;width:100%;max-width:420px;background:var(--card);border:1px solid var(--line);border-radius:18px;padding:20px 18px;display:flex;flex-direction:column;gap:10px;box-shadow:0 20px 50px rgba(0,0,0,.5)}
.modal-card>b{font-size:18px;font-weight:800}
.modal-sub{font-size:13px;color:var(--ink-soft);line-height:1.5;margin:0 0 2px}
.modal-card input,.modal-card textarea{width:100%;background:var(--scr);border:1px solid var(--line);border-radius:12px;padding:12px;color:var(--ink);font-family:inherit;font-size:16px;resize:vertical}
.modal-card input:focus,.modal-card textarea:focus{outline:none;border-color:var(--brand)}
.modal-row{display:flex;gap:10px;margin-top:4px}
.modal-row .btn-ghost{flex:1;margin:0}
.modal-row .btn-grad{flex:1.4;margin:0}
.modal-hint{font-size:12px;color:var(--muted);text-align:center;min-height:14px}
.modal-card.rate{text-align:center}
.modal-card.rate .modal-row{margin-top:14px}
.rate-emoji{font-size:42px;line-height:1;margin:2px 0 4px}

/* autoridad + testimonios en Programas */
.prog-hero{text-align:center;margin:2px 0 16px}
.prog-authority{font-size:14.5px;color:var(--ink-soft);margin:0 0 12px;line-height:1.45}
.prog-authority b{display:block;font-size:30px;color:var(--brand);font-weight:800;letter-spacing:-.6px;margin-bottom:2px}
/* galería de testimonios en la pestaña Programas (miniaturas clicables, como en las fichas) */
.prog-testi-head{display:flex;align-items:baseline;justify-content:space-between;text-align:left;margin:4px 2px 9px}
.prog-testi-head b{font-size:14px;font-weight:800;white-space:nowrap}
.prog-testi-head a{font-size:13px;color:var(--brand);font-weight:700;cursor:pointer}
#prog-testi-strip{text-align:left}
.btn-testi{display:inline-flex;align-items:center;gap:9px;background:var(--card);border:1px solid var(--line);color:var(--ink);font-family:inherit;font-size:14px;font-weight:700;padding:11px 18px;border-radius:999px;cursor:pointer}
.btn-testi .testi-ico{width:22px;height:22px;border-radius:50%;background:linear-gradient(135deg,#22d3ee,#3b82f6,#8b5cf6);color:#fff;display:inline-flex;align-items:center;justify-content:center;font-size:9px;padding-left:2px}
.testi-card{max-width:520px;max-height:88vh;display:flex;flex-direction:column;overflow:hidden}
.testi-x{position:absolute;top:10px;right:12px;background:none;border:0;color:var(--muted);font-size:18px;line-height:1;cursor:pointer;z-index:3;padding:4px}
.testi-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:8px;overflow:auto}
.testi-cardbtn{position:relative;border:1px solid var(--line);border-radius:14px;overflow:hidden;background:var(--scr);cursor:pointer;padding:0;aspect-ratio:16/10}
.testi-cardbtn img{width:100%;height:100%;object-fit:cover;display:block;opacity:.9}
.testi-cardbtn span{position:absolute;left:0;right:0;bottom:0;padding:14px 10px 8px;color:#fff;font-weight:800;font-size:14px;text-align:left;background:linear-gradient(to top,rgba(3,9,15,.85),transparent)}
#testi-detail{display:flex;flex-direction:column;min-height:0;flex:1}
.testi-back{align-self:flex-start;background:none;border:0;color:var(--brand);font-family:inherit;font-weight:700;font-size:14px;cursor:pointer;padding:2px 0 10px}
.testi-frame{flex:1;min-height:0;overflow:auto;border-radius:12px}
.testi-frame iframe{width:100%;height:66vh;border:0;display:block}

/* artículos del blog */
.artlist{display:flex;flex-direction:column;gap:11px}
.art{background:var(--card);border:1px solid var(--line);border-radius:15px;overflow:hidden;cursor:pointer}
.art-img{height:150px;background:#0d3a5c center/cover no-repeat}
.art-txt{padding:11px 13px 13px}
.art-txt .kicker{margin-bottom:3px;display:block}
.art-txt b{font-size:14.5px;line-height:1.35;display:block}
.art-txt p{margin:5px 0 0;font-size:12px;color:var(--ink-soft);line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}

/* lector de artículos */
.lector{position:fixed;inset:0;background:var(--scr);z-index:62;display:flex;flex-direction:column;max-width:520px;margin:0 auto}
.lector-body{flex:1;overflow-y:auto;padding:0 18px 34px}
.lector-body h1{font-size:20px;line-height:1.32;font-weight:800;margin:4px 0 4px}
.l-meta{font-size:12px;color:var(--muted);margin:0 0 12px}
.l-cont{font-size:14.5px;line-height:1.68;color:var(--ink-soft)}
.l-cont h2{font-size:17px;color:var(--ink);margin:22px 0 6px;line-height:1.3}
.l-cont h3,.l-cont h4{font-size:15px;color:var(--ink);margin:17px 0 4px}
.l-cont p{margin:9px 0}
.l-cont img{max-width:100%;height:auto;border-radius:12px;margin:8px 0}
.l-cont a{color:var(--brand)}
.l-cont ul,.l-cont ol{padding-left:20px;margin:8px 0}
.l-cont li{margin:4px 0}
.l-cont blockquote{border-left:3px solid var(--brand);margin:12px 0;padding:2px 13px;color:var(--ink)}
.l-cont table{max-width:100%;font-size:12.5px;border-collapse:collapse}
.l-cont td,.l-cont th{border:1px solid var(--line);padding:6px 8px}
.lector .btn-ghost{margin-top:20px}

/* catálogo de programas: imagen + nombre + excerpt al lateral */
.prog-row{display:flex;align-items:center;gap:12px;width:100%;text-align:left;font-family:inherit;cursor:pointer;background:var(--card);border:1px solid var(--line);border-radius:15px;padding:9px;text-decoration:none;color:var(--ink);margin-bottom:9px}
.prog-row img{width:76px;height:76px;border-radius:12px;object-fit:cover;flex-shrink:0}
.prog-row>div{min-width:0}
.prog-row .kicker{margin-bottom:1px}
.prog-row b{font-size:14px;line-height:1.25;display:block}
.prog-row p{margin:3px 0 0;font-size:11.5px;color:var(--ink-soft);line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.pr-go{margin-left:auto;color:var(--brand);font-weight:800;font-size:15px;flex-shrink:0;padding-right:4px}
#prog-inicio .prog-row:last-child{margin-bottom:0}


/* selector de tema en Yo */
.seg{display:flex;gap:7px}
.seg button{flex:1;background:var(--card);border:1px solid var(--line);color:var(--ink-soft);font-weight:700;font-size:12.5px;padding:10px 4px;border-radius:12px}
.seg button.on{background:var(--brand);border-color:var(--brand);color:#fff}

/* iOS: Apple no permite vender contenido digital sin su IAP → se oculta toda la compra en el build iOS */
body.is-ios .pd-buy, body.is-ios #pd-sticky{display:none!important}
/* En iOS no se puede vender (norma Apple): se oculta la compra y en su lugar va un contacto por WhatsApp. */
.pd-ios{display:none}
body.is-ios .pd-ios{display:block;background:var(--card);border:1px solid var(--line);border-radius:16px;padding:16px;margin-top:4px}
.pd-ios-txt{font-size:14px;color:var(--ink-soft);text-align:center;line-height:1.45;margin:0 0 12px}

/* ===== Banner newsletter (final del Inicio) ===== */
.nl-banner{position:relative;overflow:hidden;width:100%;text-align:left;background:var(--grad);border:0;border-radius:16px;padding:16px 16px 17px;color:#fff;box-shadow:0 10px 24px rgba(21,96,255,.28);margin-top:4px}
.nl-banner span{display:block}
.nl-banner::before{content:"";position:absolute;right:-30px;top:-30px;width:120px;height:120px;border-radius:50%;background:rgba(255,255,255,.12)}
.nl-b-ic{display:flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:10px;background:rgba(255,255,255,.22);margin-bottom:10px}
.nl-b-ic svg{width:20px;height:20px}
.nl-b-kick{font-size:10px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;opacity:.92;margin-bottom:5px}
.nl-b-title{font-size:16.5px;font-weight:800;line-height:1.22}
.nl-b-sub{font-size:12px;opacity:.95;margin:5px 0 12px;line-height:1.4}
.nl-b-cta{display:inline-block;background:#fff;color:var(--brand);font-weight:800;font-size:12.5px;padding:9px 16px;border-radius:99px}
/* ===== Popup newsletter ===== */
.nl-check{display:flex;gap:9px;align-items:flex-start;margin-top:12px;font-size:12.5px;color:var(--ink-soft);line-height:1.4;text-align:left;cursor:pointer}
.nl-check input{margin-top:2px;width:17px;height:17px;flex-shrink:0;accent-color:var(--brand)}
.nl-check a{color:var(--brand);font-weight:700}
.nl-done{text-align:center;padding:6px 0 2px}
.nl-done-ic{display:flex;align-items:center;justify-content:center;width:52px;height:52px;border-radius:50%;background:var(--grad);color:#fff;font-size:26px;font-weight:800;margin:0 auto 12px}
.nl-done > b{font-size:18px;font-weight:800}
.nl-spam{font-size:12px;color:var(--muted);margin-top:10px;background:var(--scr);border-radius:10px;padding:10px 12px}
.nl-done .btn-grad{margin-top:16px}
/* ===== Timer de urgencia (página de programa; oculto en iOS por ir dentro de .pd-buy) ===== */
.pd-timer{display:flex;flex-direction:column;align-items:center;gap:3px;background:linear-gradient(135deg,#f1394f,#c11226);color:#fff;border-radius:13px;padding:11px 14px;margin-bottom:13px;box-shadow:0 6px 16px rgba(193,18,38,.28)}
.pd-timer-txt{font-size:11.5px;font-weight:700;letter-spacing:.03em;opacity:.95;text-transform:uppercase;text-align:center}
.pd-timer-num{font-size:24px;font-weight:800;letter-spacing:.02em;font-variant-numeric:tabular-nums;line-height:1.1}