/* Neptuno v2 — profundidad espacial y materia del planeta. Produccion.
   Portado del kernel de laboratorio (Claude Design: space-lab.css / space-lab.js).
   Contrato: proyectos/Neptunollc.com/v2/arquitectura.md §4.3, specs-congelacion.md §6.
   Todo son primitivas (circulos y gradientes) + ruido horneado. Cero canvas repintado por frame. */

#space-bg{position:fixed;inset:0;pointer-events:none;z-index:0;overflow:hidden}

/* ============ S0 campo profundo — se pinta de inmediato, no bloquea el LCP ============ */
#space-bg .sky{position:absolute;inset:0;z-index:0;overflow:hidden;
  background:
    radial-gradient(ellipse 78% 62% at 64% 26%, #0d2140 0%, rgba(8,20,42,0) 62%),
    radial-gradient(ellipse 96% 82% at 34% 88%, #071528 0%, rgba(5,12,26,0) 58%),
    radial-gradient(ellipse 120% 100% at 50% 40%, #050c1a 0%, #02060f 56%, #000205 100%)}

/* ============ S1 nebulosa — cian/indigo de marca, alfa muy baja ============ */
#space-bg .neb{position:absolute;border-radius:50%;mix-blend-mode:screen;pointer-events:none;
  filter:blur(46px)}
#space-bg .neb.a{left:-8%;top:-14%;width:64%;height:72%;
  background:radial-gradient(circle,rgba(14,116,144,.30) 0%,rgba(8,74,102,.13) 46%,transparent 72%)}
#space-bg .neb.b{right:-14%;bottom:-20%;width:72%;height:78%;
  background:radial-gradient(circle,rgba(30,64,140,.24) 0%,rgba(12,36,88,.10) 48%,transparent 74%)}
#space-bg .neb.c{left:38%;top:44%;width:38%;height:40%;
  background:radial-gradient(circle,rgba(0,180,200,.14) 0%,transparent 68%)}

/* ============ S2 estrellas: tres profundidades de parallax ============ */
#space-bg .stars{position:absolute;inset:0;pointer-events:none}
#space-bg .stars svg{position:absolute;inset:0;width:100%;height:100%;display:block}
#space-bg .stars[data-depth-far]{will-change:transform}
#space-bg .stars[data-depth-mid]{will-change:transform}
#space-bg .stars[data-depth-near]{will-change:transform}

/* ============ S3 polvo — deriva 40-60s, pausable ============ */
#space-bg .dust{position:absolute;inset:0;pointer-events:none;will-change:transform}
#space-bg .dust svg{position:absolute;inset:0;width:100%;height:100%;display:block}
#space-bg .dust.is-off{display:none}

/* ============ S5 luz volumetrica del planeta ============ */
#space-bg .plume{position:absolute;border-radius:50%;mix-blend-mode:screen;pointer-events:none;
  filter:blur(70px);
  background:radial-gradient(circle,rgba(56,160,220,.26) 0%,rgba(20,80,140,.10) 46%,transparent 74%)}

/* ============ S6 grano — mata el banding de los gradientes ============ */
#space-bg .grain{position:absolute;inset:0;pointer-events:none;opacity:.055;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)'/%3E%3C/svg%3E");
  background-size:180px 180px}

/* vineta: cierra la composicion, empuja la mirada al centro */
#space-bg .vign{position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(ellipse 96% 88% at 50% 46%,transparent 44%,rgba(0,2,8,.42) 84%,rgba(0,1,5,.72) 100%)}

/* ============ PLANETA — anclado por layout normal al hueco de la letra o ============
   Se monta dentro de .o-visual (hijo del h1). Sin sincronizacion por raycast ni
   lectura de posicion en cada frame: es un elemento de flujo normal. */
.o-visual{position:relative;display:inline-block}
.planet{position:relative;width:var(--pd,1em);height:var(--pd,1em);border-radius:50%;
  flex:0 0 auto;isolation:isolate}
.planet > *{position:absolute;inset:0;border-radius:50%}

/* halo atmosferico exterior: dispersion Rayleigh */
.planet .p-halo{inset:calc(var(--pd,1em) * -0.13);
  background:radial-gradient(circle,rgba(56,189,248,0) 52%,rgba(56,189,248,.26) 63%,
    rgba(14,116,144,.10) 74%,transparent 88%);
  filter:blur(calc(var(--pd,1em) * .028))}

/* cuerpo: fuente de luz arriba-izquierda */
.planet .p-body{background:radial-gradient(circle at 32% 27%,
  #cdf3ff 0%, #8adcf8 8%, #4fb4e9 22%, #2a80c9 40%,
  #16528f 58%, #0b2c5c 74%, #051531 87%, #010913 100%)}

/* bandas latitudinales: repeating-radial para que curven con la esfera (UV, no franjas planas) */
.planet .p-bands{overflow:hidden;mix-blend-mode:overlay;opacity:.68;
  background:repeating-radial-gradient(ellipse 190% 58% at 50% -46%,
    rgba(236,254,255,.10) 0 1.6%, rgba(0,0,0,0) 1.6% 3.4%,
    rgba(3,28,58,.13) 3.4% 5.2%, rgba(0,0,0,0) 5.2% 8.2%);
  animation:planet-spin 105s linear infinite}
@media (prefers-reduced-motion: reduce){.planet .p-bands{animation:none}}

/* mancha oscura: rompe la simetria */
.planet .p-spot{inset:auto;width:26%;height:15%;left:56%;top:56%;transform:rotate(-8deg);
  background:radial-gradient(ellipse,rgba(4,22,52,.50) 0%,rgba(4,22,52,.20) 52%,transparent 78%);
  filter:blur(calc(var(--pd,1em) * .012))}

/* terminador + realce de limbo iluminado */
.planet .p-shade{
  box-shadow:inset calc(var(--pd,1em) * .022) calc(var(--pd,1em) * .026) calc(var(--pd,1em) * .06) calc(var(--pd,1em) * -.022) rgba(214,248,255,.85),
             inset calc(var(--pd,1em) * -.05) calc(var(--pd,1em) * -.058) calc(var(--pd,1em) * .11) calc(var(--pd,1em) * -.04) rgba(0,6,20,.92)}

/* filo atmosferico: el arco fino que lo hace leer como planeta, no como bola */
.planet .p-rim{background:radial-gradient(circle,transparent 71%,
  rgba(160,226,255,.40) 87%,rgba(160,226,255,.06) 96%,transparent 100%);
  mix-blend-mode:screen}

/* especular pequeno y suave, arriba-izquierda */
.planet .p-spec{mix-blend-mode:screen;
  background:radial-gradient(circle at 29% 23%,rgba(233,253,255,.42) 0%,transparent 30%)}

@keyframes planet-spin{
  0%{background-position:0 0}
  100%{background-position:0 -240%}
}

@media (prefers-reduced-motion: reduce){
  #space-bg .dust{display:none}
  .planet{animation:none}
}
