/* Hosteate · tema claro del RESTO de la web pública, estilo «ChatGPT modo claro».
   La carga v4_cabeza() (app/v4.php) en todas las páginas que la usan, DESPUÉS de v4-web.css y de
   v4-claro.css (tokens, barra, botones, tarjetas comunes, pie y cookies, que valen tal cual).
   Aquí sólo lo propio de cada página: precios/*, servidores-ia, servidores-juego, guías, legales,
   kit digital, looking glass, 404 y acceso (login/registro/recuperar).
   Todo cuelga de html[data-v4][data-tema="claro"]: data-v4 lo pone sólo v4_cabeza() (la portada
   no lo lleva) y data-tema sólo con la cookie hst_tema=claro o ?tema=claro. En oscuro no cambia nada.
   NO toca las cabeceras nuevas de producto (.pt-*, v4-producto-hero.css): traen su propio claro.
   Paleta: fondo #fff/#f7f7f8, tarjetas blancas borde #e5e5e5, tinta #0d0d0d/#5d5d5d/#8e8e8e,
   azul #3b5bff, verde #1a7f37. */

/* ── 0. Superficies: en estas páginas --sup pinta cajas sin borde; en blanco serían invisibles ── */
html[data-v4][data-tema="claro"]{--sup:#f7f7f8;--sup-2:#f2f2f3;--sup-3:#ececee;--fondo-2:#f7f7f8;--fondo-3:#efeff1}

/* ── 1. Piezas comunes de v4-web.css que quedaban oscuras ── */
html[data-v4][data-tema="claro"] .menu a:hover{background:#f4f4f5}
html[data-v4][data-tema="claro"] :is(.plan .precio,.dial-precio,.rasgos,.rasgos li,.ia-mod .pie-m,.hs-op .ms){border-color:#ececec}
html[data-v4][data-tema="claro"] .ia-mod .pie-m:hover{border-color:#dcdcdf}
html[data-v4][data-tema="claro"] .plan .btn:hover,html[data-v4][data-tema="claro"] .btn:hover{background:#e6e6e8}
html[data-v4][data-tema="claro"] :is(.btn.lleno,.btn.azul,.plan.dest .btn,.plan .btn.lleno):hover{background:var(--azul-h);color:#fff}
html[data-v4][data-tema="claro"] .gran .precio-esq b{color:var(--tinta)}
html[data-v4][data-tema="claro"] .selector .op:hover{background:#f4f4f5}
html[data-v4][data-tema="claro"] .selector .marca{border-color:#c9c9cd}
/* Barras, medidores y rejillas de núcleos: la pista apagada en gris claro */
html[data-v4][data-tema="claro"] :is(.nucleos i:not(.on),.barra-r,.br,.hs-barras i,.co-medidor,.barra-v,.pila i,.gv-barras){background:#e8e8ea}
html[data-v4][data-tema="claro"] .fila.dest .br{background:rgba(59,91,255,.14)}
html[data-v4][data-tema="claro"] .fila.dest .c-rec,html[data-v4][data-tema="claro"] .c-rec{border-top-color:#ececec}
html[data-v4][data-tema="claro"] .rango::-webkit-slider-runnable-track{background:linear-gradient(90deg,var(--azul) var(--p),#e5e5e5 var(--p))}
html[data-v4][data-tema="claro"] .rango::-moz-range-track{background:#e5e5e5}
html[data-v4][data-tema="claro"] .rango::-webkit-slider-thumb{background:#fff;box-shadow:0 0 0 4px rgba(59,91,255,.30),0 1px 4px rgba(0,0,0,.25)}
html[data-v4][data-tema="claro"] .rango::-moz-range-thumb{background:#fff;box-shadow:0 0 0 4px rgba(59,91,255,.30),0 1px 4px rgba(0,0,0,.25)}
html[data-v4][data-tema="claro"] .mini-term{background:#f7f7f8;box-shadow:inset 0 0 0 1px #e5e5e5}
html[data-v4][data-tema="claro"] .dm-aviso .cal i::after{background:#d4d4d8}
html[data-v4][data-tema="claro"] .dm-aviso .cal i.av::after{background:#3b5bff}
html[data-v4][data-tema="claro"] :is(.dm-anillo span,.dm-busca,.co-dir){border-color:#e5e5e5;background:rgba(255,255,255,.9);box-shadow:0 1px 2px rgba(0,0,0,.04)}
html[data-v4][data-tema="claro"] .dm-busca{box-shadow:0 1px 2px rgba(0,0,0,.04),0 12px 32px -14px rgba(0,0,0,.14)}
html[data-v4][data-tema="claro"] .dm-sug .dm-ext{background:#f0f0f1;color:var(--tinta)}
html[data-v4][data-tema="claro"] :is(.dm-sug .dm-ext:hover,.dm-sug .dm-ext[aria-pressed="true"]){background:rgba(59,91,255,.08);color:#2b47e0;box-shadow:inset 0 0 0 1px rgba(59,91,255,.45)}
html[data-v4][data-tema="claro"] .ia-buscar{background:#fff;box-shadow:inset 0 0 0 1px #e5e5e5}
html[data-v4][data-tema="claro"] .ia-vacio{border-color:#d4d4d8;background:#fafafa}
html[data-v4][data-tema="claro"] :is(.ubi,.selector,.hs-op) .cod{background:#fff;box-shadow:inset 0 0 0 1px #e5e5e5}
html[data-v4][data-tema="claro"] :is(.selector .op:has(input:checked),.hs-op:has(input:checked),.hs-op.sel) .cod{background:var(--azul);color:#fff;box-shadow:none}
html[data-v4][data-tema="claro"] .tabla-c,html[data-v4][data-tema="claro"] table{border-color:#ececec}

/* Fotos de producto (fondo negro de estudio) en las tarjetas del bento: mismo criterio que el
   hero de la portada — en negativo y en gris, así el objeto queda dibujado sobre blanco. */
html[data-v4][data-tema="claro"] main img[src*="/assets/img/v4/"]:not(.hero-ft):not([src*="/v4/claro/"]){filter:invert(1) grayscale(1) contrast(.92) brightness(1.02)}
/* Gemelas blancas (assets/img/v4/claro/): ya son claras, sin invertir */
html[data-v4][data-tema="claro"] main img[src*="/v4/claro/"]{filter:none}
html[data-v4][data-tema="claro"] .celda.con-foto::before{background:linear-gradient(180deg,transparent 48%,rgba(255,255,255,.96) 70%)}
/* Tarjeta grande con foto (.gran): velo blanco desde abajo y texto en tinta */
html[data-v4][data-tema="claro"] .gran{color:var(--tinta);background:#fff;box-shadow:inset 0 0 0 1px #e5e5e5}
html[data-v4][data-tema="claro"] .gran::before{background:linear-gradient(180deg,rgba(255,255,255,0) 30%,rgba(255,255,255,.92) 78%)}
html[data-v4][data-tema="claro"] .gran .ojo,html[data-v4][data-tema="claro"] .gran .precio-esq{color:var(--tinta-3)}
html[data-v4][data-tema="claro"] .gran p{color:var(--tinta-2)}
html[data-v4][data-tema="claro"] .gran .btn{background:var(--azul);border-color:var(--azul);color:#fff}
html[data-v4][data-tema="claro"] .gran:hover .btn{background:var(--azul-h);border-color:var(--azul-h)}
html[data-v4][data-tema="claro"] .ia-ent-l{color:var(--tinta-2)}
html[data-v4][data-tema="claro"] .donde-vis .marca-esq{color:var(--tinta-3)}
/* Vídeos transparentes (tarjetas oscuras translúcidas): igual que en la portada */
html[data-v4][data-tema="claro"] :is(.celda,.e404-clip) video{filter:invert(1) hue-rotate(180deg) drop-shadow(0 14px 22px rgba(0,0,0,.10))}
html[data-v4][data-tema="claro"] .e404-clip img{filter:invert(1) hue-rotate(180deg)}

/* ── 2. Configurador del VPS (v4-configurador.css) ── */
html[data-v4][data-tema="claro"] .cfg :is(.cfg-plan,.cfg-ubi,.cfg-fam,.cfg-app){background:#fff;border-color:#e5e5e5}
html[data-v4][data-tema="claro"] .cfg :is(.cfg-plan,.cfg-ubi,.cfg-fam,.cfg-app):hover{border-color:#cfcfd3}
html[data-v4][data-tema="claro"] .cfg :is(.cfg-plan,.cfg-ubi,.cfg-fam,.cfg-app):has(input:checked){border-color:var(--azul);background:rgba(59,91,255,.05)}
html[data-v4][data-tema="claro"] .cfg-app-ic{box-shadow:inset 0 0 0 1px #ececec}
html[data-v4][data-tema="claro"] .cfg-ips-b:hover{background:#e6e6e8}
html[data-v4][data-tema="claro"] .cfg-n{background:#ececee}

/* ── 3. Servidores de juego (v4-juegos.css) ── */
/* Las portadas de los juegos se quedan oscuras a propósito: los logos son blancos y de color */
html[data-v4][data-tema="claro"] .jg-hero::before{background:linear-gradient(90deg,rgba(255,255,255,.9) 0%,rgba(255,255,255,.45) 55%,transparent 80%)}
@media (max-width:860px){html[data-v4][data-tema="claro"] .jg-hero::before{background:linear-gradient(180deg,transparent 20%,rgba(255,255,255,.7) 60%)}}
html[data-v4][data-tema="claro"] .jg-tarjeta{background:#fff;box-shadow:0 0 0 1px #e5e5e5,0 1px 2px rgba(0,0,0,.04)}
html[data-v4][data-tema="claro"] .jg-tarjeta:hover{background:#fff;box-shadow:0 0 0 1px #d4d4d8,0 18px 40px -24px rgba(59,91,255,.35)}
html[data-v4][data-tema="claro"] .jg-mono{background:linear-gradient(145deg,#f4f4f5,#e4e4e7);box-shadow:inset 0 0 0 1px rgba(0,0,0,.06);color:var(--tinta)}
html[data-v4][data-tema="claro"] .jg-dialogo{background:#fff;box-shadow:0 0 0 1px #e5e5e5,0 40px 90px -30px rgba(0,0,0,.35)}
html[data-v4][data-tema="claro"] .jg-dialogo::backdrop{background:rgba(0,0,0,.28)}
html[data-v4][data-tema="claro"] .jg-cerrar:hover{background:#e6e6e8}
html[data-v4][data-tema="claro"] .jg-plan .pr{border-bottom-color:#ececec}
html[data-v4][data-tema="claro"] .jg-plan li i{background:#e8e8ea}

/* ── 4. Looking glass (v4-looking-glass.css) ── */
html[data-v4][data-tema="claro"] .lg-ubi.medida .lg-ms b{color:var(--tinta)}
html[data-v4][data-tema="claro"] .lg-pildoras input:checked+span{background:rgba(59,91,255,.08);color:#2b47e0;box-shadow:inset 0 0 0 1px var(--azul)}
html[data-v4][data-tema="claro"] .lg-copia:hover{background:#e6e6e8}
html[data-v4][data-tema="claro"] :is(.lg-cli pre,.lg-term){background:#f7f7f8;box-shadow:inset 0 0 0 1px #e5e5e5;color:var(--tinta)}
html[data-v4][data-tema="claro"] .lg-term-cab{border-bottom-color:#e5e5e5}
html[data-v4][data-tema="claro"] .lg-term-pts i{background:#d4d4d8}

/* ── 5. 404 (v4-404.css) ── */
html[data-v4][data-tema="claro"] .e404-ruta{background:#f7f7f8;box-shadow:inset 0 0 0 1px #ececec}
html[data-v4][data-tema="claro"] .e404-ruta code{background:#fff;box-shadow:inset 0 0 0 1px #e5e5e5}
html[data-v4][data-tema="claro"] .e404-sug a{text-decoration-color:rgba(59,91,255,.4)}
html[data-v4][data-tema="claro"] .e404-busca{background:#fff;border-color:#e5e5e5}
html[data-v4][data-tema="claro"] .e404-busca input::placeholder{color:#8e8e8e}
html[data-v4][data-tema="claro"] .e404-dest a{background:#fff;box-shadow:inset 0 0 0 1px #e5e5e5,0 1px 2px rgba(0,0,0,.04)}
html[data-v4][data-tema="claro"] :is(.e404-dest a:hover,.e404-dest li.primero a){background:#fafafa;box-shadow:inset 0 0 0 1px #d4d4d8}
html[data-v4][data-tema="claro"] .e404-dest li.primero a{box-shadow:inset 0 0 0 1px rgba(59,91,255,.55)}
html[data-v4][data-tema="claro"] .e404-ayuda{background:#f7f7f8;box-shadow:inset 0 0 0 1px #ececec}
html[data-v4][data-tema="claro"] .e404-ayuda .btn{background:#fff;box-shadow:inset 0 0 0 1px #e5e5e5}

/* ── 6. Guías (v4-guias.css: sus propios tokens --g-*) ── */
html[data-v4][data-tema="claro"] .guia{--g-linea:#ececec;--g-linea-2:#e5e5e5;--g-t1:#0d0d0d;--g-t2:#3f3f46;--g-t3:#8e8e8e;
  --g-azul-c:#3b5bff;--g-azul-tx:#2b47e0;--g-verde:#1a7f37;--g-sup:#f7f7f8;--g-sup-2:#ffffff}
html[data-v4][data-tema="claro"] .guia-cab::before{background:radial-gradient(closest-side,rgba(59,91,255,.10),rgba(59,91,255,.03) 55%,transparent)}
html[data-v4][data-tema="claro"] .guia-ojo{background:rgba(59,91,255,.08)}
html[data-v4][data-tema="claro"] .guia-meta li{box-shadow:inset 0 0 0 1px #e5e5e5,0 1px 2px rgba(0,0,0,.03)}
html[data-v4][data-tema="claro"] .guia-meta li:first-child{background:rgba(59,91,255,.08);color:#2b47e0;box-shadow:inset 0 0 0 1px rgba(59,91,255,.3)}
/* Tarjetas del panel flotando (mismas que .ht de la portada en claro) */
html[data-v4][data-tema="claro"] .gv-t{background:rgba(255,255,255,.86);border-color:#e5e5e5;box-shadow:0 1px 2px rgba(0,0,0,.04),0 24px 50px -22px rgba(0,0,0,.22)}
html[data-v4][data-tema="claro"] .gv-ico{background:#f4f4f5;border-color:#ececec}
html[data-v4][data-tema="claro"] .gv-plan{background:#f0f0f1}
@keyframes gvPlanClaro{0%,22%{background:#3b5bff;color:#fff;box-shadow:0 8px 22px -10px rgba(59,91,255,.7)}27%,100%{background:#f0f0f1;color:var(--g-t2);box-shadow:none}}
html[data-v4][data-tema="claro"] .gv-plan{animation-name:gvPlanClaro}
html[data-v4][data-tema="claro"] .gv-ciudad{fill:#3b5bff}
html[data-v4][data-tema="claro"] .gv-term-cab i{background:#d4d4d8}
@keyframes gvTickFClaro{0%,4%{background:#f0f0f1;box-shadow:inset 0 0 0 1px #e5e5e5}9%,88%{background:#1a7f37;box-shadow:none}96%,100%{background:#f0f0f1;box-shadow:inset 0 0 0 1px #e5e5e5}}
html[data-v4][data-tema="claro"] .gv-tick{background:#f0f0f1;animation-name:gvTickFClaro}
/* Índice, texto y tablas */
html[data-v4][data-tema="claro"] .guia-indice{background:#fff;box-shadow:inset 0 0 0 1px #e5e5e5,0 1px 2px rgba(0,0,0,.04)}
html[data-v4][data-tema="claro"] .guia-progreso{background:#ececee}
html[data-v4][data-tema="claro"] :is(.guia-indice a:hover,.guia-ancla:hover){background:#f4f4f5}
html[data-v4][data-tema="claro"] .guia-ancla.copiada::after{background:#0d0d0d;color:#fff;box-shadow:none}
html[data-v4][data-tema="claro"] .guia-texto code{background:#f4f4f5;box-shadow:inset 0 0 0 1px #e5e5e5}
html[data-v4][data-tema="claro"] .guia-tabla{background:#fff;box-shadow:inset 0 0 0 1px #e5e5e5;scrollbar-color:#d4d4d8 transparent}
html[data-v4][data-tema="claro"] .guia-tabla th{background:#f7f7f8}
html[data-v4][data-tema="claro"] .guia-tabla tbody tr:hover{background:#fafafa}
@media (max-width:760px){html[data-v4][data-tema="claro"] .guia-tabla tr{background:#fff}}

/* ── 7. Legales y Kit Digital (v4-legal*.css, v4-kit-digital.css) ── */
html[data-v4][data-tema="claro"] .kd-logos{box-shadow:inset 0 0 0 1px #ececec}

/* ── 8. Acceso: login, registro y recuperar (v4-acceso.css redefine los tokens en .acceso) ── */
html[data-v4][data-tema="claro"] .acceso{--tinta:#0d0d0d;--tinta-2:#5d5d5d;--tinta-3:#8e8e8e;--linea:#ececec;--linea-2:#e5e5e5;--sup:#ffffff;--vz-sup:#ffffff;--vz-verde:#1a7f37}
html[data-v4][data-tema="claro"] .acceso .campo input,html[data-v4][data-tema="claro"] .acceso .campo select,html[data-v4][data-tema="claro"] .acceso .campo textarea{background:#fff;border-color:#e0e0e0}
html[data-v4][data-tema="claro"] .acceso .campo input:hover,html[data-v4][data-tema="claro"] .acceso .campo select:hover{border-color:#c9c9cd}
html[data-v4][data-tema="claro"] .acceso .campo input:focus,html[data-v4][data-tema="claro"] .acceso .campo select:focus{box-shadow:0 0 0 4px rgba(59,91,255,.14)}
html[data-v4][data-tema="claro"] .acceso .social-btn:hover{background:#f7f7f8;border-color:#d4d4d8}
html[data-v4][data-tema="claro"] .acceso :is(a,button,.btn,.social-btn,.captcha-tirador):focus-visible{outline-color:#3b5bff}
html[data-v4][data-tema="claro"] .captcha-pista{background:#f7f7f8}
html[data-v4][data-tema="claro"] .captcha-hueco{border-color:#c9c9cd}
html[data-v4][data-tema="claro"] .consiente-box{border-color:#c9c9cd;background:#fff}
html[data-v4][data-tema="claro"] .reg-ubi-op{background:#fff}
html[data-v4][data-tema="claro"] .reg-ubi-op:hover{border-color:#c9c9cd}
html[data-v4][data-tema="claro"] .reg-ubi-cod{background:#f0f0f1}
html[data-v4][data-tema="claro"] .reg-ubi-op input:checked~.reg-ubi-cod{background:var(--azul);color:#fff}
html[data-v4][data-tema="claro"] .reg-ubi-op:has(input:checked){background:rgba(59,91,255,.05)}
html[data-v4][data-tema="claro"] .aviso-form{background:#f7f7f8;border-color:#e5e5e5}
html[data-v4][data-tema="claro"] .aviso-form.error{border-color:rgba(207,34,46,.3);background:rgba(207,34,46,.06);color:#a40e26}
html[data-v4][data-tema="claro"] :is(.aviso-form.ok,.rec-ok,.arec-ok){border-color:rgba(26,127,55,.3);background:rgba(26,127,55,.07);color:#116329}
html[data-v4][data-tema="claro"] .rec-pasos li.activo,html[data-v4][data-tema="claro"] .rec-pasos li.activo b{color:var(--tinta)}
html[data-v4][data-tema="claro"] .rec-pasos li.activo b{color:#fff}
html[data-v4][data-tema="claro"] :is(.login-lista,.reg-ventajas,.rec-pasos,.a-acceso-lista) li{border-bottom-color:#ececec}
html[data-v4][data-tema="claro"] :is(.login-lista,.a-acceso-lista) .n,html[data-v4][data-tema="claro"] .reg-ventajas li span,html[data-v4][data-tema="claro"] .rec-pasos b{background:rgba(59,91,255,.1)}
html[data-v4][data-tema="claro"] .login-ayuda:hover,html[data-v4][data-tema="claro"] .reg-ayuda:hover,html[data-v4][data-tema="claro"] .rec-ayuda:hover{background:#f4f4f5}
/* La columna del vistazo: panel claro sobre gris muy suave, como el panel en modo claro */
html[data-v4][data-tema="claro"] .acceso-vis{border-right-color:#ececec}
html[data-v4][data-tema="claro"] .acceso-vis,html[data-v4][data-tema="claro"] .acceso-vis .logo{color:var(--tinta)}
html[data-v4][data-tema="claro"] .acceso-vis::before{background:linear-gradient(180deg,rgba(255,255,255,.4),rgba(255,255,255,.9))}
html[data-v4][data-tema="claro"] .acceso-vis .ojo{color:var(--tinta-3)}
html[data-v4][data-tema="claro"] .acceso-vis.vz-lado{background:#f7f7f8;border-color:#ececec}
html[data-v4][data-tema="claro"] .acceso-vis.vz-lado::before{background:
  radial-gradient(60% 45% at 70% 38%,rgba(59,91,255,.10),transparent 70%),
  radial-gradient(40% 35% at 20% 80%,rgba(26,127,55,.05),transparent 70%),
  radial-gradient(rgba(0,0,0,.07) 1px,transparent 1.2px) 0 0/22px 22px}
html[data-v4][data-tema="claro"] .vz{box-shadow:0 1px 2px rgba(0,0,0,.04),0 40px 80px -36px rgba(0,0,0,.28)}
html[data-v4][data-tema="claro"] .vz-puntos i{background:#e0e0e3}
html[data-v4][data-tema="claro"] .vz-url{background:#f4f4f5}
html[data-v4][data-tema="claro"] .vz-tarjeta{background:#fafafa}
html[data-v4][data-tema="claro"] .vz-ic{background:#f0f0f1}
html[data-v4][data-tema="claro"] .vz-est.ok{background:rgba(26,127,55,.09)}
html[data-v4][data-tema="claro"] .vz-est.pend{color:#9a6700;background:rgba(191,135,0,.10)}
html[data-v4][data-tema="claro"] .vz-est.azul{color:#2b47e0;background:rgba(59,91,255,.08)}
html[data-v4][data-tema="claro"] .vz-linea{stroke:#3b5bff}
html[data-v4][data-tema="claro"] .vz-aviso{background:#fff;border-color:#e5e5e5;box-shadow:0 16px 40px -14px rgba(0,0,0,.25)}
html[data-v4][data-tema="claro"] .vz-aviso svg{color:#fff}
html[data-v4][data-tema="claro"] .vz-lado :is(.login-vis-pie,.reg-vis-txt) .ojo{border-color:#e5e5e5;background:#fff;color:#5d5d5d}
html[data-v4][data-tema="claro"] .vz-lado :is(.login-vis-pie,.reg-vis-txt) .ojo::before{background:#1a7f37}
html[data-v4][data-tema="claro"] .acceso-vis.vz-lado .cita{color:var(--tinta)}
html[data-v4][data-tema="claro"] .acceso-vis.vz-lado .cita .hueco{color:#8e8e8e}
html[data-v4][data-tema="claro"] .vz-lado :is(.login-lista,.reg-ventajas) li{border-color:#e5e5e5;background:#fff;color:#3f3f46}
html[data-v4][data-tema="claro"] .vz-lado :is(.login-lista,.reg-ventajas) li:hover{border-color:#d4d4d8;background:#fff}
html[data-v4][data-tema="claro"] .vz-lado :is(.login-lista,.reg-ventajas) .ic{background:rgba(59,91,255,.08);color:#3b5bff}