.celestial-bg {
  position: fixed;
  inset: 0;
  z-index: -3;
  overflow: hidden;
  pointer-events: none;
  opacity: calc(0.24 + (var(--hero-dim) * 0.0038));
}

.celestial-streaks {
  position: fixed;
  inset: 0;
  z-index: -2;
  overflow: hidden;
  pointer-events: none;
  opacity: 1;
  mix-blend-mode: screen;
}

body.page-home .celestial-bg,
body.page-home .celestial-streaks,
body.page-category .celestial-bg,
body.page-category .celestial-streaks,
body.page-category-tiered .celestial-bg,
body.page-category-tiered .celestial-streaks,
body.page-package .celestial-bg,
body.page-package .celestial-streaks {
  display: none;
}

.celestial-bg::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(143, 234, 255, 0.035) 1px, transparent 1px),
    linear-gradient(rgba(143, 234, 255, 0.025) 1px, transparent 1px),
    radial-gradient(circle at 50% 0%, rgba(98, 194, 255, 0.08), transparent 42%);
  background-size: 64px 64px, 64px 64px, auto;
  opacity: 0.18;
  mask-image: linear-gradient(180deg, transparent 0%, rgba(0, 0, 0, 0.88) 18%, rgba(0, 0, 0, 1) 100%);
}

.celestial-nebula,
.celestial-starfield,
.celestial-particles,
.celestial-deep-stars {
  position: absolute;
  inset: 0;
  mask-image: linear-gradient(180deg, transparent 0%, rgba(0, 0, 0, 0.08) 18%, rgba(0, 0, 0, 0.62) 42%, rgba(0, 0, 0, 1) 100%);
}

.celestial-starfield {
  opacity: calc(0.32 + (var(--hero-dim) * 0.0032));
}

.celestial-particles {
  opacity: calc(0.18 + (var(--hero-dim) * 0.0041));
}

.celestial-deep-stars {
  opacity: calc(0.54 + (var(--hero-dim) * 0.0042));
  mask-image: linear-gradient(180deg, transparent 0%, transparent 46%, rgba(0, 0, 0, 0.12) 56%, rgba(0, 0, 0, 0.82) 70%, rgba(0, 0, 0, 1) 100%);
}

.celestial-streaks {
  mask-image: linear-gradient(180deg, rgba(0, 0, 0, 0.46) 0%, rgba(0, 0, 0, 0.8) 32%, rgba(0, 0, 0, 1) 100%);
}

.celestial-nebula span,
.celestial-star,
.celestial-particle,
.shooting-star {
  position: absolute;
  will-change: transform, opacity;
}

.celestial-nebula span {
  border-radius: 999px;
}

.celestial-star,
.celestial-particle,
.shooting-star {
  border-radius: 2px;
}

.celestial-nebula span:nth-child(1) {
  width: min(54vw, 640px);
  height: min(54vw, 640px);
  top: -14%;
  left: -10%;
  background: radial-gradient(circle, rgba(98, 194, 255, 0.46) 0%, rgba(98, 194, 255, 0.14) 42%, transparent 70%);
  filter: blur(82px);
  animation: driftA 18s ease-in-out infinite alternate;
}

.celestial-nebula span:nth-child(2) {
  width: min(48vw, 560px);
  height: min(48vw, 560px);
  top: 12%;
  right: -12%;
  background: radial-gradient(circle, rgba(47, 109, 255, 0.4) 0%, rgba(47, 109, 255, 0.14) 42%, transparent 70%);
  filter: blur(86px);
  animation: driftB 22s ease-in-out infinite alternate;
}

.celestial-nebula span:nth-child(3) {
  width: min(38vw, 440px);
  height: min(38vw, 440px);
  left: 34%;
  bottom: -18%;
  background: radial-gradient(circle, rgba(233, 246, 255, 0.22) 0%, rgba(233, 246, 255, 0.08) 36%, transparent 72%);
  filter: blur(78px);
  animation: driftC 20s ease-in-out infinite alternate;
}

.celestial-star {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(143, 234, 255, 0.82));
  box-shadow:
    0 0 0 1px rgba(255, 255, 255, 0.08),
    0 0 12px rgba(98, 194, 255, 0.38);
  animation: twinkle var(--dur, 16s) ease-in-out infinite, float var(--dur2, 18s) ease-in-out infinite;
  animation-delay: var(--delay, 0s);
  opacity: var(--alpha, 0.8);
}

.celestial-particle {
  background: var(--pcolor, rgba(98, 194, 255, 0.8));
  box-shadow: 0 0 10px rgba(98, 194, 255, 0.26);
  opacity: 0.42;
  animation: particleFloat var(--dur, 22s) ease-in-out infinite;
  animation-delay: var(--delay, 0s);
}

.shooting-star {
  height: 3px;
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(143, 234, 255, 0), rgba(143, 234, 255, 0.34) 14%, rgba(232, 249, 255, 0.98) 66%, rgba(255, 255, 255, 1) 100%);
  box-shadow: 0 0 28px rgba(98, 194, 255, 0.54), 0 0 44px rgba(255, 255, 255, 0.42);
  opacity: 0;
  transform-origin: right center;
  animation: shootingStarFall var(--shoot-dur, 6.4s) linear infinite;
  animation-delay: var(--shoot-delay, 0s);
}

.celestial-streaks .shooting-star {
  filter: drop-shadow(0 0 20px rgba(174, 230, 255, 0.7));
}

.shooting-star::after {
  content: "";
  position: absolute;
  right: -2px;
  top: 50%;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.96);
  box-shadow: 0 0 26px rgba(255, 255, 255, 0.5);
  transform: translateY(-50%);
}

.hero-particle-layer {
  position: absolute;
  inset: 0;
  z-index: 1;
  overflow: hidden;
  pointer-events: none;
}

.hero-star-particle {
  position: absolute;
  background: var(--hero-color, linear-gradient(135deg, rgba(255, 255, 255, 0.96), rgba(98, 194, 255, 0.88)));
  clip-path: polygon(50% 0%, 63% 34%, 100% 38%, 72% 58%, 82% 100%, 50% 76%, 18% 100%, 28% 58%, 0% 38%, 37% 34%);
  box-shadow:
    0 0 0 1px rgba(255, 255, 255, 0.06),
    0 0 18px rgba(98, 194, 255, 0.26);
  opacity: 0;
  will-change: transform, opacity;
  animation:
    heroParticleDrift var(--hero-dur, 9s) linear infinite,
    heroParticleBlink var(--hero-blink, 3.8s) ease-in-out infinite;
  animation-delay: var(--hero-delay, 0s);
}

.hero-star-particle.is-soft {
  filter: blur(.8px);
  opacity: .78;
}

.hero-home-panel.show .hero-copy-panel {
  animation: fadeLift .92s .08s both;
}

.hero-home-panel.show .hero-launch-card {
  animation: fadeLift 1s .22s both;
}

.hero-home-panel.show .hero-quick-card-floating {
  animation: fadeLift .95s .14s both;
}

.hero-home-panel.show .hero-character-image {
  animation:
    heroCharacterIn .96s cubic-bezier(.18, .84, .2, 1) both,
    heroCharacterBob 5.4s 1s ease-in-out infinite;
}

.hero-home-panel.show .hero-character-aura.aura-one {
  animation: heroAuraPulse 4.8s ease-in-out infinite;
}

.hero-home-panel.show .hero-character-aura.aura-two {
  animation: heroAuraPulse 5.8s ease-in-out infinite -.8s;
}

.hero-home-panel.show .hero-character-star {
  animation: heroStaticStarDrift 4.8s ease-in-out infinite;
}

.hero-home-panel.show .hero-character-star.star-two { animation-delay: -.8s; }
.hero-home-panel.show .hero-character-star.star-three { animation-delay: -1.6s; }
.hero-home-panel.show .hero-character-star.star-four { animation-delay: -.4s; }
.hero-home-panel.show .hero-character-star.star-five { animation-delay: -1.1s; }
.hero-home-panel.show .hero-character-star.star-six { animation-delay: -1.9s; }

.hero-category-panel.show .hero-character-image {
  animation:
    heroCharacterIn .96s cubic-bezier(.18, .84, .2, 1) both,
    heroCharacterBob 5.4s 1s ease-in-out infinite;
}

.hero-category-panel.show .hero-character-star {
  animation: heroStaticStarDrift 4.8s ease-in-out infinite;
}

.hero-category-panel.show .hero-character-star.star-two { animation-delay: -.8s; }
.hero-category-panel.show .hero-character-star.star-three { animation-delay: -1.6s; }
.hero-category-panel.show .hero-character-star.star-four { animation-delay: -.4s; }
.hero-category-panel.show .hero-character-star.star-five { animation-delay: -1.1s; }
.hero-category-panel.show .hero-character-star.star-six { animation-delay: -1.9s; }

.footer {
  position: relative;
  overflow: hidden;
}

.footer-stack {
  position: relative;
  z-index: 1;
}

.footer-star-particles {
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
}

.footer-star-particle {
  position: absolute;
  width: var(--star-size, 18px);
  height: var(--star-size, 18px);
  clip-path: polygon(50% 0%, 63% 34%, 100% 38%, 72% 58%, 82% 100%, 50% 76%, 18% 100%, 28% 58%, 0% 38%, 37% 34%);
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.98), rgba(143, 234, 255, 0.88));
  box-shadow:
    0 0 0 1px rgba(255, 255, 255, 0.08),
    0 0 18px rgba(98, 194, 255, 0.28);
  opacity: var(--star-alpha, .84);
  animation:
    footerStarFloat var(--star-dur, 5.8s) ease-in-out infinite,
    footerStarPulse var(--star-pulse, 2.4s) ease-in-out infinite;
  animation-delay: var(--star-delay, 0s);
}

.hero-logo {
  position: relative;
  width: clamp(220px, 28vw, 360px);
  aspect-ratio: 1;
  margin: 2px auto 0;
  display: grid;
  place-items: center;
  isolation: isolate;
  animation: logoDrift 6.2s ease-in-out infinite;
}

.hero-logo-breath {
  position: absolute;
  inset: 50%;
  transform: translate(-50%, -50%);
  border-radius: 50%;
  pointer-events: none;
  mix-blend-mode: screen;
}

.hero-logo-breath.breath-a {
  width: 72%;
  height: 72%;
  border: 1px solid rgba(143, 234, 255, 0.28);
  background: radial-gradient(circle, rgba(98, 194, 255, 0.22) 0%, rgba(98, 194, 255, 0.05) 54%, transparent 76%);
  box-shadow: 0 0 34px rgba(98, 194, 255, 0.18);
  animation: logoAuraBreath 4.6s ease-in-out infinite;
}

.hero-logo-breath.breath-b {
  width: 102%;
  height: 102%;
  border: 1px solid rgba(173, 204, 255, 0.14);
  background: radial-gradient(circle, rgba(255, 255, 255, 0.12) 0%, rgba(143, 234, 255, 0.04) 42%, transparent 72%);
  box-shadow: 0 0 48px rgba(98, 194, 255, 0.12);
  animation: logoAuraBreathLarge 4.6s ease-in-out infinite .55s;
}

.hero-logo-orbit {
  position: absolute;
  inset: 50%;
  transform: translate(-50%, -50%);
  border-radius: 50%;
  pointer-events: none;
}

.hero-logo-orbit.orbit-home-a {
  width: 112%;
  height: 112%;
  border: 1px solid rgba(143, 234, 255, 0.2);
  border-top-color: rgba(255, 255, 255, 0.08);
  border-bottom-color: rgba(98, 194, 255, 0.42);
  box-shadow: 0 0 20px rgba(98, 194, 255, 0.12);
  animation: orbitSpin 10s linear infinite;
}

.hero-logo-orbit.orbit-home-b {
  width: 88%;
  height: 88%;
  border: 1px dashed rgba(173, 204, 255, 0.24);
  opacity: .88;
  animation: orbitCounter 7.4s linear infinite;
}

.hero-logo::before,
.hero-logo::after {
  content: "";
  position: absolute;
  inset: 50%;
  transform: translate(-50%, -50%);
  border-radius: 50%;
  pointer-events: none;
}

.hero-logo::before {
  width: 92%;
  height: 92%;
  background: radial-gradient(circle, rgba(98, 194, 255, 0.3) 0%, rgba(143, 234, 255, 0.08) 40%, transparent 72%);
  filter: blur(18px);
  animation: haloPulse 3.4s ease-in-out infinite;
}

.hero-logo::after {
  width: 100%;
  height: 100%;
  border: 1px solid rgba(143, 234, 255, 0.14);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.04);
  background: radial-gradient(circle, rgba(255, 255, 255, 0.04), transparent 62%);
}

.logo-ring,
.logo-orbit {
  position: absolute;
  inset: 50%;
  transform: translate(-50%, -50%);
  border-radius: 50%;
  pointer-events: none;
}

.logo-ring {
  border: 1px solid rgba(168, 214, 255, 0.2);
  box-shadow: 0 0 22px rgba(98, 194, 255, 0.12);
}

.logo-ring.ring-a {
  width: 86%;
  height: 86%;
  animation: orbitSpin 16s linear infinite;
}

.logo-ring.ring-b {
  width: 64%;
  height: 64%;
  border-color: rgba(143, 234, 255, 0.24);
  animation: orbitCounter 11s linear infinite;
}

.logo-orbit {
  width: 100%;
  height: 100%;
  animation: orbitSpin 12s linear infinite;
}

.logo-orbit.alt {
  width: 76%;
  height: 76%;
  animation: orbitCounter 9s linear infinite;
}

.logo-orbit i {
  position: absolute;
  top: -3px;
  left: 50%;
  width: 10px;
  height: 10px;
  margin-left: -5px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--blue), var(--cyan));
  box-shadow: 0 0 18px rgba(98, 194, 255, 0.8);
}

.logo-orbit.alt i {
  width: 8px;
  height: 8px;
  margin-left: -4px;
  background: linear-gradient(135deg, var(--cyan), #ffffff);
}

.logo-pixel {
  position: absolute;
  width: 12px;
  height: 12px;
  background: linear-gradient(135deg, var(--blue), var(--cyan));
  box-shadow: 0 0 16px rgba(98, 194, 255, 0.44);
  border-radius: 2px;
  animation: pixelDrift 5.2s ease-in-out infinite;
}

.pixel-a { top: 18%; left: 8%; animation-delay: -.4s; }
.pixel-b { top: 28%; right: 10%; width: 10px; height: 10px; animation-delay: -.8s; }
.pixel-c { bottom: 18%; left: 12%; width: 9px; height: 9px; animation-delay: -1.2s; }
.pixel-d { bottom: 24%; right: 14%; width: 14px; height: 14px; animation-delay: -1.6s; }

.logo-core {
  position: relative;
  width: 52%;
  height: 52%;
  display: grid;
  place-items: center;
  border-radius: 32px;
  background:
    linear-gradient(145deg, rgba(98, 194, 255, 0.24), rgba(47, 109, 255, 0.18)),
    rgba(7, 14, 34, 0.9);
  border: 1px solid rgba(173, 204, 255, 0.16);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.16),
    0 0 24px rgba(98, 194, 255, 0.18),
    0 20px 42px rgba(1, 8, 24, 0.42);
  animation: coreFloat 4.4s ease-in-out infinite;
}

.hero-logo-image {
  width: 108%;
  height: 108%;
  object-fit: contain;
  filter: drop-shadow(0 0 24px rgba(98, 194, 255, 0.2)) drop-shadow(0 18px 26px rgba(0, 0, 0, 0.24));
  animation: heroImageFloat 5.6s ease-in-out infinite;
}

.hero-logo-echo {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 108%;
  height: auto;
  object-fit: contain;
  opacity: .34;
  transform: translate(-50%, -50%);
  filter: blur(12px) saturate(1.15) drop-shadow(0 0 28px rgba(98, 194, 255, 0.34));
  animation: logoEchoPulse 3.8s ease-in-out infinite;
  pointer-events: none;
}

.hero-brand-mark {
  width: 104px;
  height: 104px;
  border-radius: 30px;
  background: linear-gradient(145deg, rgba(98, 194, 255, 0.34), rgba(47, 109, 255, 0.2));
}

.hero-brand-mark::before {
  inset: 24px;
  border-radius: 16px;
} 

.hero-brand-mark::after {
  inset: 34px;
  border-color: rgba(143, 234, 255, 0.5);
  box-shadow: 0 0 16px rgba(143, 234, 255, 0.42);
}

body.page-home .hero-logo {
  width: clamp(126px, 11vw, 174px);
  transform-origin: center center;
  will-change: transform, filter;
  animation: logoBreathing 5.2s ease-in-out infinite;
}

body.page-home .hero-logo-orbit,
body.page-home .logo-ring,
body.page-home .logo-orbit {
  display: none;
}

body.page-home .hero-logo-breath {
  display: none;
}

body.page-home .hero-logo::before,
body.page-home .hero-logo::after {
  display: none;
}

body.page-home .logo-core {
  width: auto;
  height: auto;
  border: 0;
  background: none;
  box-shadow: none;
  will-change: transform, filter;
  animation: logoCorePulseHome 5.2s ease-in-out infinite;
}

body.page-home .hero-logo-image {
  width: clamp(118px, 9vw, 152px);
  height: auto;
  filter:
    drop-shadow(0 16px 34px rgba(0, 0, 0, 0.28))
    drop-shadow(0 0 34px rgba(147, 218, 255, 0.34));
  will-change: transform, filter;
  transform-origin: center center;
  animation: logoBreathImageHome 5.2s ease-in-out infinite;
}

body.page-home .hero-logo-echo {
  display: block;
  opacity: .18;
  filter: blur(16px) saturate(1.2) drop-shadow(0 0 34px rgba(98, 194, 255, 0.34));
  will-change: transform, opacity, filter;
  animation: logoEchoPulseHome 5.2s ease-in-out infinite;
}

body.page-home .logo-pixel {
  opacity: .92;
  box-shadow:
    0 0 0 1px rgba(255, 255, 255, 0.08),
    0 0 18px rgba(98, 194, 255, 0.42);
}

@keyframes driftA {
  from { transform: translate3d(0, 0, 0) scale(1); }
  to { transform: translate3d(6%, 8%, 0) scale(1.08); }
}

@keyframes driftB {
  from { transform: translate3d(0, 0, 0) scale(1); }
  to { transform: translate3d(-7%, 10%, 0) scale(1.1); }
}

@keyframes shootingStarFall {
  0% {
    opacity: 0;
    transform: translate3d(0, -20px, 0) rotate(var(--shoot-rot, -28deg)) scaleX(.66);
  }

  8% {
    opacity: var(--shoot-alpha, 0.76);
  }

  72% {
    opacity: var(--shoot-alpha, 0.76);
  }

  100% {
    opacity: 0;
    transform: translate3d(var(--shoot-x, -220px), var(--shoot-y, 160px), 0) rotate(var(--shoot-rot, -28deg)) scaleX(1);
  }
}

@keyframes driftC {
  from { transform: translate3d(0, 0, 0) scale(1); }
  to { transform: translate3d(4%, -10%, 0) scale(1.08); }
}

@keyframes twinkle {
  0%, 100% { opacity: calc(var(--alpha, .8) * .55); }
  50% { opacity: min(calc(var(--alpha, .8) + .18), 1); }
}

@keyframes float {
  0%, 100% { transform: translate3d(0, 0, 0) scale(.92); }
  50% { transform: translate3d(var(--sx, 8px), var(--sy, -18px), 0) scale(1.24); }
}

@keyframes particleFloat {
  0%, 100% { transform: translate3d(0, 0, 0) scale(.9); opacity: .22; }
  50% { transform: translate3d(var(--sx, 12px), var(--sy, -24px), 0) scale(1.14); opacity: .46; }
}

@keyframes haloPulse {
  0%, 100% { transform: translate(-50%, -50%) scale(.96); opacity: .7; }
  50% { transform: translate(-50%, -50%) scale(1.06); opacity: 1; }
}

@keyframes orbitSpin {
  from { transform: translate(-50%, -50%) rotate(0deg); }
  to { transform: translate(-50%, -50%) rotate(360deg); }
}

@keyframes orbitCounter {
  from { transform: translate(-50%, -50%) rotate(360deg); }
  to { transform: translate(-50%, -50%) rotate(0deg); }
}

@keyframes coreFloat {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-8px); }
}

@keyframes heroImageFloat {
  0%, 100% { transform: translateY(0) rotate(-1.2deg) scale(1); }
  50% { transform: translateY(-14px) rotate(1.2deg) scale(1.03); }
}

@keyframes pixelDrift {
  0%, 100% { transform: translate3d(0, 0, 0) rotate(0deg); opacity: .55; }
  50% { transform: translate3d(0, -12px, 0) rotate(18deg); opacity: 1; }
}

@keyframes logoDrift {
  0%, 100% { transform: translateY(0) rotate(0deg); }
  50% { transform: translateY(-8px) rotate(.8deg); }
}

@keyframes logoBreathing {
  0%, 100% { transform: translateY(0) scale(.992); filter: brightness(.99); }
  50% { transform: translateY(-1.5px) scale(1.014); filter: brightness(1.025); }
}

@keyframes logoBreathImage {
  0%, 100% { transform: scale(.96) rotate(-1.6deg); }
  40% { transform: scale(1.04) rotate(.8deg); }
  65% { transform: scale(1.1) rotate(1.8deg); }
}

@keyframes logoAuraBreath {
  0%, 100% { transform: translate(-50%, -50%) scale(.9); opacity: .42; }
  55% { transform: translate(-50%, -50%) scale(1.16); opacity: .9; }
}

@keyframes logoAuraBreathLarge {
  0%, 100% { transform: translate(-50%, -50%) scale(.82); opacity: .18; }
  55% { transform: translate(-50%, -50%) scale(1.08); opacity: .52; }
}

@keyframes logoCorePulse {
  0%, 100% { transform: scale(.98); }
  50% { transform: scale(1.06); }
}

@keyframes logoEchoPulse {
  0%, 100% { opacity: .24; transform: translate(-50%, -50%) scale(.92); }
  50% { opacity: .52; transform: translate(-50%, -50%) scale(1.12); }
}

@keyframes logoEchoPulseHome {
  0%, 100% { opacity: .12; transform: translate(-50%, -50%) scale(.97); filter: blur(13px); }
  50% { opacity: .24; transform: translate(-50%, -50%) scale(1.04); filter: blur(15px); }
}

@keyframes logoCorePulseHome {
  0%, 100% { transform: scale(.995); filter: brightness(.995); }
  50% { transform: scale(1.018); filter: brightness(1.03); }
}

@keyframes logoBreathImageHome {
  0%, 100% { transform: scale(.995) rotate(-.2deg); filter: drop-shadow(0 16px 34px rgba(0, 0, 0, 0.28)) drop-shadow(0 0 22px rgba(147, 218, 255, 0.18)); }
  50% { transform: scale(1.022) rotate(.2deg); filter: drop-shadow(0 17px 35px rgba(0, 0, 0, 0.29)) drop-shadow(0 0 28px rgba(147, 218, 255, 0.26)); }
}

@media (prefers-reduced-motion: reduce) {
  body.page-home .hero-logo {
    animation: logoBreathing 5.2s ease-in-out infinite !important;
  }

  body.page-home .logo-core {
    animation: logoCorePulseHome 5.2s ease-in-out infinite !important;
  }

  body.page-home .hero-logo-image {
    animation: logoBreathImageHome 5.2s ease-in-out infinite !important;
  }

  body.page-home .hero-logo-echo {
    animation: logoEchoPulseHome 5.2s ease-in-out infinite !important;
  }
}

@keyframes logoHorizontalDrift {
  0%, 100% { margin-left: 0; }
  50% { margin-left: 8px; }
}

@keyframes heroParticleDrift {
  0% {
    transform: translate3d(0, 10px, 0) scale(.62) rotate(0deg);
    opacity: 0;
  }
  18% {
    opacity: var(--hero-alpha, .8);
  }
  100% {
    transform: translate3d(var(--tx, 0px), var(--ty, -90px), 0) scale(1.16) rotate(var(--rot, 70deg));
    opacity: 0;
  }
}

@keyframes heroParticleBlink {
  0%, 100% { filter: brightness(.94); }
  50% { filter: brightness(1.36); }
}

@keyframes heroCharacterIn {
  0% {
    opacity: 0;
    transform: translate(0, 28px) scale(.84) rotate(-6deg);
    filter: blur(10px);
  }
  62% {
    opacity: 1;
    transform: translate(0, -4px) scale(1.02) rotate(.8deg);
    filter: blur(0);
  }
  100% {
    opacity: 1;
    transform: translate(0, 0) scale(1) rotate(0deg);
    filter: blur(0);
  }
}

@keyframes heroCharacterBob {
  0%, 100% { transform: translateY(0) scale(1); }
  50% { transform: translateY(-10px) scale(1.015); }
}

@keyframes heroAuraPulse {
  0%, 100% { transform: scale(.96); opacity: .72; }
  50% { transform: scale(1.04); opacity: 1; }
}

@keyframes heroStaticStarDrift {
  0%, 100% { transform: translateY(0) scale(1) rotate(0deg); opacity: .78; }
  50% { transform: translateY(-10px) scale(1.08) rotate(10deg); opacity: 1; }
}

@keyframes footerStarFloat {
  0%, 100% { transform: translateY(0) scale(.94); }
  50% { transform: translateY(-12px) scale(1.08); }
}

@keyframes footerStarPulse {
  0%, 100% { opacity: var(--star-alpha, .84); filter: brightness(.95); }
  50% { opacity: 1; filter: brightness(1.24); }
}