/* ============================================================================
   Pokémon GO y códigos — versión 2 (zona «zg»). Prefijo .zg-.
   Todo el color sale de los tokens de la V2; el acento de la zona es --nx-canal.
   ========================================================================== */
.zg { --zg-panel: var(--v2-superficie); --zg-borde: var(--border-color); --zg-radio: 14px; color: var(--text-main); min-width: 0; }
[data-theme="dark"] .zg { --zg-panel: #0f1b2d; --zg-borde: #1e2e45; }
.zg *, .zg *::before, .zg *::after { box-sizing: border-box; }
.zg [hidden] { display: none !important; }
.zg a { text-decoration: none; }
.zg img { max-width: 100%; }

/* ---------- Cabecera ---------- */
.zg-cab { display: grid; grid-template-columns: minmax(0, 1fr) 230px; gap: 26px; align-items: end; margin-bottom: 24px; }
.zg-cab-txt { min-width: 0; }
.zg-cab h1 { margin: 8px 0 10px; font: 800 clamp(28px, 3.2vw, 42px)/1.06 var(--font-display); letter-spacing: -.02em; text-wrap: balance; }
.zg-cab h1::after { content: ""; display: block; width: 56px; height: 4px; margin-top: 12px; border-radius: 4px; background: var(--nx-canal); }
.zg-kicker { display: inline-flex; align-items: center; gap: 8px; margin: 14px 0 0; padding: 4px 11px; border-radius: 8px; font-size: 12px; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; color: var(--nx-canal-txt); background: color-mix(in srgb, var(--nx-canal) 14%, transparent); }
.zg-intro { margin: 0; max-width: 66ch; font-size: 16px; line-height: 1.6; color: var(--v2-texto-2); }
.zg-intro a { color: var(--nx-canal-txt); font-weight: 700; text-decoration: underline; }
.zg-sello { display: grid; gap: 3px; padding: 14px 16px; border-radius: var(--zg-radio); background: var(--zg-panel); border: 1px solid var(--zg-borde); }
.zg-sello-vivo { display: flex; align-items: center; gap: 8px; font-size: 11px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--nx-canal-txt); }
.zg-sello b { font: 800 22px/1.1 var(--font-display); }
.zg-sello small { font-size: 12px; line-height: 1.5; color: var(--v2-texto-3); }
.zg-sello a { color: var(--nx-canal-txt); font-weight: 700; }
.zg-pulso { width: 9px; height: 9px; border-radius: 50%; background: #22c55e; box-shadow: 0 0 0 0 rgba(34, 197, 94, .55); animation: zg-pulso 2s infinite; flex: 0 0 auto; display: inline-block; }
@keyframes zg-pulso { 70% { box-shadow: 0 0 0 8px rgba(34, 197, 94, 0); } 100% { box-shadow: 0 0 0 0 rgba(34, 197, 94, 0); } }
@media (prefers-reduced-motion: reduce) { .zg-pulso { animation: none; } }

.zg-zona { display: flex; gap: 6px; overflow-x: auto; margin: -6px 0 22px; padding-bottom: 4px; scrollbar-width: none; }
.zg-zona a { flex: 0 0 auto; display: inline-flex; align-items: center; gap: 7px; padding: 6px 12px; border-radius: 99px; font-size: 12.5px; font-weight: 700; color: var(--v2-texto-2); border: 1px solid var(--zg-borde); }
.zg-zona a i { color: var(--nx-canal-txt); font-size: 12px; }
.zg-zona a:hover { border-color: var(--nx-canal); color: var(--text-main); }
.zg-zona a.is-on { background: color-mix(in srgb, var(--nx-canal) 16%, transparent); color: var(--text-main); border-color: var(--nx-canal); }

/* ---------- Secciones y títulos ---------- */
.zg-sec { margin-bottom: 32px; min-width: 0; }
.zg-sec > h2, .zg-h2 { display: flex; align-items: center; gap: 10px; margin: 0 0 14px; font: 800 22px/1.2 var(--font-display); }
.zg-sec > h2 > i, .zg-h2 > i { color: var(--nx-canal-txt); font-size: 18px; }
.zg-sec > h2 small, .zg-h2 small { padding: 2px 9px; border-radius: 999px; font: 800 12px var(--font-primary); background: color-mix(in srgb, var(--nx-canal) 18%, transparent); color: var(--nx-canal-txt); }
.zg-vacio { padding: 36px 20px; text-align: center; border-radius: var(--zg-radio); border: 1px dashed var(--zg-borde); color: var(--v2-texto-2); }
.zg-nota { margin: 12px 0 0; font-size: 13.5px; line-height: 1.55; color: var(--v2-texto-2); }
.zg .pg-credit { margin-top: 28px; }

/* ---------- Chips y filtros ---------- */
.zg-filtros { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 22px; }
.zg-chip { display: inline-flex; align-items: center; gap: 7px; padding: 8px 13px; border-radius: 10px; font: 700 13.5px var(--font-primary); color: var(--text-main); background: var(--zg-panel); border: 1px solid var(--zg-borde); cursor: pointer; transition: border-color .15s, background .15s; }
.zg-chip b { font-size: 11.5px; padding: 1px 7px; border-radius: 99px; background: var(--v2-tarjeta); color: var(--v2-texto-2); }
.zg-chip:hover { border-color: var(--nx-canal); }
.zg-chip.is-on { background: var(--v2-amarillo); color: #141005; border-color: var(--v2-amarillo); }
.zg-chip.is-on b { background: rgba(20, 16, 5, .14); color: #141005; }
.zg-chip:focus-visible { outline: 2px solid var(--nx-canal-txt); outline-offset: 2px; }
a.zg-chip { text-decoration: none; }

/* ---------- Eventos: activos ---------- */
.zg-evs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.zg-ev { display: grid; grid-template-columns: 180px minmax(0, 1fr); border-radius: var(--zg-radio); overflow: hidden; color: var(--text-main); background: var(--zg-panel); border: 1px solid var(--zg-borde); transition: border-color .15s, transform .15s; }
.zg-ev:hover { border-color: var(--nx-canal); transform: translateY(-2px); }
.zg-ev-img { background: #0b1426; display: block; overflow: hidden; min-height: 130px; }
.zg-ev-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.zg-ev-txt { display: flex; flex-direction: column; gap: 6px; padding: 13px 15px; min-width: 0; }
.zg-ev-txt b { font: 700 16px/1.3 var(--font-display); overflow-wrap: anywhere; }
.zg-ev-txt small { font-size: 12.5px; color: var(--v2-texto-3); }
.zg-etq { align-self: flex-start; padding: 2px 8px; border-radius: 6px; font-size: 10.5px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; background: color-mix(in srgb, var(--nx-canal) 18%, transparent); color: var(--nx-canal-txt); }
.zg-barra { display: block; height: 6px; margin-top: auto; border-radius: 6px; background: var(--v2-tarjeta); overflow: hidden; }
.zg-barra span { display: block; height: 100%; border-radius: 6px; background: linear-gradient(90deg, var(--nx-canal), #22c55e); }
.zg-quedan { font-size: 12.5px; font-weight: 700; color: var(--nx-canal-txt); }

/* ---------- Eventos: agenda ---------- */
.zg-agenda { display: grid; gap: 12px; }
.zg-dia { display: grid; grid-template-columns: 78px minmax(0, 1fr); gap: 14px; align-items: start; padding: 12px; border-radius: var(--zg-radio); background: var(--zg-panel); border: 1px solid var(--zg-borde); }
.zg-dia-fecha { display: grid; justify-items: center; align-content: center; padding: 10px 4px; border-radius: 10px; text-align: center; background: color-mix(in srgb, var(--nx-canal) 14%, transparent); }
.zg-dia-fecha b { font: 800 26px/1 var(--font-display); }
.zg-dia-fecha span { font-size: 12px; font-weight: 800; text-transform: uppercase; color: var(--nx-canal-txt); }
.zg-dia-fecha small { font-size: 11px; color: var(--v2-texto-3); }
.zg-dia-lista { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.zg-dia-lista a { display: grid; grid-template-columns: 76px minmax(0, 1fr); gap: 4px 12px; align-items: center; padding: 8px; height: 100%; border-radius: 10px; color: var(--text-main); background: var(--v2-tarjeta); border: 1px solid transparent; }
.zg-dia-lista a:hover { border-color: var(--nx-canal); background: var(--v2-tarjeta-hover); }
.zg-mini { grid-row: span 2; width: 76px; height: 52px; border-radius: 8px; overflow: hidden; background: #0b1426; display: block; }
.zg-mini img { width: 100%; height: 100%; object-fit: cover; display: block; }
.zg-dia-txt { display: grid; gap: 2px; min-width: 0; }
.zg-dia-txt b { font: 700 14px/1.3 var(--font-display); overflow-wrap: anywhere; }
.zg-dia-txt small { font-size: 12px; color: var(--v2-texto-3); }
.zg-cuando { font-size: 12px; font-weight: 700; color: var(--nx-canal-txt); }

/* ---------- Ficha de Pokémon ---------- */
.zg-mons { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 230px), 1fr)); gap: 10px; }
.zg-mon { --zg-t: #9ca3af; display: grid; grid-template-columns: 76px minmax(0, 1fr); gap: 10px; align-items: center; padding: 10px 12px 10px 10px; border-radius: 12px; background: var(--zg-panel); border: 1px solid var(--zg-borde); border-left: 4px solid var(--zg-t); min-width: 0; }
.zg-mon-foto { width: 76px; height: 76px; display: grid; place-items: center; border-radius: 10px; background: color-mix(in srgb, var(--zg-t) 14%, transparent); }
.zg-mon-foto img { width: 70px; height: 70px; object-fit: contain; }
.zg-mon-cuerpo { display: grid; gap: 5px; min-width: 0; }
.zg-mon-nombre { font: 700 14.5px/1.25 var(--font-display); overflow-wrap: anywhere; }
.zg-shiny { margin-left: 4px; font-size: 12px; color: var(--v2-activo); }
.zg-reg { margin-left: 4px; font-size: 11px; color: var(--v2-azul); }
.zg-tipos { display: flex; flex-wrap: wrap; gap: 4px; }
.zg-tipo { padding: 1px 8px; border-radius: 6px; font-size: 11px; font-weight: 800; background: var(--zg-bg); color: var(--zg-ink); }
.zg-mon-pie { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.zg-pc { font-size: 12px; color: var(--v2-texto-2); }
.zg-pc b { font-weight: 800; color: var(--text-main); font-variant-numeric: tabular-nums; }
.zg-clima { display: inline-flex; gap: 2px; }
.zg-clima img { width: 20px; height: 20px; object-fit: contain; }

.zg-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* ---------- Incursiones: bandas por nivel ---------- */
.zg-banda { margin-bottom: 18px; padding: 16px 16px 18px; border-radius: var(--zg-radio); background: var(--zg-panel); border: 1px solid var(--zg-borde); border-left: 6px solid var(--nx-canal); scroll-margin-top: 90px; }
.zg-banda-cab { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 12px; }
.zg-banda-cab h2 { margin: 0; font: 800 20px/1.2 var(--font-display); }
.zg-banda-n { font-size: 12.5px; font-weight: 700; color: var(--v2-texto-3); }
.zg-banda .zg-mon { background: var(--v2-tarjeta); }

/* ---------- Huevos ---------- */
.zg-huevos { display: grid; gap: 16px; }
.zg-huevo { --zg-h: #38bdf8; display: grid; grid-template-columns: 200px minmax(0, 1fr); gap: 18px; padding: 16px; border-radius: var(--zg-radio); background: var(--zg-panel); border: 1px solid var(--zg-borde); }
.zg-huevo-cab { align-self: start; position: sticky; top: 80px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; padding: 18px 10px; border-radius: 12px; text-align: center; background: color-mix(in srgb, var(--zg-h) 16%, transparent); border: 1px solid color-mix(in srgb, var(--zg-h) 45%, transparent); }
.zg-huevo-ico { display: grid; place-items: center; width: 68px; height: 68px; border-radius: 50%; font-size: 32px; background: var(--zg-h); color: #141005; }
.zg-huevo-cab h2 { margin: 0 0 3px; font: 800 19px/1.2 var(--font-display); }
.zg-huevo .zg-mon { background: var(--v2-tarjeta); border-left-color: var(--zg-t); }

/* ---------- Investigaciones ---------- */
.zg-buscador { position: sticky; top: 70px; z-index: 5; display: flex; align-items: center; gap: 10px; margin-bottom: 22px; padding: 6px 14px; border-radius: 12px; background: var(--zg-panel); border: 1px solid var(--zg-borde); }
.zg-buscador:focus-within { border-color: var(--nx-canal); }
.zg-buscador > label i { color: var(--v2-texto-3); }
.zg-buscador input { flex: 1 1 auto; min-width: 0; padding: 10px 0; border: 0; outline: 0; background: transparent; color: var(--text-main); font: 500 15px var(--font-primary); }
.zg-buscador-n { font-size: 12.5px; color: var(--v2-texto-3); white-space: nowrap; }
.zg-buscador-n b { color: var(--nx-canal-txt); }
.zg-tareas { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.zg-tarea { display: flex; flex-direction: column; gap: 10px; padding: 13px 14px; border-radius: 12px; background: var(--zg-panel); border: 1px solid var(--zg-borde); min-width: 0; }
.zg-tarea-txt { margin: 0; font-weight: 700; font-size: 15px; line-height: 1.4; }
.zg-premios { list-style: none; margin: auto 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; }
.zg-premio { display: flex; align-items: center; gap: 6px; padding: 3px 10px 3px 4px; border-radius: 10px; background: var(--v2-tarjeta); font-size: 12.5px; }
.zg-premio img { width: 38px; height: 38px; object-fit: contain; }
.zg-premio span { display: grid; line-height: 1.25; }
.zg-premio small { color: var(--v2-texto-3); font-size: 11px; }

/* ---------- Ficha de evento ---------- */
.zg-evhero { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: 26px; align-items: center; margin-bottom: 26px; }
.zg-evhero.sin-img { grid-template-columns: minmax(0, 1fr); }
.zg-evhero-img { border-radius: 18px; overflow: hidden; background: #0b1426; border: 1px solid var(--zg-borde); aspect-ratio: 16 / 9; }
.zg-evhero-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.zg-evhero h1 { margin: 8px 0 14px; font: 800 clamp(26px, 2.8vw, 38px)/1.1 var(--font-display); letter-spacing: -.02em; overflow-wrap: anywhere; }
.zg-ficha { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 150px), 1fr)); gap: 8px; margin: 0; }
.zg-ficha > div { padding: 10px 12px; border-radius: 10px; background: var(--zg-panel); border: 1px solid var(--zg-borde); }
.zg-ficha dt { font-size: 11px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--v2-texto-3); }
.zg-ficha dd { display: flex; align-items: center; gap: 7px; margin: 3px 0 0; font-weight: 700; font-size: 14px; }
.zg-ficha-est.is-live dd { color: var(--nx-canal-txt); }
.zg-ficha-est.is-soon .zg-pulso { background: #f59e0b; animation: none; }
.zg-resumen { display: flex; gap: 12px; align-items: flex-start; margin: 0 0 18px; padding: 14px 16px; border-radius: var(--zg-radio); background: color-mix(in srgb, var(--nx-canal) 10%, transparent); border: 1px solid color-mix(in srgb, var(--nx-canal) 35%, transparent); line-height: 1.6; }
.zg-resumen > i { color: var(--nx-canal-txt); margin-top: 4px; }
.zg-resumen > div, .zg-resumen > span { min-width: 0; flex: 1 1 auto; }
.zg-evlayout { display: grid; grid-template-columns: 230px minmax(0, 1fr); gap: 24px; align-items: start; }
.zg-evlayout > .zg-evmain:only-child { grid-column: 1 / -1; }
.zg-indice { position: sticky; top: 80px; padding: 14px; border-radius: var(--zg-radio); background: var(--zg-panel); border: 1px solid var(--zg-borde); }
.zg-indice p { margin: 0 0 8px; font-size: 11px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--v2-texto-3); }
.zg-indice ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 2px; }
.zg-indice a { display: flex; gap: 9px; align-items: center; padding: 8px 9px; border-radius: 8px; font-size: 13.5px; font-weight: 600; color: var(--v2-texto-2); }
.zg-indice a i { width: 16px; text-align: center; color: var(--nx-canal-txt); }
.zg-indice a:hover { background: var(--v2-tarjeta-hover); color: var(--text-main); }
.zg-evmain { min-width: 0; }
.zg-cuerpo { display: contents; }
.zg-panel { margin-bottom: 18px; border-radius: var(--zg-radio); background: var(--zg-panel); border: 1px solid var(--zg-borde); overflow: hidden; scroll-margin-top: 90px; }
.zg-panel > h2 { display: flex; align-items: center; gap: 12px; margin: 0; padding: 13px 18px; font: 800 18px/1.25 var(--font-display); border-bottom: 1px solid var(--zg-borde); background: color-mix(in srgb, var(--nx-canal) 8%, transparent); }
.zg-panel > h2 small { padding: 2px 9px; border-radius: 999px; font: 800 12px var(--font-primary); background: color-mix(in srgb, var(--nx-canal) 18%, transparent); color: var(--nx-canal-txt); }
.zg-panel-ico { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 9px; background: var(--nx-canal); color: #141005; font-size: 14px; flex: 0 0 auto; }
.zg-panel-cuerpo { padding: 16px 18px 18px; display: grid; gap: 12px; min-width: 0; }
.zg-b-h3 { margin: 6px 0 0; font: 800 16px var(--font-display); }
.zg-b-h4 { margin: 4px 0 0; font: 700 14.5px var(--font-display); color: var(--v2-texto-2); }
.zg-b-p, .zg-b-sub { margin: 0; font-size: 15px; line-height: 1.65; }
.zg-b-p.is-lead { font-size: 16px; }
.zg-b-sub { color: var(--v2-texto-2); font-style: italic; }
.zg-b-lista { margin: 0; padding-left: 20px; display: grid; gap: 6px; line-height: 1.55; font-size: 15px; }
.zg-b-lista li::marker { color: var(--nx-canal-txt); }
.zg-b-fig { margin: 0; } .zg-b-fig img { border-radius: 10px; display: block; margin: 0 auto; }
.zg-b-hr { border: 0; border-top: 1px solid var(--zg-borde); width: 100%; margin: 4px 0; }
.zg-bonus { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.zg-bonus li { display: flex; align-items: center; gap: 12px; padding: 10px 12px; border-radius: 10px; background: var(--v2-tarjeta); font-weight: 600; font-size: 14.5px; line-height: 1.4; }
.zg-bonus img { width: 40px; height: 40px; object-fit: contain; flex: 0 0 auto; }
.zg-bonus-ico { width: 40px; text-align: center; font-size: 20px; color: var(--v2-activo); }
.zg-panel .zg-mon, .zg-panel .zg-tarea { background: var(--v2-tarjeta); }
.zg-pasos { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; counter-reset: paso; }
.zg-paso { counter-increment: paso; position: relative; padding: 12px 14px 12px 52px; border-radius: 12px; background: var(--v2-tarjeta); display: grid; gap: 8px; }
.zg-paso::before { content: counter(paso); position: absolute; left: 12px; top: 12px; width: 28px; height: 28px; display: grid; place-items: center; border-radius: 50%; font: 800 13px var(--font-display); background: var(--nx-canal); color: #141005; }
.zg-paso h4 { margin: 0; font: 700 15px var(--font-display); }
.zg-paso-tarea { display: flex; justify-content: space-between; align-items: center; gap: 10px 14px; flex-wrap: wrap; font-size: 14px; }
.zg-paso-tarea em { display: inline-flex; align-items: center; gap: 6px; font-style: normal; font-weight: 700; color: var(--nx-canal-txt); }
.zg-paso-tarea em img { width: 30px; height: 30px; object-fit: contain; }
.zg-premios-fin { padding-top: 4px; border-top: 1px dashed var(--zg-borde); }
.zg-destacado { display: flex; align-items: center; gap: 16px; }
.zg-destacado img { width: 96px; height: 96px; object-fit: contain; }
.zg-destacado b { display: block; font: 800 20px var(--font-display); }
.zg-destacado span { color: var(--v2-texto-2); }
.zg-pase { display: grid; gap: 6px; }
.zg-pase-fila { display: grid; grid-template-columns: 90px minmax(0, 1fr) minmax(0, 1fr); gap: 10px; align-items: start; padding: 8px 10px; border-radius: 10px; background: var(--v2-tarjeta); }
.zg-pase-cab { background: transparent; font-size: 11.5px; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; color: var(--v2-texto-3); }
.zg-pase-rango { font: 800 14px var(--font-display); }
.zg-pase-celda { display: flex; flex-wrap: wrap; gap: 6px; min-width: 0; }
.zg-rw { display: inline-flex; align-items: center; gap: 5px; padding: 3px 9px 3px 4px; border-radius: 8px; font-size: 12.5px; background: var(--zg-panel); border: 1px solid var(--zg-borde); }
.zg-rw img { width: 26px; height: 26px; object-fit: contain; }
.zg-rw-no { color: var(--v2-texto-3); }
.zg-volver { display: inline-flex; align-items: center; gap: 9px; padding: 10px 16px; border-radius: 10px; font-weight: 700; color: var(--text-main); background: var(--zg-panel); border: 1px solid var(--zg-borde); }
.zg-volver:hover { border-color: var(--nx-canal); }
.zg-resumen-solo { align-items: center; }

/* ---------- Clima ---------- */
.zg-tipo-var { background: color-mix(in srgb, var(--t, var(--nx-canal)) 18%, var(--zg-panel)); color: var(--text-main); box-shadow: inset 3px 0 0 var(--t, var(--nx-canal)); padding: 2px 9px 2px 11px; font-size: 12px; }
.zg-ico { display: block; width: 40px; height: 40px; }
.zg-ico-xl { width: 96px; height: 96px; }
.zg-ico-sm { width: 26px; height: 26px; }
.zg-clima-dos { display: grid; grid-template-columns: minmax(0, 1fr) 330px; gap: 26px; align-items: start; margin-bottom: 10px; }
.zg-ciudades { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.zg-ciudad { --zg-c: #9aa7b4; display: grid; grid-template-columns: 52px minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 12px 14px; border-radius: 12px; color: var(--text-main); background: var(--zg-panel); border: 1px solid var(--zg-borde); border-top: 3px solid var(--zg-c); transition: transform .15s, border-color .15s; }
.zg-ciudad:hover { transform: translateY(-2px); border-color: var(--zg-c); }
.zg-ciudad-ico { color: var(--zg-c); display: grid; place-items: center; }
.zg-ciudad-ico .zg-ico { width: 44px; height: 44px; }
.zg-ciudad-txt { display: grid; gap: 4px; min-width: 0; }
.zg-ciudad-txt b { font: 800 16px var(--font-display); }
.zg-ciudad-txt small { font-size: 12.5px; color: var(--v2-texto-2); }
.zg-ciudad-temp { font: 800 28px/1 var(--font-display); font-variant-numeric: tabular-nums; }
.zg-lateral { position: sticky; top: 80px; padding: 16px; border-radius: var(--zg-radio); background: var(--zg-panel); border: 1px solid var(--zg-borde); }
.zg-lateral > h2 { font-size: 18px; }
.zg-climas { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.zg-climas li { display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: 12px; align-items: center; padding: 9px 10px; border-radius: 10px; background: var(--v2-tarjeta); border-left: 4px solid var(--zg-c); }
.zg-climas-ico { color: var(--zg-c); } .zg-climas-ico .zg-ico { width: 38px; height: 38px; }
.zg-climas li div { display: grid; gap: 4px; min-width: 0; }
.zg-climas b { font: 700 14.5px var(--font-display); }
.zg-climas small { font-size: 12px; color: var(--v2-texto-3); }
.zg-prosa { max-width: 78ch; display: grid; gap: 12px; }
.zg-prosa p { margin: 0; font-size: 15.5px; line-height: 1.68; }
.zg-prosa a { color: var(--nx-canal-txt); font-weight: 700; text-decoration: underline; }

/* ---------- Clima de una ciudad ---------- */
.zg-ahora { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: 14px; margin-bottom: 30px; }
.zg-ahora-cielo { display: flex; align-items: center; gap: 22px; padding: 24px; border-radius: 18px; color: var(--zg-c); background: linear-gradient(135deg, color-mix(in srgb, var(--zg-c) 26%, var(--zg-panel)), var(--zg-panel) 75%); border: 1px solid color-mix(in srgb, var(--zg-c) 45%, var(--zg-borde)); }
.zg-ahora-cielo.es-noche { background: linear-gradient(135deg, #14203d, var(--zg-panel) 80%); }
.zg-ahora-cielo > div { color: var(--text-main); min-width: 0; }
.zg-ahora-eye { margin: 0 0 4px; font-size: 12.5px; font-weight: 700; letter-spacing: .04em; color: var(--v2-texto-2); }
.zg-ahora-cielo h2 { margin: 0 0 10px; font: 800 clamp(26px, 3vw, 38px)/1.1 var(--font-display); }
.zg-ahora-tipos { margin: 0; display: flex; flex-wrap: wrap; gap: 6px; align-items: center; font-size: 13.5px; color: var(--v2-texto-2); }
.zg-lecturas { margin: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.zg-lecturas > div { display: grid; align-content: center; padding: 12px 16px; border-radius: 14px; background: var(--zg-panel); border: 1px solid var(--zg-borde); }
.zg-lecturas dt { font-size: 11px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--v2-texto-3); }
.zg-lecturas dd { margin: 2px 0 0; font: 800 28px/1.1 var(--font-display); font-variant-numeric: tabular-nums; }
.zg-lecturas small { font: 600 13px var(--font-primary); color: var(--v2-texto-2); }
.zg-horas { display: flex; gap: 8px; overflow-x: auto; padding-bottom: 8px; scrollbar-width: thin; }
.zg-hora { --zg-h: #9aa7b4; flex: 0 0 104px; display: grid; justify-items: center; gap: 5px; padding: 11px 6px; border-radius: 12px; text-align: center; background: var(--zg-panel); border: 1px solid var(--zg-borde); color: var(--zg-h); }
.zg-hora.is-cambio { border-color: var(--zg-h); background: color-mix(in srgb, var(--zg-h) 14%, var(--zg-panel)); }
.zg-hora-h { font: 800 15px var(--font-display); color: var(--text-main); }
.zg-hora-n { font-size: 11.5px; line-height: 1.25; color: var(--v2-texto-2); min-height: 2.5em; }
.zg-hora-t { display: flex; gap: 3px; } .zg-hora-t i { width: 12px; height: 12px; border-radius: 50%; display: block; }
.zg-hora-c { font: 800 14px var(--font-display); color: var(--text-main); }
.zg-efectos { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; counter-reset: ef; }
.zg-efectos li { counter-increment: ef; display: flex; gap: 14px; align-items: center; padding: 11px 14px; border-radius: 12px; background: var(--zg-panel); border: 1px solid var(--zg-borde); font-size: 15px; line-height: 1.5; }
.zg-efectos li::before { content: counter(ef); flex: 0 0 30px; height: 30px; display: grid; place-items: center; border-radius: 50%; font: 800 14px var(--font-display); background: var(--v2-amarillo); color: #141005; }
.zg-jefes { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 250px), 1fr)); gap: 10px; }
.zg-jefe { display: grid; grid-template-columns: 84px minmax(0, 1fr); gap: 12px; align-items: center; padding: 12px; border-radius: 12px; background: var(--zg-panel); border: 1px solid var(--zg-borde); }
.zg-jefe img { width: 84px; height: 84px; object-fit: contain; }
.zg-jefe h3 { margin: 0; font: 700 15px var(--font-display); }
.zg-jefe-tier { margin: 2px 0 6px; font-size: 12px; color: var(--v2-texto-3); }
.zg-jefe-pc { margin: 0; display: flex; justify-content: space-between; gap: 8px; font-size: 12.5px; color: var(--v2-texto-2); }
.zg-jefe-pc b { color: var(--nx-canal-txt); font-variant-numeric: tabular-nums; }
.zg-jefe-pc.is-sec b { color: var(--text-main); }
.zg-tabla { border-radius: 12px; border: 1px solid var(--zg-borde); background: var(--zg-panel); overflow: hidden; }
.zg-fila { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr) minmax(0, 1.5fr); gap: 12px; align-items: center; padding: 9px 14px; border-top: 1px solid var(--zg-borde); font-size: 14px; }
.zg-fila:first-child { border-top: 0; }
.zg-fila-cab { font-size: 11.5px; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; color: var(--v2-texto-3); background: var(--v2-tarjeta); }
.zg-fila-n { display: flex; align-items: center; gap: 10px; font-weight: 700; min-width: 0; }
.zg-fila-n img { width: 38px; height: 38px; object-fit: contain; }
.zg-especies { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 130px), 1fr)); gap: 10px; }
.zg-especie { --t: var(--nx-canal); display: grid; justify-items: center; gap: 2px; padding: 12px 8px; text-align: center; border-radius: 12px; color: var(--text-main); background: var(--zg-panel); border: 1px solid var(--zg-borde); border-bottom: 3px solid var(--t); }
.zg-especie:hover { border-color: var(--t); }
.zg-especie img { width: 84px; height: 84px; object-fit: contain; }
.zg-especie b { font: 700 13.5px var(--font-display); }
.zg-especie small { font-size: 11.5px; color: var(--v2-texto-3); }

/* ---------- Calculadora de IV (los iv-* los pinta el JS de la V1) ---------- */
.zg-cab-solo { grid-template-columns: minmax(0, 1fr); }
.zg-calc-caja { display: grid; grid-template-columns: 400px minmax(0, 1fr); gap: 18px; align-items: start; margin-bottom: 34px; }
.zg-calc-mandos { position: sticky; top: 80px; padding: 16px; border-radius: 16px; background: var(--zg-panel); border: 1px solid var(--zg-borde); min-width: 0; }
.zg-calc-res { padding: 16px; border-radius: 16px; background: var(--zg-panel); border: 1px solid var(--zg-borde); min-height: 260px; min-width: 0; }
.zg-calc-res-tit { margin: 0 0 12px; display: flex; gap: 9px; align-items: center; font-size: 12px; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; color: var(--nx-canal-txt); }
.zg-calc .iv-pestanas { display: grid; grid-template-columns: 1fr 1fr; gap: 4px; margin-bottom: 14px; padding: 4px; border-radius: 12px; background: var(--v2-tarjeta); }
.zg-calc .iv-pestanas button { display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 10px 8px; border: 0; border-radius: 9px; font: 800 13.5px var(--font-primary); cursor: pointer; background: transparent; color: var(--v2-texto-2); }
.zg-calc .iv-pestanas button.on { background: var(--v2-amarillo); color: #141005; }
.zg-calc .iv-mandos { display: grid; gap: 14px; }
.zg-calc .iv-grupo { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.zg-calc .iv-grupo[hidden] { display: none !important; }
.zg-calc .iv-campo { min-width: 0; }
.zg-calc .iv-campo label { display: block; margin-bottom: 6px; font-size: 11.5px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--v2-texto-2); }
.zg-calc .iv-campo input, .zg-calc .iv-campo select { width: 100%; min-width: 0; padding: 11px 13px; border-radius: 10px; font: 500 15px var(--font-primary); color: var(--text-main); background: var(--v2-tarjeta); border: 1px solid var(--zg-borde); font-variant-numeric: tabular-nums; }
.zg-calc .iv-campo input:focus, .zg-calc .iv-campo select:focus { outline: 2px solid var(--nx-canal-txt); outline-offset: 1px; }
.zg-calc .iv-valoracion { grid-column: 1 / -1; }
.zg-calc .iv-valoracion label span { display: block; margin-top: 2px; font-size: 11px; font-weight: 600; letter-spacing: 0; text-transform: none; color: var(--v2-texto-3); }
.zg-calc .iv-pista { display: block; margin-top: 6px; font-size: 12.5px; color: var(--v2-texto-2); }
.zg-calc .iv-pista b { color: var(--text-main); }
.zg-calc .iv-vacio { padding: 40px 12px; text-align: center; font-size: 14px; color: var(--v2-texto-2); }
.zg-calc .iv-ligas { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 230px), 1fr)); gap: 12px; }
.zg-calc .iv-liga { position: relative; padding: 16px 16px 16px 20px; border-radius: 12px; background: var(--v2-tarjeta); overflow: hidden; }
.zg-calc .iv-liga::before { content: ""; position: absolute; inset: 0 auto 0 0; width: 5px; background: var(--liga, var(--nx-canal)); }
.zg-calc .iv-liga h3 { margin: 0 0 4px; font: 800 15px var(--font-display); }
.zg-calc .iv-puesto { display: block; margin: 6px 0 2px; font: 800 34px/1 var(--font-display); font-variant-numeric: tabular-nums; color: var(--text-main); }
.zg-calc .iv-de { font-size: 12.5px; color: var(--v2-texto-2); }
.zg-calc .iv-liga dl { display: grid; grid-template-columns: auto 1fr; gap: 4px 14px; margin: 12px 0 0; font-size: 13px; }
.zg-calc .iv-liga dt { color: var(--v2-texto-2); } .zg-calc .iv-liga dd { margin: 0; font-weight: 700; text-align: right; font-variant-numeric: tabular-nums; }
.zg-calc .iv-medalla { display: inline-block; margin-top: 10px; padding: 3px 10px; border-radius: 99px; font-size: 11.5px; font-weight: 800; background: color-mix(in srgb, var(--liga, var(--nx-canal)) 22%, transparent); color: var(--text-main); }
.zg-calc .iv-nota, .zg-calc .iv-resumen { margin: 12px 0 0; font-size: 13px; line-height: 1.55; color: var(--v2-texto-2); }
.zg-calc .iv-resumen b { color: var(--text-main); }
.zg-calc .iv-unico { display: flex; align-items: center; flex-wrap: wrap; gap: 18px; padding: 16px 18px; border-radius: 12px; background: var(--v2-tarjeta); border-left: 5px solid var(--nx-canal); }
.zg-calc .iv-unico.es-bueno { border-left-color: #22c55e; } .zg-calc .iv-unico.es-perfecto { border-left-color: #f59e0b; }
.zg-calc .iv-unico-pct b { display: block; font: 800 40px/1 var(--font-display); color: var(--nx-canal-txt); }
.zg-calc .iv-unico.es-bueno .iv-unico-pct b { color: #16a34a; } .zg-calc .iv-unico.es-perfecto .iv-unico-pct b { color: var(--v2-activo); }
.zg-calc .iv-unico-pct span { font-size: 11.5px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--v2-texto-2); }
.zg-calc .iv-unico-datos { flex: 1 1 220px; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; text-align: center; }
.zg-calc .iv-unico-datos span { display: block; font-size: 11px; font-weight: 700; text-transform: uppercase; color: var(--v2-texto-3); }
.zg-calc .iv-unico-datos b { font: 800 22px var(--font-display); }
.zg-calc .iv-tabla-caja { overflow-x: auto; margin-top: 4px; }
.zg-calc table.iv-tabla, .zg-iv-tabla table { width: 100%; border-collapse: collapse; font-size: 13.5px; }
.zg-calc .iv-tabla th, .zg-iv-tabla th { text-align: left; padding: 8px 10px; font-size: 11px; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; color: var(--v2-texto-3); border-bottom: 2px solid var(--zg-borde); white-space: nowrap; }
.zg-calc .iv-tabla td, .zg-iv-tabla td { padding: 8px 10px; border-bottom: 1px solid var(--zg-borde); white-space: nowrap; font-variant-numeric: tabular-nums; }
.zg-calc .iv-pc { display: inline-block; padding: 2px 8px; border-radius: 99px; font-weight: 800; background: color-mix(in srgb, var(--nx-canal) 18%, transparent); }
.zg-calc-texto { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 30px; align-items: start; }
.zg-calc-texto > .zg-sec:last-child { grid-column: 1 / -1; }
.zg-formula { padding: 14px 16px; border-radius: 10px; font: 600 14px/1.9 ui-monospace, Menlo, Consolas, monospace; background: var(--zg-panel); border: 1px solid var(--zg-borde); overflow-x: auto; }
.zg-faq { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; align-items: start; }
.zg .iv-faq { padding: 12px 15px; border-radius: 12px; background: var(--zg-panel); border: 1px solid var(--zg-borde); }
.zg .iv-faq summary { cursor: pointer; font-weight: 700; font-size: 14.5px; }
.zg .iv-faq p { margin: 10px 0 0; font-size: 14.5px; line-height: 1.6; color: var(--v2-texto-2); }

/* ---------- Mejores IV ---------- */
.zg-buscador + .zg-fichas { margin-top: 0; }
.zg-fichas { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 150px), 1fr)); gap: 10px; margin-bottom: 34px; }
.zg-ficha-iv { display: grid; justify-items: center; align-content: start; gap: 4px; padding: 14px 8px 12px; text-align: center; border-radius: 12px; color: var(--text-main); background: var(--zg-panel); border: 1px solid var(--zg-borde); transition: transform .15s, border-color .15s; }
.zg-ficha-iv:hover { transform: translateY(-2px); border-color: var(--nx-canal); }
.zg-ficha-iv img { width: 68px; height: 68px; object-fit: contain; image-rendering: pixelated; }
.zg-ficha-iv b { font: 700 13.5px/1.25 var(--font-display); }
.zg-puesto { padding: 1px 9px; border-radius: 99px; font-size: 11.5px; font-weight: 800; background: color-mix(in srgb, var(--nx-canal) 16%, transparent); color: var(--nx-canal-txt); font-variant-numeric: tabular-nums; }
.zg-ivcab { display: grid; grid-template-columns: 190px minmax(0, 1fr) 290px; gap: 26px; align-items: center; margin-bottom: 28px; }
.zg-ivcab-img { display: grid; place-items: center; aspect-ratio: 1; border-radius: 20px; background: radial-gradient(circle at 50% 40%, color-mix(in srgb, var(--nx-canal) 26%, transparent), transparent 70%), var(--zg-panel); border: 1px solid var(--zg-borde); }
.zg-ivcab-img img { width: 82%; height: 82%; object-fit: contain; }
.zg-ivcab h1 { margin: 6px 0 10px; font: 800 clamp(26px, 3vw, 38px)/1.08 var(--font-display); letter-spacing: -.02em; }
.zg-titular { margin: 12px 0 0; padding: 11px 15px; border-radius: 12px; font-size: 15px; line-height: 1.5; background: color-mix(in srgb, var(--nx-canal) 12%, transparent); border: 1px solid color-mix(in srgb, var(--nx-canal) 35%, transparent); }
.zg-stats { display: grid; gap: 10px; padding: 16px; border-radius: var(--zg-radio); background: var(--zg-panel); border: 1px solid var(--zg-borde); }
.zg-stat { display: grid; grid-template-columns: 62px minmax(0, 1fr) 34px; gap: 10px; align-items: center; font-size: 13px; font-weight: 700; }
.zg-stat-b { height: 8px; border-radius: 8px; background: var(--v2-tarjeta); overflow: hidden; display: block; }
.zg-stat-b i { display: block; height: 100%; border-radius: 8px; background: var(--nx-canal); }
.zg-stat b { text-align: right; font-variant-numeric: tabular-nums; }
.zg-liga { margin-bottom: 22px; padding: 18px; border-radius: var(--zg-radio); background: var(--zg-panel); border: 1px solid var(--zg-borde); border-top: 5px solid var(--liga); }
.zg-liga > h2 { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; margin: 0 0 12px; font: 800 22px var(--font-display); }
.zg-liga > h2 small { font: 700 12.5px var(--font-primary); color: var(--v2-texto-3); }
.zg-liga h3 { margin: 0 0 8px; font-size: 12px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--v2-texto-3); }
.zg-perfecto { display: flex; gap: 10px; margin: 0 0 16px; padding: 11px 14px; border-radius: 10px; font-size: 14px; line-height: 1.55; background: var(--v2-tarjeta); }
.zg-perfecto i { margin-top: 4px; color: var(--nx-canal-txt); }
.zg-liga-dos { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 22px; align-items: start; }
.zg-liga-dos > :only-child { grid-column: 1 / -1; }
.zg-origenes { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.zg-origenes li { display: grid; gap: 4px; padding: 10px 12px; border-radius: 10px; font-size: 14px; line-height: 1.45; background: var(--v2-tarjeta); border-left: 4px solid var(--liga); }
.zg-origen-nom { font-weight: 700; } .zg-origen-nom small { display: block; font-weight: 500; font-size: 12px; color: var(--v2-texto-3); }
.zg-origen-res.is-no { color: var(--v2-texto-2); }
.zg-iv-tabla { overflow-x: auto; }
.zg-medalla { display: inline-grid; place-items: center; min-width: 26px; height: 26px; border-radius: 50%; font-weight: 800; font-size: 12px; background: var(--v2-tarjeta); }
.zg-iv-tabla tr:first-child .zg-medalla { background: var(--v2-amarillo); color: #141005; }
.zg-xl { display: inline-block; margin-left: 4px; padding: 0 6px; border-radius: 5px; font-size: 10px; font-weight: 800; background: color-mix(in srgb, var(--liga) 25%, transparent); }
.zg-pct { display: inline-block; padding: 2px 8px; border-radius: 99px; font-weight: 800; background: color-mix(in srgb, var(--liga) 20%, transparent); }

/* ---------- Botones y cifras ---------- */
.zg-btn { display: inline-flex; align-items: center; justify-content: center; gap: 9px; padding: 11px 18px; border-radius: 11px; font: 800 14.5px var(--font-primary); color: var(--text-main); background: var(--zg-panel); border: 1px solid var(--zg-borde); cursor: pointer; transition: border-color .15s, transform .15s; }
.zg-btn:hover { border-color: var(--nx-canal); }
.zg-btn-ppal { background: var(--v2-amarillo); color: #141005; border-color: var(--v2-amarillo); }
.zg-btn-ppal:hover { transform: translateY(-1px); border-color: var(--v2-amarillo); }
.zg-btn-ancho { width: 100%; padding: 13px 18px; font-size: 15px; }
.zg-btn-mini { padding: 7px 12px; font-size: 12.5px; margin-left: auto; }
.zg-btn:focus-visible, .zg-copiar:focus-visible, .zg-cupon-btn:focus-visible { outline: 2px solid var(--nx-canal-txt); outline-offset: 2px; }
.zg-acciones { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 18px; }
.zg-cifras { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.zg-cifras li { display: grid; gap: 4px; padding: 14px; border-radius: var(--zg-radio); background: var(--zg-panel); border: 1px solid var(--zg-borde); }
.zg-cifras b { font: 800 26px/1.1 var(--font-display); color: var(--nx-canal-txt); font-variant-numeric: tabular-nums; }
.zg-cifras span { font-size: 12px; font-weight: 700; color: var(--v2-texto-2); }
.zg-cifras-v { grid-template-columns: minmax(0, 1fr); }
.zg-cifras-v li { grid-template-columns: auto 1fr; align-items: baseline; gap: 12px; padding: 10px 14px; }
.zg-cifras-v b { font-size: 22px; }

/* ---------- Códigos amigo ---------- */
.zg-fc-cab { display: grid; grid-template-columns: minmax(0, 1fr) 380px; gap: 26px; align-items: end; margin-bottom: 26px; }
.zg-fc-cab h1 { margin: 8px 0 10px; font: 800 clamp(28px, 3.2vw, 42px)/1.06 var(--font-display); letter-spacing: -.02em; }
.zg-fc-cab h1::after { content: ""; display: block; width: 56px; height: 4px; margin-top: 12px; border-radius: 4px; background: var(--nx-canal); }
.zg-fc-dos { display: grid; grid-template-columns: minmax(0, 1fr) 380px; gap: 24px; align-items: start; margin-bottom: 36px; }
.zg-fc-lista { min-width: 0; }
.zg-fc-filtros { display: flex; flex-wrap: wrap; gap: 12px; align-items: end; padding: 14px 16px; margin-bottom: 16px; border-radius: var(--zg-radio); background: var(--zg-panel); border: 1px solid var(--zg-borde); }
.zg-fc-filtro { display: grid; gap: 5px; flex: 1 1 130px; min-width: 0; }
.zg-fc-filtro label, .zg-campo > label { font-size: 11.5px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--v2-texto-2); }
.zg-fc-filtro select, .zg-campo input:not([type=radio]):not([type=checkbox]), .zg-campo select { width: 100%; min-width: 0; padding: 10px 12px; border-radius: 10px; font: 500 14.5px var(--font-primary); color: var(--text-main); background: var(--v2-tarjeta); border: 1px solid var(--zg-borde); }
.zg-fc-filtro select:focus-visible, .zg-campo input:focus-visible, .zg-campo select:focus-visible { outline: 2px solid var(--nx-canal-txt); outline-offset: 1px; }
.zg-fc-res { flex: 1 1 100%; margin: 0; font-size: 13px; color: var(--v2-texto-2); }
.zg-fc-res a { color: var(--nx-canal-txt); font-weight: 700; text-decoration: underline; }
.zg-fc-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-bottom: 20px; }
.zg-fc-vacio { grid-column: 1 / -1; }
.zg-carnet { --zg-eq: var(--border-color); position: relative; display: grid; grid-template-rows: 1fr auto; border-radius: var(--zg-radio); overflow: hidden; background: var(--zg-panel); border: 1px solid var(--zg-borde); border-left: 6px solid var(--zg-eq); transition: border-color .15s; }
.zg-carnet:hover { border-color: var(--zg-eq); }
.zg-carnet-eq { position: absolute; right: 10px; top: 10px; width: 54px; height: 54px; object-fit: contain; opacity: .9; pointer-events: none; }
.zg-carnet-cuerpo { display: grid; gap: 9px; padding: 14px 76px 12px 14px; min-width: 0; }
.zg-carnet-quien { display: flex; align-items: center; gap: 8px; min-width: 0; flex-wrap: wrap; }
.zg-carnet-quien img { width: 22px; height: 17px; object-fit: cover; border-radius: 3px; flex: 0 0 auto; }
.zg-carnet-nombre { font: 800 16px var(--font-display); overflow-wrap: anywhere; }
.zg-carnet-nivel { padding: 1px 8px; border-radius: 99px; font-size: 11px; font-weight: 800; background: color-mix(in srgb, var(--nx-canal) 16%, transparent); color: var(--nx-canal-txt); }
.zg-carnet-codigo { justify-self: start; padding: 6px 12px; border-radius: 9px; font: 700 18px ui-monospace, "Cascadia Mono", Consolas, monospace; letter-spacing: .06em; background: var(--v2-tarjeta); border: 1px dashed var(--zg-borde); user-select: all; font-variant-numeric: tabular-nums; }
.zg-carnet-busca { display: flex; flex-wrap: wrap; gap: 5px; min-height: 22px; }
.zg-carnet-busca span { padding: 2px 9px; border-radius: 99px; font-size: 11.5px; font-weight: 700; background: var(--v2-tarjeta); color: var(--v2-texto-2); }
.zg-carnet-pie { display: flex; gap: 14px; font-size: 12px; color: var(--v2-texto-3); }
.zg-copiar { display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%; padding: 11px; border: 0; border-top: 1px solid var(--zg-borde); font: 800 14px var(--font-primary); cursor: pointer; color: #141005; background: var(--v2-amarillo); }
.zg-copiar:hover { filter: brightness(1.06); }
.zg-copiar.ok { background: #22c55e; }
.zg-paginas { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; }
.zg-paginas a, .zg-paginas span { min-width: 38px; padding: 8px 12px; text-align: center; border-radius: 10px; font-weight: 800; font-size: 14px; color: var(--text-main); background: var(--zg-panel); border: 1px solid var(--zg-borde); }
.zg-paginas .actual { background: var(--v2-amarillo); border-color: var(--v2-amarillo); color: #141005; }
.zg-fc-form { position: sticky; top: 80px; padding: 18px; border-radius: 16px; background: var(--zg-panel); border: 1px solid var(--zg-borde); border-top: 4px solid var(--v2-amarillo); scroll-margin-top: 90px; max-height: calc(100vh - 100px); overflow-y: auto; }
.zg-fc-form h2 { margin: 0 0 6px; font: 800 20px var(--font-display); display: flex; gap: 9px; align-items: center; }
.zg-fc-form h2 i { color: var(--nx-canal-txt); }
.zg-fc-form > p { margin: 0; font-size: 13.5px; line-height: 1.55; color: var(--v2-texto-2); }
.zg-form { display: grid; gap: 14px; margin-top: 16px; }
.zg-campo { display: grid; gap: 6px; min-width: 0; }
.zg-pais { display: flex; align-items: center; gap: 9px; }
.zg-pais img { width: 30px; height: 23px; object-fit: cover; border-radius: 3px; flex: 0 0 auto; }
#fc-codigo { font-family: ui-monospace, Consolas, monospace; letter-spacing: .1em; }
.zg-opciones { display: flex; flex-wrap: wrap; gap: 7px; }
.zg-opciones input { position: absolute; opacity: 0; pointer-events: none; }
.zg-opciones span { display: inline-flex; align-items: center; gap: 7px; padding: 7px 12px; border-radius: 999px; font-size: 13px; font-weight: 700; cursor: pointer; color: var(--v2-texto-2); background: var(--v2-tarjeta); border: 1px solid var(--zg-borde); }
.zg-opciones span img { width: 22px; height: 22px; object-fit: contain; }
.zg-opciones input:checked + span { color: var(--text-main); border-color: var(--eq, var(--nx-canal)); background: color-mix(in srgb, var(--eq, var(--nx-canal)) 16%, var(--zg-panel)); }
.zg-opciones input:focus-visible + span { outline: 2px solid var(--nx-canal-txt); outline-offset: 2px; }
.zg-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.zg-fc-guia { max-width: 940px; }
.zg-fc-lead { margin: 0 0 28px; font-size: 16px; line-height: 1.7; }
.zg-pasos-fc { list-style: none; margin: 0 0 16px; padding: 0; display: grid; gap: 8px; counter-reset: pf; }
.zg-pasos-fc li { counter-increment: pf; display: flex; align-items: center; gap: 14px; padding: 11px 14px; border-radius: 12px; font-size: 15px; line-height: 1.5; background: var(--zg-panel); border: 1px solid var(--zg-borde); }
.zg-pasos-fc li::before { content: counter(pf); flex: 0 0 30px; height: 30px; display: grid; place-items: center; border-radius: 50%; font: 800 14px var(--font-display); background: var(--v2-amarillo); color: #141005; }
.zg-prosa-p { margin: 0 0 14px; font-size: 15.5px; line-height: 1.68; }
.zg-prosa-p a, .zg-nota a { color: var(--nx-canal-txt); font-weight: 700; text-decoration: underline; }
.zg-niveles { display: grid; gap: 6px; margin: 0 0 16px; }
.zg-nivel { display: grid; grid-template-columns: 1.3fr 1.3fr .8fr 2.3fr; gap: 12px; align-items: center; padding: 10px 14px; border-radius: 10px; font-size: 14px; line-height: 1.4; background: var(--zg-panel); border: 1px solid var(--zg-borde); }
.zg-nivel-cab { background: transparent; border-color: transparent; font-size: 11.5px; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; color: var(--v2-texto-3); }
.zg-nivel > b { font-family: var(--font-display); }

/* ---------- Códigos de regalo ---------- */
.zg-cod-dos { display: grid; grid-template-columns: 220px minmax(0, 1fr); gap: 24px; align-items: start; margin-bottom: 30px; }
.zg-cod-nav { position: sticky; top: 80px; padding: 14px; border-radius: var(--zg-radio); background: var(--zg-panel); border: 1px solid var(--zg-borde); }
.zg-cod-nav p { margin: 0 0 8px; font-size: 11px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--v2-texto-3); }
.zg-cod-nav ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 2px; }
.zg-cod-nav a { --gc: var(--nx-canal); display: flex; align-items: center; gap: 9px; padding: 8px 9px; border-radius: 8px; font-size: 13.5px; font-weight: 600; color: var(--v2-texto-2); }
.zg-cod-nav a i { width: 18px; text-align: center; color: var(--gc); }
.zg-cod-nav a span { flex: 1 1 auto; min-width: 0; }
.zg-cod-nav a b { font-size: 11.5px; padding: 1px 7px; border-radius: 99px; background: var(--v2-tarjeta); }
.zg-cod-nav a:hover { background: var(--v2-tarjeta-hover); color: var(--text-main); }
.zg-cod-main { display: grid; gap: 22px; min-width: 0; }
.zg-juego { --gc: var(--nx-canal); padding: 16px; border-radius: var(--zg-radio); background: var(--zg-panel); border: 1px solid var(--zg-borde); border-top: 4px solid var(--gc); scroll-margin-top: 90px; min-width: 0; }
.zg-juego-cab { display: flex; align-items: center; gap: 12px; margin-bottom: 10px; flex-wrap: wrap; }
.zg-juego-ico { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 11px; font-size: 18px; background: var(--gc); color: #fff; text-shadow: 0 1px 2px rgba(0, 0, 0, .35); }
.zg-juego-cab h2 { margin: 0; font: 800 20px/1.2 var(--font-display); }
.zg-juego-cab div > span { font-size: 12.5px; color: var(--v2-texto-3); }
.zg-juego-intro { margin: 0 0 10px; font-size: 14.5px; line-height: 1.6; color: var(--v2-texto-2); }
.zg-como { margin-bottom: 14px; padding: 10px 14px; border-radius: 10px; background: var(--v2-tarjeta); }
.zg-como summary { cursor: pointer; font-weight: 700; font-size: 14px; }
.zg-como summary i { color: var(--nx-canal-txt); margin-right: 6px; }
.zg-como p { margin: 8px 0 0; font-size: 14px; line-height: 1.6; color: var(--v2-texto-2); }
.zg-cupones { display: grid; gap: 8px; }
.zg-cupon { display: grid; grid-template-columns: minmax(0, 1fr) 270px; gap: 14px; align-items: center; padding: 12px 12px 12px 16px; border-radius: 12px; background: var(--v2-tarjeta); border-left: 4px solid var(--gc); transition: background .2s; }
.zg-cupon.copiado { background: color-mix(in srgb, #22c55e 16%, var(--v2-tarjeta)); }
.zg-cupon-info { display: grid; gap: 5px; min-width: 0; }
.zg-cupon-premio { margin: 0; font-weight: 700; font-size: 15px; line-height: 1.4; }
.zg-cupon-premio i { color: var(--nx-canal-txt); margin-right: 5px; }
.zg-cupon-nota { margin: 0; font-size: 13px; line-height: 1.5; color: var(--v2-texto-2); }
.zg-cupon-meta { display: flex; flex-wrap: wrap; gap: 6px 14px; align-items: center; font-size: 12.5px; }
.zg-cad { color: var(--v2-texto-2); font-weight: 600; }
.zg-cad.urgente { color: #d64545; font-weight: 800; }
[data-theme="dark"] .zg-cad.urgente { color: #ff8a8a; }
.zg-cupon-fuente { font-weight: 700; color: var(--nx-canal-txt); text-decoration: underline; }
.zg-cupon-btn { display: grid; grid-template-columns: minmax(0, 1fr); gap: 2px 10px; align-items: center; width: 100%; padding: 9px 12px; border-radius: 10px; text-align: left; cursor: pointer; color: var(--text-main); background: var(--zg-panel); border: 1px dashed var(--nx-canal); font-family: var(--font-primary); }
.zg-cupon-btn:hover { background: color-mix(in srgb, var(--v2-amarillo) 14%, var(--zg-panel)); }
.zg-cupon-label { grid-column: 1 / -1; font-size: 10.5px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--v2-texto-3); }
.zg-cupon-code { font: 800 14px ui-monospace, "Cascadia Mono", Consolas, monospace; letter-spacing: .03em; overflow-wrap: anywhere; min-width: 0; }
.zg-cupon-copiar { display: inline-flex; justify-content: center; margin-top: 4px; gap: 6px; align-items: center; padding: 6px 10px; border-radius: 8px; font-size: 12.5px; font-weight: 800; background: var(--v2-amarillo); color: #141005; }
.zg-seguir { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin: 8px 0 20px; }
.zg-seguir a { display: flex; gap: 12px; align-items: flex-start; padding: 13px; border-radius: 12px; color: var(--text-main); background: var(--zg-panel); border: 1px solid var(--zg-borde); font-size: 12.5px; line-height: 1.45; color: var(--v2-texto-2); }
.zg-seguir a:hover { border-color: var(--nx-canal); }
.zg-seguir a i { margin-top: 3px; font-size: 18px; color: var(--nx-canal-txt); }
.zg-seguir strong { display: block; margin-bottom: 2px; font: 700 14px var(--font-display); color: var(--text-main); }
.zg-credito { margin: 0; font-size: 12.5px; line-height: 1.55; color: var(--v2-texto-3); }
.zg-credito a { color: var(--nx-canal-txt); font-weight: 700; }
.zg-toast { position: fixed; left: 50%; bottom: 28px; z-index: 60; transform: translate(-50%, 20px); padding: 10px 18px; border-radius: 10px; font-weight: 700; font-size: 14px; background: #141005; color: #fff; opacity: 0; pointer-events: none; transition: opacity .2s, transform .2s; }
.zg-toast.visible { opacity: 1; transform: translate(-50%, 0); }

/* ---------- Adaptación ---------- */
@media (max-width: 1180px) {
    .zg-clima-dos, .zg-fc-dos, .zg-fc-cab { grid-template-columns: minmax(0, 1fr); }
    .zg-lateral, .zg-fc-form { position: static; max-height: none; }
    .zg-ivcab { grid-template-columns: 170px minmax(0, 1fr); }
    .zg-ivcab .zg-stats { grid-column: 1 / -1; }
    .zg-calc-caja { grid-template-columns: minmax(0, 1fr); }
    .zg-calc-mandos { position: static; }
    .zg-seguir { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 900px) {
    .zg-cab { grid-template-columns: minmax(0, 1fr); gap: 16px; }
    .zg-sello { grid-template-columns: auto 1fr; align-items: center; gap: 4px 14px; }
    .zg-sello small { grid-column: 1 / -1; }
    .zg-evs, .zg-tareas, .zg-dia-lista, .zg-ciudades, .zg-bonus, .zg-fc-grid, .zg-faq, .zg-calc-texto, .zg-liga-dos { grid-template-columns: minmax(0, 1fr); }
    .zg-evhero, .zg-evlayout, .zg-ahora, .zg-cod-dos { grid-template-columns: minmax(0, 1fr); }
    .zg-indice, .zg-cod-nav { position: static; }
    .zg-indice ul, .zg-cod-nav ul { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .zg-huevo { grid-template-columns: minmax(0, 1fr); }
    .zg-huevo-cab { position: static; flex-direction: row; justify-content: flex-start; padding: 12px; text-align: left; }
    .zg-huevo-ico { width: 48px; height: 48px; font-size: 22px; }
    .zg-cupon { grid-template-columns: minmax(0, 1fr); }
    .zg-ivcab { grid-template-columns: minmax(0, 1fr); }
    .zg-ivcab-img { max-width: 180px; }
    .zg-nivel { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
    .zg-nivel-cab { display: none; }
    .zg-nivel > b { grid-column: 1 / -1; }
}
@media (max-width: 900px) { .zg-zona { display: none; } }
@media (max-width: 560px) {
    .zg-fc-cab .zg-cifras { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .zg-fc-cab .zg-cifras b { font-size: 18px; }
    .zg-ev { grid-template-columns: 112px minmax(0, 1fr); }
    .zg-dia { grid-template-columns: 58px minmax(0, 1fr); gap: 10px; padding: 8px; }
    .zg-dia-lista a { grid-template-columns: 56px minmax(0, 1fr); }
    .zg-mini { width: 56px; height: 42px; }
    .zg-pase-fila { grid-template-columns: minmax(0, 1fr); }
    .zg-pase-cab { display: none; }
    .zg-fila { grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); }
    .zg-fila > :nth-child(3) { grid-column: 1 / -1; font-size: 12.5px; color: var(--v2-texto-2); }
    .zg-fila-cab > :nth-child(3) { display: none; }
    .zg-calc .iv-unico-datos { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .zg-seguir { grid-template-columns: minmax(0, 1fr); }
    .zg-buscador { top: 56px; }
    .zg-indice ul, .zg-cod-nav ul { grid-template-columns: minmax(0, 1fr); }
    .zg-banda { padding: 12px; }
}