/* GAP WP Sablon – animált háttér (Canvas-alapú). */
/* 1. Égbolt konténer, canvas és sodródás */
#sky-drift {
  position: fixed;
  inset: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  animation: skyDrift 900s linear infinite;
  --drift-x: 60px;
  --drift-y: -104px;
}
@keyframes skyDrift {
  50% {
    transform: translate(var(--drift-x), var(--drift-y));
  }
}
#sky-canvas {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}
/* Egyik háttér-elem sem foghat el kattintást */
#sky-drift,
#sky-canvas,
.cloud-horizon {
  pointer-events: none;
}
/* 2. Felhő-horizont */
.cloud-horizon {
  position: fixed;
  left: 0;
  bottom: 0;
  width: 100vw;
  height: auto;
  max-height: 100vh;
  opacity: 0.45;
  z-index: 5;
  filter: blur(4px);
}
/* 3. Akadálymentesség */
/* Csökkentett mozgás: a CSS-oldali animációk leállnak. A canvas-animációt a hatter.js állítja le ugyanerre a beállításra, és egy statikus csillagképet rajzol. */
@media (prefers-reduced-motion: reduce) {
  #sky-drift {
    animation: none;
  }
}