:root{--noche-alta: #2A1259;--noche-media: #1A0B3D;--noche-baja: #0A0520;--amarillo-claro: #FFF3A8;--amarillo: #FFE566;--ambar: #FFA41B;--verde-claro: #4CAF50;--verde: #2F8038;--escena-ancho: min(92vw, 78vmin, 58svh);color-scheme:dark}*,*:before,*:after{box-sizing:border-box}html,body{margin:0;padding:0;min-height:100%}body{background:var(--noche-baja);font-family:Trebuchet MS,Segoe UI,system-ui,-apple-system,sans-serif;color:#fff;overflow-x:hidden}.escena{position:relative;min-height:100svh;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:clamp(.5rem,2vh,1.75rem);background:radial-gradient(ellipse 120% 70% at 50% 0%,var(--noche-alta) 0%,transparent 60%),radial-gradient(ellipse 100% 80% at 50% 40%,var(--noche-media) 0%,var(--noche-baja) 75%);padding:calc(env(safe-area-inset-top,0px) + clamp(1.5rem,5vh,3.5rem)) 1rem calc(env(safe-area-inset-bottom,0px) + 1rem);overflow:hidden}.escena:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;background:radial-gradient(ellipse 75% 65% at 50% 55%,transparent 40%,rgba(5,2,16,.55) 100%)}.saludo{position:relative;z-index:3;text-align:center;max-width:min(92vw,34rem);animation:saludo-entra 1.4s ease-out both}.saludo__titulo{margin:0;font-size:clamp(2rem,9vw,3.5rem);line-height:1.12;font-weight:700;letter-spacing:.02em;display:flex;flex-direction:column;overflow-wrap:anywhere}.saludo__linea{color:var(--amarillo-claro);text-shadow:0 0 6px rgba(255,243,168,.9),0 0 16px rgba(255,229,102,.75),0 0 34px rgba(255,164,27,.55),0 0 62px rgba(255,164,27,.35);animation:titulo-latido 4s ease-in-out infinite}.saludo__linea--para{font-size:.78em;animation-delay:.6s}.saludo__mensaje{margin:clamp(.6rem,2vh,1.1rem) 0 0;font-size:clamp(.95rem,3.6vw,1.15rem);line-height:1.5;color:#f3e9ff;text-shadow:0 0 12px rgba(180,140,255,.5);overflow-wrap:anywhere}@keyframes saludo-entra{0%{opacity:0;transform:translateY(-1.5rem)}to{opacity:1;transform:none}}@keyframes titulo-latido{0%,to{filter:brightness(1)}50%{filter:brightness(1.18)}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:1ms!important;animation-iteration-count:1!important;transition-duration:1ms!important}}.cielo{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:1}.capa{position:absolute;top:0;right:0;bottom:0;left:0}.estrella{position:absolute;border-radius:50%;background:#fff;animation-name:titilar;animation-iteration-count:infinite;animation-timing-function:ease-in-out}.capa--lejos .estrella{width:1.5px;height:1.5px;opacity:.5}.capa--media .estrella{width:2.5px;height:2.5px;opacity:.75;box-shadow:0 0 4px #fffc}.capa--cerca .estrella{width:3.5px;height:3.5px;box-shadow:0 0 6px #fffffff2,0 0 12px #ffe56680}@keyframes titilar{0%,to{opacity:.2;transform:scale(.85)}50%{opacity:1;transform:scale(1.15)}}.destello{position:absolute;color:var(--amarillo);filter:drop-shadow(0 0 6px rgba(255,229,102,.9));animation-name:brillar;animation-iteration-count:infinite;animation-timing-function:ease-in-out}@keyframes brillar{0%,to{opacity:.25;transform:scale(.7) rotate(0)}50%{opacity:1;transform:scale(1.1) rotate(45deg)}}.luciernaga{position:absolute;width:4px;height:4px;border-radius:50%;background:var(--amarillo);box-shadow:0 0 6px 2px #ffe566cc,0 0 14px 4px #ffa41b66;animation-name:flotar;animation-iteration-count:infinite;animation-timing-function:ease-in-out}@keyframes flotar{0%{opacity:0;transform:translate(0) scale(.6)}15%{opacity:1}50%{transform:translate(14px,-45px) scale(1)}85%{opacity:.9}to{opacity:0;transform:translate(-10px,-95px) scale(.7)}}.ramo{position:relative;z-index:2;width:var(--escena-ancho);aspect-ratio:1 / 1;margin-top:clamp(.5rem,4vh,3rem);margin-bottom:auto;filter:drop-shadow(0 0 30px rgba(255,164,27,.25))}.ramo__tallos{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;overflow:visible}.tallo{transform-origin:50% 100%;animation:tallo-crece 1.1s cubic-bezier(.22,1,.36,1) both}@keyframes tallo-crece{0%{opacity:0;transform:scaleY(.05)}to{opacity:1;transform:scaleY(1)}}.ramo__flor{position:absolute;transform:translate(-50%,-50%);aspect-ratio:1 / 1}.ramo__flor-abre{width:100%;height:100%;transform-origin:50% 90%;animation:flor-abre .9s cubic-bezier(.34,1.56,.64,1) both}.ramo__flor-vaiven{width:100%;height:100%;transform-origin:50% 90%;animation:flor-vaiven var(--vaiven, 5s) ease-in-out infinite}.ramo__flor-boton{width:100%;height:100%;padding:0;border:none;background:none;display:block;position:relative;cursor:pointer;transform-origin:50% 85%;transition:transform .35s cubic-bezier(.34,1.56,.64,1)}.ramo__flor-boton,.ramo__flor-boton .girasol{pointer-events:none}.ramo__flor-boton .girasol ellipse,.ramo__flor-boton .girasol circle{pointer-events:auto}.ramo__flor-boton:has(:hover),.ramo__flor-boton:focus-visible{transform:scale(1.12)}.ramo__flor-boton:has(:active){transform:scale(1.04)}.ramo__flor-boton:focus{outline:none}.ramo__flor-boton:focus-visible{filter:drop-shadow(0 0 10px rgba(255,255,255,.95))}.girasol{width:100%;height:100%;display:block;filter:drop-shadow(0 0 8px rgba(255,229,102,.75)) drop-shadow(0 0 20px rgba(255,164,27,.45))}.girasol__petalos--interior{opacity:.92}@keyframes flor-abre{0%{opacity:0;transform:scale(.1) rotate(-45deg)}to{opacity:1;transform:scale(1) rotate(0)}}@keyframes flor-vaiven{0%,to{transform:rotate(-2.5deg)}50%{transform:rotate(2.5deg)}}.ramo__polen{position:absolute;transform:translate(-50%,-50%);aspect-ratio:1 / 1;pointer-events:none;z-index:3;container-type:size}.polen{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;overflow:visible}.polen__mota{position:absolute;left:50%;top:50%;width:var(--tam, 4px);height:var(--tam, 4px);margin:calc(var(--tam, 4px) / -2) 0 0 calc(var(--tam, 4px) / -2);border-radius:50%;background:radial-gradient(circle at 35% 35%,#fff 0%,var(--amarillo-claro) 55%,var(--ambar) 100%);box-shadow:0 0 4px 1px #fffffff2,0 0 9px 3px #ffa41bcc,0 0 16px 6px #ff780059;outline:1px solid rgba(120,60,0,.35);outline-offset:-1px;animation-name:polen-vuela;animation-timing-function:cubic-bezier(.17,.85,.44,1);animation-fill-mode:both}@keyframes polen-vuela{0%{opacity:0;transform:rotate(var(--angulo)) translateY(0) rotate(calc(var(--angulo) * -1)) scale(.4)}12%{opacity:1}70%{opacity:1}to{opacity:0;transform:rotate(var(--angulo)) translateY(calc(var(--distancia) * -1)) rotate(calc(var(--angulo) * -1)) scale(1)}}@media(prefers-reduced-motion:reduce){.polen{display:none}}@media(max-width:480px){.ramo{width:min(98vw,92vmin,58svh)}}