/* 2.2.0-b.13.17 · Efectos visuales adicionales del nombre: base (envoltorio, capa, niveles, pausa, movimiento reducido).
   Solo afecta a .os-nfx, que solo existe si un artículo tiene efecto adicional. Sin efecto, este archivo no cambia nada. */
.os-nfx{position:relative;display:inline-block;vertical-align:baseline;max-width:100%;isolation:isolate;line-height:inherit}
.os-nfx>.os-name{position:relative;z-index:1}
.os-nfx__layer{position:absolute;z-index:2;top:calc(-.55em * var(--fx-size,1));bottom:calc(-.35em * var(--fx-size,1));left:calc(-.3em * var(--fx-size,1));right:calc(-.3em * var(--fx-size,1));pointer-events:none;user-select:none;-webkit-user-select:none;overflow:visible;contain:layout style;opacity:var(--fx-int,.8)}
.os-nfx__layer,.os-nfx__layer *{pointer-events:none!important}
.os-nfx--z-around .os-nfx__layer{z-index:0}
.os-nfx__p{position:absolute;left:var(--x,50%);top:var(--y,50%);width:calc(.34em * var(--fx-size,1) * var(--s,1));height:calc(.34em * var(--fx-size,1) * var(--s,1));margin:calc(-.17em * var(--fx-size,1)) 0 0 calc(-.17em * var(--fx-size,1));color:var(--fx-c1);animation-duration:calc(var(--d,2s) / var(--fx-spd,1));animation-delay:calc(var(--i,0) * -.37s);animation-iteration-count:infinite;animation-timing-function:ease-in-out;will-change:transform,opacity}
.os-nfx__p:nth-child(even){color:var(--fx-c2)}
.os-nfx__p svg{display:block;width:100%;height:100%;fill:var(--fx-c1)}
.os-nfx__p:nth-child(even) svg{fill:var(--fx-c2)}
.os-nfx--aura .os-nfx__p:nth-child(4n+1) svg{fill:#fff}
.os-nfx__ov{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);max-width:none;pointer-events:none}
.os-nfx__ov--stretch{width:100%;height:100%;object-fit:fill}
.os-nfx__ov--fixed{height:calc(2.2em * var(--fx-size,1));width:auto}
/* Niveles de detalle */
.os-nfx--lod-min .os-nfx__p{display:none}
/* Pausa fuera de pantalla y con la pestaña oculta */
.os-nfx.is-off .os-nfx__layer *,.os-nfx-hidden .os-nfx__layer *{animation-play-state:paused!important}
/* Movimiento reducido: sin partículas ni overlays animados, en todo el sitio */
@media (prefers-reduced-motion:reduce){.os-nfx__layer *{animation:none!important;transition:none!important}.os-nfx__p,.os-nfx__ov[data-anim="1"]{display:none!important}}
@media print{.os-nfx__layer{display:none}}

/* ===== b.13.18 · Fase 2: primeros efectos públicos =====
   Solo se anima transform y opacity (compositor). Sin filtros por partícula. El brillo va en un único halo por nombre. */

/* Brillo de cada partícula sin filtros: un degradado radial fijo detrás de la forma (se mueve con ella) */
.os-nfx--particulas .os-nfx__p,.os-nfx--corazones .os-nfx__p,.os-nfx--aura .os-nfx__p{position:absolute}
.os-nfx--particulas .os-nfx__p--sparkle::before,.os-nfx--corazones .os-nfx__p::before,.os-nfx--aura .os-nfx__p::before{content:"";position:absolute;inset:-70%;border-radius:50%;background:radial-gradient(circle,currentColor 0,transparent 62%);opacity:.45;z-index:-1}
.os-nfx--particulas .os-nfx__p svg,.os-nfx--corazones .os-nfx__p svg,.os-nfx--aura .os-nfx__p svg{position:relative}

/* --- Partículas mágicas: destellos de 4 puntas y puntos de luz que flotan y parpadean --- */
.os-nfx--particulas .os-nfx__p{width:calc(.46em * var(--fx-size,1) * var(--s,1));height:calc(.46em * var(--fx-size,1) * var(--s,1));margin:calc(-.23em * var(--fx-size,1)) 0 0 calc(-.23em * var(--fx-size,1));animation-name:os-nfx-twinkle;animation-duration:calc(var(--d,2s) * 1.25 / var(--fx-spd,1))}
.os-nfx--particulas .os-nfx__p:nth-child(3n){animation-name:os-nfx-twinkle2}
.os-nfx--particulas .os-nfx__p:not([class*="--"]){width:calc(.2em * var(--fx-size,1));height:calc(.2em * var(--fx-size,1));margin:calc(-.1em * var(--fx-size,1)) 0 0 calc(-.1em * var(--fx-size,1));border-radius:50%;background:radial-gradient(circle,#fff 0 22%,currentColor 45%,transparent 70%)}
@keyframes os-nfx-twinkle{0%,100%{opacity:0;transform:translate(0,0) scale(.15) rotate(0deg)}35%{opacity:1;transform:translate(.06em,-.1em) scale(1) rotate(35deg)}65%{opacity:.55;transform:translate(.12em,-.2em) scale(.6) rotate(70deg)}}
@keyframes os-nfx-twinkle2{0%,100%{opacity:0;transform:translate(0,0) scale(.2) rotate(0deg)}45%{opacity:1;transform:translate(-.1em,-.06em) scale(.9) rotate(-40deg)}75%{opacity:.4;transform:translate(-.18em,-.14em) scale(.5) rotate(-80deg)}}

/* --- Corazones encantados: nacen en la base del nombre, suben con vaivén y se desvanecen --- */
.os-nfx--corazones .os-nfx__layer{top:calc(-1.1em * var(--fx-size,1))}
.os-nfx--corazones .os-nfx__p{top:auto;bottom:calc(.1em + var(--y,50%) * .15);width:calc(.42em * var(--fx-size,1) * var(--s,1));height:calc(.42em * var(--fx-size,1) * var(--s,1));animation-name:os-nfx-heart;animation-timing-function:cubic-bezier(.3,.1,.4,1);animation-duration:calc(var(--d,2s) * 1.9 / var(--fx-spd,1));animation-delay:calc(var(--i,0) * -.83s)}
.os-nfx--corazones .os-nfx__p:nth-child(odd){animation-name:os-nfx-heart2}
.os-nfx--corazones.os-nfx--z-around .os-nfx__p,.os-nfx--corazones.os-nfx--z-above .os-nfx__p{bottom:auto;top:var(--y,50%)}
@keyframes os-nfx-heart{0%{opacity:0;transform:translate(0,0) scale(.35) rotate(-8deg)}15%{opacity:1}50%{transform:translate(.14em,-.6em) scale(.9) rotate(6deg)}80%{opacity:.7}100%{opacity:0;transform:translate(-.04em,-1.25em) scale(1) rotate(-4deg)}}
@keyframes os-nfx-heart2{0%{opacity:0;transform:translate(0,0) scale(.3) rotate(8deg)}18%{opacity:1}50%{transform:translate(-.14em,-.55em) scale(.85) rotate(-6deg)}80%{opacity:.6}100%{opacity:0;transform:translate(.06em,-1.15em) scale(.95) rotate(5deg)}}

/* --- Aura celestial: halo dorado que respira + estrellas finas en el borde --- */
.os-nfx--aura .os-nfx__layer::before{content:"";position:absolute;left:-4%;right:-4%;top:5%;bottom:0;border-radius:50%;background:radial-gradient(closest-side,var(--fx-c1) 0%,transparent 100%);opacity:.6;filter:blur(calc(.18em * var(--fx-size,1)));animation:os-nfx-breathe calc(4.2s / var(--fx-spd,1)) ease-in-out infinite}
.os-nfx--aura .os-nfx__layer::after{content:"";position:absolute;left:8%;right:8%;top:50%;height:1px;background:linear-gradient(90deg,transparent,var(--fx-c2),#fff,var(--fx-c2),transparent);opacity:0;transform:scaleX(.3);animation:os-nfx-glint calc(6s / var(--fx-spd,1)) ease-in-out infinite}
.os-nfx--aura .os-nfx__p{width:calc(.3em * var(--fx-size,1) * var(--s,1));height:calc(.3em * var(--fx-size,1) * var(--s,1));animation-name:os-nfx-starlight;animation-duration:calc(var(--d,2s) * 1.6 / var(--fx-spd,1));animation-delay:calc(var(--i,0) * -.61s)}
.os-nfx--aura .os-nfx__p:nth-child(odd){top:calc(var(--y,50%) * .18)}
.os-nfx--aura .os-nfx__p:nth-child(even){top:calc(78% + var(--y,50%) * .2)}
.os-nfx--aura .os-nfx__p:nth-child(4n+1){color:#fff}
@keyframes os-nfx-breathe{0%,100%{opacity:.45;transform:scale(.96)}50%{opacity:.7;transform:scale(1.04)}}
@keyframes os-nfx-glint{0%,60%,100%{opacity:0;transform:scaleX(.3)}75%{opacity:.85;transform:scaleX(1)}}
@keyframes os-nfx-starlight{0%,100%{opacity:.15;transform:scale(.5) rotate(0deg)}50%{opacity:1;transform:scale(1) rotate(25deg)}}
/* Movimiento reducido: el halo se queda fijo (elegante y sin movimiento); destellos y corazones ocultos por la regla general */
@media (prefers-reduced-motion:reduce){.os-nfx__layer::before,.os-nfx__layer::after{animation:none!important}.os-nfx--aura .os-nfx__layer::before{opacity:.6}.os-nfx--aura .os-nfx__layer::after{display:none}}
/* Nivel mínimo (listas muy llenas): solo queda el halo del aura; los demás efectos no pintan nada */
.os-nfx--lod-min .os-nfx__layer::after{display:none}
.os-nfx.is-off .os-nfx__layer::before,.os-nfx.is-off .os-nfx__layer::after,.os-nfx-hidden .os-nfx__layer::before,.os-nfx-hidden .os-nfx__layer::after{animation-play-state:paused!important}

/* Efecto de PRUEBA (solo con OS_NAMEFX_TEST): aura + puntos/estrellas que suben. Sirve para validar la base. */
.os-nfx--prueba .os-nfx__layer::before{content:"";position:absolute;inset:10% 0;border-radius:50%;background:radial-gradient(closest-side,color-mix(in srgb,var(--fx-c1) 45%,transparent),transparent);filter:blur(6px)}
.os-nfx--prueba .os-nfx__p{animation-name:os-nfx-rise}
.os-nfx--prueba .os-nfx__p:not([class*="--"]){border-radius:50%;background:currentColor;box-shadow:0 0 6px currentColor}
.os-nfx--z-above.os-nfx--prueba .os-nfx__p,.os-nfx--z-around.os-nfx--prueba .os-nfx__p{animation-name:os-nfx-float}
@keyframes os-nfx-rise{0%{transform:translateY(.4em) scale(.6);opacity:0}25%{opacity:1}100%{transform:translateY(-1em) scale(1);opacity:0}}
@keyframes os-nfx-float{0%,100%{transform:translate(0,0);opacity:.2}50%{transform:translate(.15em,-.25em);opacity:1}}
