/* =====================================================================
   TEMA VERDE · verde profundo + lima (sustituye al amarillo por defecto)
   ===================================================================== */
:root{
  --bg:#0a2b27; --bg2:#0f3a33;
  --card:#123f38; --card2:#0f3630;
  --line:rgba(255,255,255,.18);
  --txt:#eafff6; --mut:#a9c8bb;
  --acc:#d8ff3e; --acc2:#57d9a3;
  --ok:#7ce8a4; --warn:#ffd07a; --cn:#d8ff3e;
}
html:not([data-tema="noche"]) body{
  background:
    radial-gradient(1100px 600px at 78% -10%, rgba(87,217,163,.16), transparent 60%),
    radial-gradient(900px 520px at 8% 4%, rgba(216,255,62,.10), transparent 55%),
    linear-gradient(180deg,#08231f 0%, #0a2b27 42%, #0d332e 100%);
  background-attachment:fixed;
  color:#eafff6;
}

/* ==========================================================================
   TEMA NOCHE — premium y oscuro de alto impacto (prompt 1)
   Azul noche extremo, cristal, tipografía blanca y degradados neón.
   Se activa con <html data-tema="noche">.
   ========================================================================== */

html:not([data-tema="noche"]){
  --bg:#071f1c;
  --bg2:#0a2723;
  --card:#0f2e29;
  --card2:#1b2130;
  --line:rgba(255,255,255,.09);
  --txt:#ffffff;
  --mut:#8faea2;
  --cian:#d8ff3e;
  --neon:#57d9a3;
  --cristal:rgba(255,255,255,.03);
}
html:not([data-tema="noche"]) body{background:var(--bg);color:#fff}

/* ---------- cabecera ---------- */
html:not([data-tema="noche"]) header.top{
  background:rgba(11,15,25,.75);
  -webkit-backdrop-filter:blur(14px);
          backdrop-filter:blur(14px);
  border-bottom:1px solid rgba(255,255,255,.07);
}
html:not([data-tema="noche"]) header .logo,
html:not([data-tema="noche"]) header .brand{color:#fff}
html:not([data-tema="noche"]) header .logo span,
html:not([data-tema="noche"]) header .brand .cn{
  background:linear-gradient(135deg,#d8ff3e,#57d9a3);color:#07211c;
}
html:not([data-tema="noche"]) header.top nav.main a,
html:not([data-tema="noche"]) header.top nav.main button.btn.lang,
html:not([data-tema="noche"]) header a.volver,
html:not([data-tema="noche"]) header.top nav:not(.main) a{
  background:var(--cristal);
  color:#eafff6;-webkit-text-fill-color:#eafff6;
  border:1px solid rgba(255,255,255,.1);
  border-radius:999px;
  box-shadow:none;
  transform:none;
}
html:not([data-tema="noche"]) header.top nav.main a:hover,
html:not([data-tema="noche"]) header a.volver:hover,
html:not([data-tema="noche"]) header.top nav:not(.main) a:hover{
  background:rgba(87,217,163,.16);
  border-color:rgba(87,217,163,.55);
  transform:translateY(-1px);
}
html:not([data-tema="noche"]) header.top nav.main a .gratis,
html:not([data-tema="noche"]) header .gratis{
  background:linear-gradient(135deg,#ff416c,#ff4b2b) !important;
  color:#fff !important;-webkit-text-fill-color:#fff !important;
}

/* ---------- caja de idioma: cristal ---------- */
html:not([data-tema="noche"]) .elige{
  background:rgba(255,255,255,.03);
  -webkit-backdrop-filter:blur(12px);
          backdrop-filter:blur(12px);
  border:1px solid rgba(255,255,255,.08);
  border-radius:20px;
  box-shadow:none;
}
html:not([data-tema="noche"]) .elige-titulo{color:#fff}
html:not([data-tema="noche"]) .elige-titulo span{color:#8faea2}
html:not([data-tema="noche"]) .elige-botones button{
  background:rgba(255,255,255,.06);color:#eafff6;
  border:1px solid rgba(255,255,255,.12);border-radius:12px;box-shadow:none;
}
html:not([data-tema="noche"]) .elige-botones button:hover{
  background:linear-gradient(135deg,rgba(216,255,62,.2),rgba(87,217,163,.2));
  border-color:rgba(87,217,163,.6);color:#fff;
}

/* ---------- héroe ---------- */
html:not([data-tema="noche"]) .hero{
  background:
    radial-gradient(60% 50% at 75% 45%, rgba(87,217,163,.13) 0%, transparent 70%),
    radial-gradient(45% 40% at 20% 15%, rgba(216,255,62,.08) 0%, transparent 70%),
    var(--bg);
}
html:not([data-tema="noche"]) .hero .wrap{
  /* cristal ahumado: el robot se intuye difuminado detras, como en amarillo */
  background:rgba(19,24,34,.54);
  -webkit-backdrop-filter:blur(11px) saturate(1.15);
          backdrop-filter:blur(11px) saturate(1.15);
  border:1px solid rgba(255,255,255,.09);
  border-radius:24px;
  box-shadow:0 30px 70px rgba(0,0,0,.55);
}
html:not([data-tema="noche"]) .hero h1{color:#fff;text-shadow:none}
html:not([data-tema="noche"]) .hero h1 .grad{
  background:linear-gradient(135deg,#d8ff3e 0%,#57d9a3 100%) !important;
  color:transparent !important;
  -webkit-text-fill-color:transparent !important;
  -webkit-background-clip:text !important;
          background-clip:text !important;
  padding:0 .06em;
  border-radius:0;
}
html:not([data-tema="noche"]) .hero .lead{color:#b9c4d4;text-shadow:none;font-size:18px}
html:not([data-tema="noche"]) .kicker{
  background:rgba(255,255,255,.05);color:#8fb3a7;
  border:1px solid rgba(255,255,255,.1);border-radius:999px;
}

/* botón principal: degradado rojo-naranja con brillo */
html:not([data-tema="noche"]) .hero .cta .btn{
  background:linear-gradient(to right,#ff416c,#ff4b2b);
  color:#fff;-webkit-text-fill-color:#fff;
  border:0;border-radius:14px;
  box-shadow:0 10px 30px rgba(255,75,43,.35);
  transform:none;
}
html:not([data-tema="noche"]) .hero .cta .btn:hover{
  transform:translateY(-2px);
  box-shadow:0 16px 40px rgba(255,75,43,.5);
  filter:brightness(1.06);
}
html:not([data-tema="noche"]) .hero .cta .btn + .btn{
  background:rgba(255,255,255,.06) !important;
  color:#eafff6 !important;-webkit-text-fill-color:#eafff6 !important;
  border:1px solid rgba(255,255,255,.14);box-shadow:none;
}
html:not([data-tema="noche"]) .hero .cta .btn + .btn:hover{
  background:rgba(87,217,163,.16) !important;border-color:rgba(87,217,163,.6);
}
html:not([data-tema="noche"]) .hero .trust span{
  background:rgba(255,255,255,.04);color:#bcd9cd;-webkit-text-fill-color:#bcd9cd;
  border:1px solid rgba(255,255,255,.09);border-radius:999px;box-shadow:none;
  transform:none;
}
html:not([data-tema="noche"]) .hero-fondo img{filter:drop-shadow(0 30px 60px rgba(0,0,0,.75))}

/* ---------- tarjetas ---------- */
html:not([data-tema="noche"]) .door,
html:not([data-tema="noche"]) .card,
html:not([data-tema="noche"]) .caracter-caja,
html:not([data-tema="noche"]) .price-item{
  background:#0f2e29;border:1px solid rgba(255,255,255,.07);border-radius:24px;
  box-shadow:0 20px 50px rgba(0,0,0,.4);color:#e6f5ee;
}
html:not([data-tema="noche"]) .door h3,
html:not([data-tema="noche"]) .card h3,
html:not([data-tema="noche"]) .sec-head h2{color:#fff}
html:not([data-tema="noche"]) .door p,
html:not([data-tema="noche"]) .card p{color:#aab6c8}
html:not([data-tema="noche"]) .sec-head p{color:#86a49a}
html:not([data-tema="noche"]) .door ul li,
html:not([data-tema="noche"]) .card ul li{color:#b4d0c4}
html:not([data-tema="noche"]) .door .bi,
html:not([data-tema="noche"]) .card .bi{color:#57d9a3;opacity:.9}
html:not([data-tema="noche"]) .ico-img{
  filter:grayscale(1) brightness(1.6) sepia(.4) hue-rotate(170deg) saturate(2);
}

/* carácter del día */
html:not([data-tema="noche"]) .caracter-hz{
  background:linear-gradient(135deg,#d8ff3e,#57d9a3);color:#07211c;border-radius:16px;
}
html:not([data-tema="noche"]) .caracter-py{color:#57d9a3}
html:not([data-tema="noche"]) .caracter-es{color:#fff}
html:not([data-tema="noche"]) .caracter-ej{color:#8faea2}

html:not([data-tema="noche"]) .door .btn,
html:not([data-tema="noche"]) .card .btn,
html:not([data-tema="noche"]) .caracter-acc .btn{
  background:rgba(255,255,255,.07) !important;color:#fff !important;
  -webkit-text-fill-color:#fff !important;
  border:1px solid rgba(255,255,255,.14);box-shadow:none;border-radius:12px;
}
html:not([data-tema="noche"]) .door .btn:hover,
html:not([data-tema="noche"]) .card .btn:hover{
  background:rgba(87,217,163,.2) !important;border-color:rgba(87,217,163,.6);
}

/* ---------- pie ---------- */
html:not([data-tema="noche"]) footer{background:#070a11;color:#86a49a;border-top:1px solid rgba(255,255,255,.07)}
html:not([data-tema="noche"]) footer nav a{background:transparent;color:#b4d0c4;border:1px solid rgba(255,255,255,.14);border-radius:999px}
html:not([data-tema="noche"]) footer nav a:hover{background:rgba(87,217,163,.16);border-color:rgba(87,217,163,.6);color:#fff}

/* ---------- cursos ---------- */
html:not([data-tema="noche"]) .caja,
html:not([data-tema="noche"]) .leccion,
html:not([data-tema="noche"]) .tono,
html:not([data-tema="noche"]) .palabra{
  background:#0f2e29;border:1px solid rgba(255,255,255,.07);border-radius:24px;
  color:#e6f5ee;box-shadow:0 18px 40px rgba(0,0,0,.35);
}
html:not([data-tema="noche"]) .leccion h3,
html:not([data-tema="noche"]) .caja h2{color:#fff}
html:not([data-tema="noche"]) .leccion p{color:#aab6c8}
html:not([data-tema="noche"]) .leccion .num{background:linear-gradient(135deg,#d8ff3e,#57d9a3);color:#07211c}
html:not([data-tema="noche"]) .barra{background:#0a2723;border:1px solid rgba(255,255,255,.1)}
html:not([data-tema="noche"]) .barra i{background:linear-gradient(to right,#d8ff3e,#57d9a3)}
html:not([data-tema="noche"]) .aviso{background:rgba(87,217,163,.14);color:#d7f7e6;border-radius:12px}
html:not([data-tema="noche"]) .opcion{
  background:#1b2130;color:#e6f5ee;border:1px solid rgba(255,255,255,.1);border-radius:12px;box-shadow:none;
}
html:not([data-tema="noche"]) .opcion:hover{border-color:rgba(87,217,163,.6)}
html:not([data-tema="noche"]) .opcion.ok{background:#0c5a4b;border-color:#12a08a;color:#fff}
html:not([data-tema="noche"]) .opcion.mal{background:#7f1d1d;border-color:#ef4444;color:#fff}
html:not([data-tema="noche"]) .tono .py,
html:not([data-tema="noche"]) .palabra .py{color:#57d9a3}
html:not([data-tema="noche"]) .pregunta,
html:not([data-tema="noche"]) .progreso-txt{color:#fff}
html:not([data-tema="noche"]) input#nombre{background:#0a2723;color:#fff;border:1px solid rgba(255,255,255,.14);border-radius:12px}

html:not([data-tema="noche"]) .leccion button,
html:not([data-tema="noche"]) button.principal,
html:not([data-tema="noche"]) .pie-nav button:not(.chico),
html:not([data-tema="noche"]) #btnBajar,
html:not([data-tema="noche"]) #btnVer,
html:not([data-tema="noche"]) button.chico{
  background:linear-gradient(to right,#ff416c,#ff4b2b);color:#fff;-webkit-text-fill-color:#fff;
  border:0;border-radius:12px;box-shadow:0 8px 22px rgba(255,75,43,.3);
}
html:not([data-tema="noche"]) #btnTema{
  background:rgba(255,255,255,.05) !important;color:#eafff6 !important;
  -webkit-text-fill-color:#eafff6 !important;border:1px solid rgba(255,255,255,.12);
}

/* guías */
html:not([data-tema="noche"]) .zone-head h1{color:#fff}
html:not([data-tema="noche"]) .art,
html:not([data-tema="noche"]) .tip,
html:not([data-tema="noche"]) .trampa,
html:not([data-tema="noche"]) .aviso-medico{
  background:#0f2e29;border:1px solid rgba(255,255,255,.07);color:#dbe4f0;border-radius:20px;
}

/* aquí nada va torcido */
html:not([data-tema="noche"]) header.top nav.main > *,
html:not([data-tema="noche"]) .hero .cta .btn,
html:not([data-tema="noche"]) .hero .trust span{transform:none !important}


/* =====================================================================
   Botón principal unificado con la paleta (antes rojo-naranja)
   ===================================================================== */
html:not([data-tema="noche"]) .hero .cta .btn{
  background:linear-gradient(to right,#d8ff3e 0%,#57d9a3 100%);
  color:#07211c;
  -webkit-text-fill-color:#07211c;
  border:0;border-radius:14px;
  box-shadow:0 12px 34px rgba(87,217,163,.35);
}
html:not([data-tema="noche"]) .hero .cta .btn:hover{
  transform:translateY(-2px);
  box-shadow:0 18px 44px rgba(87,217,163,.5);
  filter:brightness(1.07);
}
/* el secundario, cristal con borde cian */
html:not([data-tema="noche"]) .hero .cta .btn + .btn{
  background:rgba(255,255,255,.05) !important;
  color:#d8ecff !important;-webkit-text-fill-color:#d8ecff !important;
  border:1px solid rgba(87,217,163,.45) !important;
  box-shadow:none;
}
/* botones de los cursos, también en cian */
html:not([data-tema="noche"]) .leccion button,
html:not([data-tema="noche"]) button.principal,
html:not([data-tema="noche"]) .pie-nav button:not(.chico),
html:not([data-tema="noche"]) #btnBajar,
html:not([data-tema="noche"]) #btnVer,
html:not([data-tema="noche"]) button.chico{
  background:linear-gradient(to right,#d8ff3e,#57d9a3);
  color:#07211c;-webkit-text-fill-color:#07211c;
  border:0;border-radius:12px;box-shadow:0 8px 22px rgba(87,217,163,.3);
}
/* la etiqueta GRATIS deja de ser roja: cian sobre fondo oscuro */
html:not([data-tema="noche"]) header.top nav.main a .gratis,
html:not([data-tema="noche"]) header .gratis{
  background:linear-gradient(135deg,#d8ff3e,#57d9a3) !important;
  color:#07211c !important;-webkit-text-fill-color:#07211c !important;
}


/* =====================================================================
   GUÍAS dentro del tema oscuro (salud y programación)
   ===================================================================== */
html:not([data-tema="noche"]) .top,
html:not([data-tema="noche"]) header.top{background:#071f1c;border-bottom:1px solid rgba(255,255,255,.07)}
html:not([data-tema="noche"]) body{background:#071f1c !important}
html:not([data-tema="noche"]) .brand,
html:not([data-tema="noche"]) .brand .cn{color:#fff}
html:not([data-tema="noche"]) .crumbs,
html:not([data-tema="noche"]) .crumbs a{color:#8fb3a7}
html:not([data-tema="noche"]) .zone-head h1{color:#fff}
html:not([data-tema="noche"]) .zone-head p{color:#b9c4d4}
html:not([data-tema="noche"]) .kicker{background:rgba(255,255,255,.05);color:#8fb3a7;border:1px solid rgba(255,255,255,.1)}

/* tarjetas de las guías */
html:not([data-tema="noche"]) .art,
html:not([data-tema="noche"]) .caja,
html:not([data-tema="noche"]) .tip,
html:not([data-tema="noche"]) .trampa,
html:not([data-tema="noche"]) .nota,
html:not([data-tema="noche"]) .lista,
html:not([data-tema="noche"]) .aviso-medico{
  background:#0f2e29 !important;
  border:1px solid rgba(255,255,255,.08) !important;
  color:#e6f5ee !important;
  border-radius:20px;
}
html:not([data-tema="noche"]) .art h2,
html:not([data-tema="noche"]) .art h3,
html:not([data-tema="noche"]) .caja h2,
html:not([data-tema="noche"]) .caja h3{color:#fff}
html:not([data-tema="noche"]) .art p,
html:not([data-tema="noche"]) .art li,
html:not([data-tema="noche"]) .caja p,
html:not([data-tema="noche"]) .caja li{color:#b4d0c4}
html:not([data-tema="noche"]) .ej{background:#0a2723;border-left-color:#57d9a3;color:#d7f7e6}
html:not([data-tema="noche"]) .aviso-medico{border-left:6px solid #ff4b2b}

/* botones de las guías y del listado de apartados */
html:not([data-tema="noche"]) .card .btn,
html:not([data-tema="noche"]) .door .btn,
html:not([data-tema="noche"]) .art .btn,
html:not([data-tema="noche"]) .caja .btn{
  background:linear-gradient(to right,#d8ff3e,#57d9a3) !important;
  color:#07211c !important;
  -webkit-text-fill-color:#07211c !important;
  border:0;border-radius:12px;
  box-shadow:0 8px 22px rgba(87,217,163,.28);
}
html:not([data-tema="noche"]) footer{background:#070a11;color:#8fb3a7}
html:not([data-tema="noche"]) footer a{color:#d7f7e6}

html:not([data-tema="noche"]) .kicker,
html:not([data-tema="noche"]) .zone-head .kicker{
  background:rgba(255,255,255,.07) !important;
  color:#d7f7e6 !important;
  border:1px solid rgba(255,255,255,.12) !important;
}


/* el bloque de seguridad tenía fondo crema con letra clara: invisible */
html:not([data-tema="noche"]) .seguridad,
html:not([data-tema="noche"]) .seguridad *{
  background:transparent !important;
  color:#dbe4f0 !important;
}
html:not([data-tema="noche"]) .seguridad{
  background:#0f2e29 !important;
  border:1px solid rgba(255,255,255,.08) !important;
  border-radius:18px;
  padding:22px 24px;
}
html:not([data-tema="noche"]) .seguridad b,
html:not([data-tema="noche"]) .seguridad strong{color:#fff !important}
html:not([data-tema="noche"]) .seguridad li{color:#b4d0c4 !important}


/* =====================================================================
   Cuerpo de los artículos en oscuro: el texto salía gris oscuro sobre negro
   ===================================================================== */
html:not([data-tema="noche"]) .post,
html:not([data-tema="noche"]) .post p,
html:not([data-tema="noche"]) .post li,
html:not([data-tema="noche"]) .narrow p,
html:not([data-tema="noche"]) .narrow li{color:#bcd9cd !important}
html:not([data-tema="noche"]) .post h1,
html:not([data-tema="noche"]) .post h2,
html:not([data-tema="noche"]) .post h3,
html:not([data-tema="noche"]) .post h4{color:#ffffff !important}
html:not([data-tema="noche"]) .post strong,
html:not([data-tema="noche"]) .post b{color:#ffffff !important}
html:not([data-tema="noche"]) .post a{color:#7fc9ff}
html:not([data-tema="noche"]) .post-meta{color:#86a49a !important}
html:not([data-tema="noche"]) .cat,
html:not([data-tema="noche"]) .post .tag{
  background:rgba(255,255,255,.07) !important;
  color:#d7f7e6 !important;
  border:1px solid rgba(255,255,255,.14) !important;
}
html:not([data-tema="noche"]) .post .hero,
html:not([data-tema="noche"]) .post .big{
  background:#0f2e29 !important;
  border:1px solid rgba(255,255,255,.08) !important;
  color:#bcd9cd !important;
}
html:not([data-tema="noche"]) .post .ej,
html:not([data-tema="noche"]) .post .tip,
html:not([data-tema="noche"]) .post .trampa{
  background:#0f2e29 !important;
  border:1px solid rgba(255,255,255,.08) !important;
  color:#bcd9cd !important;
}
html:not([data-tema="noche"]) .post .ej{border-left:5px solid #57d9a3 !important}
html:not([data-tema="noche"]) .post .num{
  background:linear-gradient(to right,#d8ff3e,#57d9a3) !important;
  color:#07211c !important;
}
html:not([data-tema="noche"]) .seguridad{
  background:#0f2e29 !important;
  border:1px solid rgba(255,255,255,.08) !important;
  color:#bcd9cd !important;
  border-radius:18px;
  padding:22px 24px;
}
html:not([data-tema="noche"]) .seguridad li,
html:not([data-tema="noche"]) .seguridad p{color:#bcd9cd !important}
html:not([data-tema="noche"]) .seguridad strong,
html:not([data-tema="noche"]) .seguridad b{color:#fff !important}

/* ---------- refuerzo: estas reglas del tema amarillo llevan !important ---------- */
html:not([data-tema="noche"]) .hero .wrap{
  background:rgba(8,34,29,.60) !important;
  -webkit-backdrop-filter:blur(11px) saturate(1.1) !important;
  backdrop-filter:blur(11px) saturate(1.1) !important;
  border:1px solid rgba(216,255,62,.16) !important;
}
html:not([data-tema="noche"]) .hero h1{color:#f4fff9 !important}
html:not([data-tema="noche"]) .hero .lead,
html:not([data-tema="noche"]) .hero p{color:#cfe9dd !important}
html:not([data-tema="noche"]) .hero .kicker{
  background:rgba(216,255,62,.14) !important;color:#e9ffb0 !important;
  border-color:rgba(216,255,62,.35) !important;
}
html:not([data-tema="noche"]) .hero .trust span{
  background:rgba(255,255,255,.06) !important;color:#d8efe6 !important;
  border-color:rgba(255,255,255,.14) !important;-webkit-text-fill-color:#d8efe6 !important;
  box-shadow:none !important;
}
html:not([data-tema="noche"]) .hero .cta .btn + .btn{
  background:rgba(255,255,255,.08) !important;color:#eafff6 !important;
  -webkit-text-fill-color:#eafff6 !important;border:1px solid rgba(255,255,255,.18) !important;
  box-shadow:none !important;
}

html:not([data-tema="noche"]) #btnTema{
  background:rgba(255,255,255,.06) !important;color:#eafff6 !important;
  -webkit-text-fill-color:#eafff6 !important;
  border:1px solid rgba(255,255,255,.16) !important;box-shadow:none !important;
}
html:not([data-tema="noche"]) header .logo .cn,
html:not([data-tema="noche"]) header .brand .cn,
html:not([data-tema="noche"]) header .logo > span:not(.logo-sello),
html:not([data-tema="noche"]) header .brand > span:not(.logo-sello){
  background:#0f2e29 !important;color:#d8ff3e !important;
  -webkit-text-fill-color:#d8ff3e !important;
  border:1px solid rgba(216,255,62,.28) !important;box-shadow:none !important;
  text-shadow:none !important;
}

/* ---------- páginas de curso (usan sus propias variables) ---------- */
html:not([data-tema="noche"]) body{background:#0a2b27 !important;color:#eafff6 !important}
html:not([data-tema="noche"]) .lecciones .leccion,
html:not([data-tema="noche"]) .caja{
  background:#0f2e29 !important;border-color:rgba(255,255,255,.14) !important;
  color:#eafff6 !important;box-shadow:0 10px 26px rgba(0,0,0,.35) !important;
}
html:not([data-tema="noche"]) .leccion .num{
  background:#d8ff3e !important;color:#07211c !important;border-color:#d8ff3e !important;
}
html:not([data-tema="noche"]) .leccion h3{color:#f2fff9 !important}
html:not([data-tema="noche"]) .leccion p{color:#b9d6c9 !important}
html:not([data-tema="noche"]) .otro{
  background:#123f38 !important;border-color:rgba(255,255,255,.14) !important;
  color:#d7f7e6 !important;box-shadow:0 8px 20px rgba(0,0,0,.3) !important;
}
html:not([data-tema="noche"]) .aviso{background:#0f2e29 !important;color:#d8ff3e !important}
html:not([data-tema="noche"]) .barra{
  background:rgba(255,255,255,.08) !important;border-color:rgba(255,255,255,.18) !important;
}
html:not([data-tema="noche"]) .barra i{background:#d8ff3e !important}
html:not([data-tema="noche"]) h1, header a.volver{color:#f2fff9 !important;border-color:rgba(255,255,255,.25) !important}
html:not([data-tema="noche"]) .grad,
html:not([data-tema="noche"]) h1 .grad,
html:not([data-tema="noche"]) h1 span[style]{color:#d8ff3e !important;-webkit-text-fill-color:#d8ff3e !important}

/* variables propias de las páginas de curso */
html:not([data-tema="noche"]) body{
  --amarillo:#d8ff3e; --negro:#07211c; --crema:#0f2e29;
  --blanco:#123f38; --gris:#a9c8bb; --verde:#2fbf7a;
}
html:not([data-tema="noche"]) h1 em{
  background:#d8ff3e !important;color:#07211c !important;
}
html:not([data-tema="noche"]) .xs-aviso{
  background:#0f2e29 !important;color:#d8ff3e !important;
  border:1px solid rgba(216,255,62,.25) !important;
}
html:not([data-tema="noche"]) .xs-aviso a{color:#d8ff3e !important}
html:not([data-tema="noche"]) .xs-aviso.xs-ok{
  background:#123f2c !important;color:#a9f0c4 !important;
  border-color:rgba(120,240,170,.3) !important;
}

/* teclas y detalles de las guías */
html:not([data-tema="noche"]) .atajos kbd{
  background:#0f2e29 !important;color:#d8ff3e !important;box-shadow:none !important;
}
html:not([data-tema="noche"]) .post a{color:#d8ff3e}

/* etiquetas (Publicado / En preparación) legibles sobre verde */
html:not([data-tema="noche"]) .tag,
html:not([data-tema="noche"]) .art .tag{
  background:rgba(216,255,62,.14) !important;
  color:#d8ff3e !important;
  border:1px solid rgba(216,255,62,.38) !important;
  -webkit-text-fill-color:#d8ff3e !important;
}
html:not([data-tema="noche"]) .art.prox .tag{
  background:rgba(255,208,122,.14) !important;
  color:#ffd07a !important;
  border-color:rgba(255,208,122,.38) !important;
  -webkit-text-fill-color:#ffd07a !important;
}

/* textos secundarios legibles sobre verde (venían en gris oscuro del tema claro) */
html:not([data-tema="noche"]) .sub,
html:not([data-tema="noche"]) .lead,
html:not([data-tema="noche"]) .nota,
html:not([data-tema="noche"]) .intro,
html:not([data-tema="noche"]) .descripcion{
  color:#c9e4d8 !important;
}
html:not([data-tema="noche"]) .contador,
html:not([data-tema="noche"]) .idea .meta,
html:not([data-tema="noche"]) .meta{
  color:#9fc2b4 !important;
}
html:not([data-tema="noche"]) .etiqueta,
html:not([data-tema="noche"]) .pill{
  background:rgba(216,255,62,.14) !important;
  color:#d8ff3e !important;
  -webkit-text-fill-color:#d8ff3e !important;
}

html:not([data-tema="noche"]) .normas,
html:not([data-tema="noche"]) .idea .cuerpo,
html:not([data-tema="noche"]) .vacio{
  color:#bcd9cd !important;
}
html:not([data-tema="noche"]) .normas b,
html:not([data-tema="noche"]) .normas strong{color:#ffb4a2 !important}

/* los iconos ya vienen en la paleta: no hay que recolorearlos */
html:not([data-tema="noche"]) .ico-img{filter:none !important}