/* Carta solar en vivo de la portada (Fase 3, 28/09/2026).
   Estilos copiados de _archivo-2026-09/carta/carta.css (solo la carta); la carta es un panel oscuro
   dentro de la portada clara. Sin fuentes nuevas: la notacion usa la monoespaciada del sistema. */
.carta{--mono:ui-monospace,"Cascadia Mono","Segoe UI Mono",Consolas,monospace;
  --trazo:rgba(170,205,232,.35); --luz:#F97316; --luz-alta:#FFB347; --tiza:#C9D6E2}
.carta{
  position:relative;width:100%;aspect-ratio:1000/720;
  border:1px solid var(--trazo);border-radius:2px;overflow:hidden;
  background:var(--cielo,#08111C);
  transition:background 1.2s ease;
}
.carta svg{position:absolute;inset:0;width:100%;height:100%;display:block;z-index:2;
  filter:drop-shadow(0 1px 1.5px rgba(4,9,15,.85))}
.carta-terreno{
  position:absolute;inset:0;overflow:hidden;z-index:1;
}
.carta-terreno video,.carta-terreno img{
  width:100%;height:100%;object-fit:cover;
  filter:var(--filtro-terreno, saturate(.55) brightness(.7) contrast(1.04));
  transition:filter 1.2s ease;
}
.carta-terreno::after{
  content:'';position:absolute;inset:0;
  background:var(--velo-terreno, linear-gradient(180deg,rgba(11,20,32,.42),rgba(11,20,32,.06)));
  transition:background 1.2s ease;
}
/* ---- el cielo de la lámina según el momento del día ---- */
.carta[data-fase="noche"]{
  --cielo:linear-gradient(180deg,#04090F 0%,#070E18 55%,#0A1420 100%);
  --filtro-terreno:saturate(.28) brightness(.4) contrast(1.12);
  --velo-terreno:linear-gradient(180deg,rgba(4,9,15,.62),rgba(4,9,15,.2));
}
.carta[data-fase="crepusculo"]{
  --cielo:linear-gradient(180deg,#08111C 0%,#152136 48%,#3B2733 82%,#5A3527 100%);
  --filtro-terreno:saturate(.6) brightness(.62) contrast(1.05);
  --velo-terreno:linear-gradient(180deg,rgba(58,32,26,.46),rgba(11,20,32,.1));
}
.carta[data-fase="tarde"]{
  --cielo:linear-gradient(180deg,#0A1826 0%,#12293E 60%,#28323F 100%);
  --filtro-terreno:saturate(.72) brightness(.82) contrast(1.02);
  --velo-terreno:linear-gradient(180deg,rgba(11,20,32,.34),rgba(11,20,32,.04));
}
.carta[data-fase="dia"]{
  --cielo:linear-gradient(180deg,#0C2136 0%,#17395480 40%,#1D4967 100%);
  --filtro-terreno:saturate(.9) brightness(1) contrast(1);
  --velo-terreno:linear-gradient(180deg,rgba(13,35,54,.22),rgba(13,35,54,0));
}
/* con el cielo más claro, la notación necesita más peso para seguir legible */
.carta[data-fase="dia"] .g-rotulo{fill:#EAF3FB}
.carta[data-fase="dia"] .g-rotulo-ejes{fill:#FFFFFF}
.carta[data-fase="dia"] .g-arco{stroke:rgba(150,200,235,.92)}
.carta[data-fase="tarde"] .g-rotulo{fill:#DCEAF6}
.g-estrella{fill:#DCE8F5}
.carta-sello{
  position:absolute;right:16px;top:12px;z-index:3;font-family:var(--mono);
  font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;color:var(--tiza);
  text-align:right;text-shadow:0 1px 4px rgba(4,9,15,.98),0 0 10px rgba(4,9,15,.85),0 0 2px rgba(4,9,15,1);
}
.carta-sello b{color:#FFFFFF;font-weight:600}
.carta[data-fase="noche"] .carta-sello{
  text-shadow:0 0 7px rgba(120,190,255,.5),0 1px 3px rgba(4,9,15,.9);
}
.carta-pie{
  position:absolute;left:0;right:0;bottom:0;z-index:3;display:flex;flex-wrap:wrap;
  justify-content:space-between;gap:8px 18px;padding:26px 14px 10px;
  font-family:var(--mono);font-size:.63rem;
  letter-spacing:.1em;text-transform:uppercase;color:var(--tiza);
  background:linear-gradient(180deg,rgba(4,9,15,0) 0%,rgba(4,9,15,.72) 45%,rgba(4,9,15,.9) 100%);
}
.carta-pie b{color:var(--luz);font-weight:500}
/* trazos del diagrama — ingenieria solar definida sobre el video */
.g-grilla{stroke:rgba(170,205,232,.52);stroke-width:1;fill:none}
.g-horizonte{stroke:rgba(214,231,244,.72);stroke-width:1.8;fill:none}
.g-arco{fill:none;stroke:rgba(120,186,230,.95);stroke-width:1.9}
.g-arco-eq{fill:none;stroke:rgba(79,209,197,.98);stroke-width:1.9;stroke-dasharray:6 5}
.g-hora{stroke:rgba(170,205,232,.46);stroke-width:1.1;fill:none}
.g-rotulo{font-family:var(--mono);font-size:19px;fill:#D8E7F3;letter-spacing:.06em}
.g-rotulo-ejes{font-family:var(--mono);font-size:22px;fill:#F2F8FD;letter-spacing:.18em}
.g-arco-lbl{font-family:var(--mono);font-size:14px;letter-spacing:.16em;
  text-transform:uppercase;font-weight:500}
.g-arco-lbl.v{fill:#AFD8FF}
.g-arco-lbl.e{fill:#7CEBDE}
.g-arco-lbl.i{fill:#AFD8FF}
.g-hoy{fill:none;stroke:var(--luz);stroke-width:2.9;opacity:1}
.g-sol-halo{fill:var(--luz);opacity:.24}
.g-sol{fill:var(--luz-alta);stroke:#FFE2BE;stroke-width:1.9}
.g-plomada{stroke:var(--luz);stroke-width:1.3;stroke-dasharray:3 4;opacity:.72}
/* ============ MODO NOCHE LUMÍNICO — solo con el cielo oscuro (data-fase="noche") ============ */
/* De noche el instrumento se enciende como un panel retroiluminado: sobrio, caro. */
.carta[data-fase="noche"] .g-grilla{stroke:rgba(126,196,238,.5)}
.carta[data-fase="noche"] .g-hora{stroke:rgba(126,196,238,.44)}
.carta[data-fase="noche"] .g-grilla,
.carta[data-fase="noche"] .g-hora{filter:drop-shadow(0 0 1.6px rgba(120,190,235,.8))}
.carta[data-fase="noche"] .g-arco{stroke:rgba(158,216,255,1);filter:drop-shadow(0 0 3px rgba(120,195,255,.95))}
.carta[data-fase="noche"] .g-arco-eq{stroke:rgba(108,242,227,1);filter:drop-shadow(0 0 3px rgba(79,224,208,.95))}
.carta[data-fase="noche"] .g-horizonte{filter:drop-shadow(0 0 3px rgba(150,210,245,.85))}
.carta[data-fase="noche"] .g-hoy{filter:drop-shadow(0 0 5px rgba(249,150,55,.95)) drop-shadow(0 0 13px rgba(249,115,22,.55))}
.carta[data-fase="noche"] .g-rotulo-ejes{fill:#F4FAFF;filter:drop-shadow(0 0 4px rgba(120,190,255,.7))}
.carta[data-fase="noche"] .g-arco-lbl{filter:drop-shadow(0 0 3px rgba(120,190,255,.6))}
.carta[data-fase="noche"] .g-estrella{filter:drop-shadow(0 0 1.6px rgba(222,236,255,.95))}
/* la última luz sobre el horizonte: aurora tenue que sube del terreno */
.carta[data-fase="noche"]::after{
  content:'';position:absolute;left:0;right:0;bottom:39%;height:22%;z-index:1;pointer-events:none;
  background:radial-gradient(150% 130% at 50% 100%, rgba(249,140,50,.15), rgba(79,190,205,.17) 38%, rgba(138,124,242,.17) 62%, transparent 80%);
  mix-blend-mode:screen;
}
.carta[data-fase="noche"] #capaEstrellas{animation:none}
/* — la Luna (posición y fase reales), visible sólo con el cielo oscuro — */
.g-luna{fill:#EAF1FA}
.g-luna-halo{fill:rgba(205,222,246,.15)}
.g-luna-sombra{fill:#0C1524;opacity:.92}
.g-luna-lbl{font-family:var(--mono);font-size:15px;fill:#D9E6F5;letter-spacing:.06em}
.carta[data-fase="noche"] .g-luna{filter:drop-shadow(0 0 7px rgba(210,228,250,.9)) drop-shadow(0 0 17px rgba(180,205,245,.5))}
.carta[data-fase="crepusculo"] .g-luna{filter:drop-shadow(0 0 5px rgba(210,228,250,.7))}
.carta[data-fase="noche"] .g-luna-lbl{filter:drop-shadow(0 0 5px rgba(120,190,255,.5))}
.g-ver{stroke:rgba(96,206,224,.96)}
/* Verano  · cian  */
.g-inv{stroke:rgba(150,132,246,.98)}
/* Invierno · violeta */
.g-arco-lbl.v{fill:#8FE6F2}
.g-arco-lbl.i{fill:#C3B4FF}
.carta[data-fase="noche"] .g-ver{stroke:rgba(120,226,244,1);filter:drop-shadow(0 0 3px rgba(96,212,232,.95))}
.carta[data-fase="noche"] .g-inv{stroke:rgba(178,160,255,1);filter:drop-shadow(0 0 3px rgba(150,132,246,.95))}

/* en la portada clara: la carta ocupa la columna derecha, con sus cotas debajo */
.hero-carta{margin:0}
.hero-carta .carta{border-radius:2px}
.carta-cotas{display:grid; grid-template-columns:repeat(4,1fr); gap:1px; margin:0; padding:0;
  list-style:none; background:var(--linea); border:1px solid var(--linea); border-top:0}
.carta-cotas li{background:var(--fondo); padding:10px 12px}
.carta-cotas b{display:block; font-size:1.25rem; font-variant-numeric:tabular-nums; color:var(--texto)}
.carta-cotas span{font-size:.7rem; letter-spacing:.12em; text-transform:uppercase; color:var(--texto-2)}
@media (max-width:880px){ .hero-carta{order:-1} }
@media (max-width:480px){ .carta-cotas{grid-template-columns:repeat(2,1fr)} .carta-sello{font-size:.58rem} }