/* ============================================================
   SubRuta — Capa de animaciones de temporada
   Sistema maestro: CALENDARIO-ANIMACIONES-TEMPORADA.md
   Criaturas 24–44 px · una a la vez · borde inferior o margen
   superior · pointer-events:none · reduced-motion = acento fijo
   ============================================================ */
.sr-season {
  position: fixed;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
  z-index: 55;
}
.sr-season .sr-c {
  position: absolute;
  will-change: transform;
  pointer-events: none;
}
.sr-season .sr-c svg { display: block; width: 100%; height: auto; }
.sr-season .sr-static {
  position: absolute;
  right: 10px;
  bottom: 10px;
  width: 28px;
  opacity: .85;
}

/* Cruce horizontal completo (entra por un lado, sale por el otro) */
@keyframes sr-x {
  from { transform: translateX(-90px); }
  to   { transform: translateX(calc(100vw + 90px)); }
}
/* Caída a la deriva por un borde */
@keyframes sr-fall {
  0%   { transform: translate(0, -60px) rotate(0deg); }
  25%  { transform: translate(14px, 26vh) rotate(70deg); }
  50%  { transform: translate(-10px, 52vh) rotate(150deg); }
  75%  { transform: translate(12px, 78vh) rotate(240deg); }
  100% { transform: translate(0, 108vh) rotate(320deg); }
}
/* Flotación hacia arriba por un borde */
@keyframes sr-rise {
  from { transform: translate(0, 60px); }
  to   { transform: translate(12px, calc(-100vh - 130px)); }
}
/* Saltos del conejito / pavoneo del pavo / meneo del ciempiés */
@keyframes sr-hop {
  0%, 100% { transform: translateY(0); }
  30%      { transform: translateY(-13px); }
  55%      { transform: translateY(0); }
  75%      { transform: translateY(-9px); }
}
@keyframes sr-bob {
  0%, 100% { transform: translateY(0) rotate(-2deg); }
  50%      { transform: translateY(-4px) rotate(2deg); }
}
/* Araña: el hilo crece, se balancea y se recoge */
@keyframes sr-thread {
  0%   { height: 14px; }
  30%  { height: 128px; }
  68%  { height: 128px; }
  100% { height: 14px; }
}
@keyframes sr-sway {
  0%, 100% { transform: rotate(3.5deg); }
  50%      { transform: rotate(-3.5deg); }
}
.sr-season .sr-thread {
  width: 2px;
  margin: 0 auto;
  background: linear-gradient(rgba(20,16,12,.18), rgba(20,16,12,.5));
}
/* Murciélago: aleteo */
.sr-season .sr-bat .wing-l,
.sr-season .sr-bat .wing-r { transform-box: fill-box; }
.sr-season .sr-bat .wing-l { transform-origin: 100% 50%; animation: sr-flap-l .28s ease-in-out infinite alternate; }
.sr-season .sr-bat .wing-r { transform-origin: 0% 50%;   animation: sr-flap-r .28s ease-in-out infinite alternate; }
@keyframes sr-flap-l { from { transform: rotate(0deg); }    to { transform: rotate(-26deg); } }
@keyframes sr-flap-r { from { transform: rotate(0deg); }    to { transform: rotate(26deg); } }
/* Destellos */
@keyframes sr-twinkle {
  0%, 100% { transform: scale(.4) rotate(0deg);   opacity: .25; }
  50%      { transform: scale(1.15) rotate(20deg); opacity: 1; }
}
/* Ráfaga (hojas del pavo / destellos de regalo del trineo) */
@keyframes sr-burst {
  0%   { transform: translate(0, 0) scale(.5); opacity: 0; }
  25%  { opacity: 1; }
  100% { transform: translate(var(--bx, 10px), var(--by, -14px)) scale(1); opacity: 0; }
}
.sr-season .sr-burst-bit {
  position: absolute;
  animation-name: sr-burst;
  animation-timing-function: ease-out;
  animation-iteration-count: infinite;
}