/* Unicorn + castle animations for pages outside the games (the launcher).
   Mirrors the matching rules in each game's style.css. */

.unicorn-svg { display: block; width: 100%; height: auto; overflow: visible; }
.bob .unicorn-svg { animation: bob 2.4s ease-in-out infinite; }
.u-eye { transform-box: fill-box; transform-origin: center; animation: blink 4.5s infinite; }
.u-wing { transform-origin: 104px 84px; animation: flap 2.4s ease-in-out infinite; }
.u-tail { transform-origin: 50px 92px; animation: swish 2.4s ease-in-out infinite; }
.u-spark { animation: twinkle 1.8s ease-in-out infinite; transform-box: fill-box; transform-origin: center; }

.castle-svg { display: block; width: 100%; height: auto; }
.c-flag { transform-box: fill-box; transform-origin: left center; animation: wave 1.6s ease-in-out infinite; }
.c-bulb { animation: twinkle 1.4s ease-in-out infinite; transform-box: fill-box; transform-origin: center; }
.c-burst { transform-box: fill-box; transform-origin: center; animation: burst 2.4s ease-out infinite; }
.c-water { animation: water 0.8s linear infinite; }
.c-balloons { animation: bob 3s ease-in-out infinite; }
.u-float, .c-float { animation: floatUp 3s ease-in-out infinite; transform-box: fill-box; transform-origin: center; }
.c-bat { animation: batFlap .45s ease-in-out infinite alternate; transform-box: fill-box; transform-origin: center; }
.c-snow { animation: snowFall 6s linear infinite; }
.c-sway { animation: sway 3.2s ease-in-out infinite; }
.c-rock { animation: rock 2.4s ease-in-out infinite; }
.c-flame { animation: flicker .5s ease-in-out infinite alternate; transform-box: fill-box; transform-origin: 50% 100%; }

@keyframes bob { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-8px); } }
@keyframes blink { 0%, 94%, 100% { transform: scaleY(1); } 97% { transform: scaleY(.1); } }
@keyframes flap { 0%, 100% { transform: rotate(0deg); } 50% { transform: rotate(-5deg); } }
@keyframes swish { 0%, 100% { transform: rotate(0deg); } 50% { transform: rotate(-8deg); } }
@keyframes twinkle { 0%, 100% { opacity: .2; transform: scale(.6); } 50% { opacity: 1; transform: scale(1.1); } }
@keyframes wave { 0%, 100% { transform: skewY(0deg) scaleX(1); } 50% { transform: skewY(8deg) scaleX(.85); } }
@keyframes burst { 0% { transform: scale(.1); opacity: 0; } 15% { opacity: 1; } 60% { transform: scale(1); opacity: 1; } 100% { transform: scale(1.15); opacity: 0; } }
@keyframes water { to { stroke-dashoffset: -18; } }
@keyframes floatUp { 0% { transform: translateY(4px); opacity: 0; } 30% { opacity: 1; } 100% { transform: translateY(-14px); opacity: 0; } }
@keyframes batFlap { from { transform: scaleY(1); } to { transform: scaleY(.55) translateY(-2px); } }
@keyframes snowFall { from { transform: translate(0, 0); } to { transform: translate(-14px, 320px); } }
@keyframes sway { 0%, 100% { transform: rotate(-5deg); } 50% { transform: rotate(5deg); } }
@keyframes rock { 0%, 100% { transform: rotate(-6deg); } 50% { transform: rotate(6deg); } }
@keyframes flicker { from { transform: scale(1, 1); } to { transform: scale(.9, 1.12); } }

@media (prefers-reduced-motion: reduce) {
  .unicorn-svg *, .castle-svg * { animation: none !important; }
}

/* Drifting clouds and twinkles behind the page (same look as the games' sky) */
.sky { position: fixed; inset: 0; pointer-events: none; overflow: hidden; z-index: -1; }
.cloud {
  position: absolute;
  width: 160px;
  height: 50px;
  background: rgba(255, 255, 255, 0.85);
  border-radius: 50px;
  filter: blur(1px);
  animation: drift linear infinite;
}
.cloud::before, .cloud::after { content: ''; position: absolute; background: inherit; border-radius: 50%; }
.cloud::before { width: 70px; height: 70px; left: 22px; top: -34px; }
.cloud::after { width: 54px; height: 54px; left: 80px; top: -24px; }
.c1 { top: 8%; animation-duration: 60s; animation-delay: -10s; }
.c2 { top: 30%; transform: scale(.7); animation-duration: 80s; animation-delay: -40s; opacity: .7; }
.c3 { top: 62%; transform: scale(.9); animation-duration: 70s; animation-delay: -25s; opacity: .8; }
.c4 { top: 85%; transform: scale(.6); animation-duration: 90s; animation-delay: -60s; opacity: .6; }
@keyframes drift { from { left: -220px; } to { left: 110%; } }
.twinkle-bg { position: absolute; color: #fff; font-size: 22px; animation: twinkle 2.6s ease-in-out infinite; text-shadow: 0 0 8px #fff; }
@media (prefers-reduced-motion: reduce) { .cloud, .twinkle-bg { animation: none; } }

/* Butterflies and the magic glow (closet extras) */
.u-flutter { animation: flutter .5s ease-in-out infinite alternate; transform-box: fill-box; transform-origin: center; }
@keyframes flutter { from { transform: scaleX(1); } to { transform: scaleX(.55); } }
.u-glow { animation: glowPulse 3s ease-in-out infinite; }
@keyframes glowPulse { 0%, 100% { opacity: .75; } 50% { opacity: 1; } }