/* Ruch w scenach. Wszystko to transform/opacity, bez przeliczania układu. */
.scene { display: block; }
.scene .a-cloud { animation: cross linear infinite; }
.scene .a-cross { animation: cross linear infinite; }
.scene .a-drift { animation: drift 16s linear infinite; }
.scene .a-rays { transform-origin: 760px 200px; animation: spin 140s linear infinite; }
.scene .a-rise { animation: rise 1.8s cubic-bezier(.2,.7,.2,1) both; }
.scene .a-sway { transform-box: fill-box; transform-origin: 50% 100%; animation: sway 7s ease-in-out infinite alternate; }
.scene .a-sway.a-slow { animation-duration: 10s; }
.scene .a-flap { transform-box: fill-box; transform-origin: 50% 60%; animation: flap .55s ease-in-out infinite alternate; }
.scene .a-flutter { transform-box: fill-box; transform-origin: 50% 50%; animation: flutter .25s ease-in-out infinite alternate; }
.scene .a-wander { animation: wander 6s ease-in-out infinite alternate; }
.scene .a-glint { animation: glint 3s ease-in-out infinite; }
.scene .a-twinkle { animation: glint 2.6s ease-in-out infinite; }
.scene .a-blink { animation: blink 1.4s steps(1) infinite; }
.scene .a-flicker { transform-box: fill-box; transform-origin: 50% 100%; animation: flicker .18s ease-in-out infinite alternate; }
.scene .a-bob { animation: bob 5s ease-in-out infinite; }
.scene .a-float { animation: float 12s ease-in-out infinite; }
.scene .a-wash { animation: wash 6s ease-in-out infinite; }
.scene .a-mist { animation: mist 40s ease-in-out infinite alternate; }
.scene .a-smoke { transform-box: fill-box; transform-origin: 50% 50%; animation: smoke 4.8s ease-out infinite; }
.scene .a-fall { animation: fall 12s linear infinite; }
.scene .a-fall.a-twinkle { animation: fall 14s linear infinite, glint 2.6s ease-in-out infinite; }
.scene .a-fall-water { animation: water 1s linear infinite; }
.scene .a-pulse { animation: pulse 7s ease-in-out infinite; }
.scene .a-peck { transform-box: fill-box; transform-origin: 50% 100%; animation: peck 5s ease-in-out infinite; }
.scene .a-drape { animation: drape 6s ease-in-out infinite alternate; }
.scene .a-bubble { animation: bubble 2s ease-in infinite; }
.scene .a-shimmer { animation: shimmer 8s ease-in-out infinite; }
.scene .a-spin { animation: spin 60s linear infinite; }
.scene .a-cable { offset-rotate: 0deg; animation: ride 38s linear infinite; }
.scene .a-shoot { animation: shoot 12s ease-out infinite; opacity: 0; }
.scene .a-bokeh { animation: bokeh 14s ease-in-out infinite; opacity: 0; }
.scene .a-sweep { animation: sweep 9s ease-in-out infinite alternate; }
.scene .a-lantern { animation: lantern 30s linear infinite; }

@keyframes cross { from { transform: translateX(-1500px); } to { transform: translateX(1500px); } }
@keyframes drift { to { transform: translateX(-600px); } }
@keyframes spin { to { transform: rotate(360deg); } }
@keyframes rise { from { transform: translateY(80px); opacity: 0; } }
@keyframes sway { from { transform: rotate(-1.4deg); } to { transform: rotate(1.4deg); } }
@keyframes flap { to { transform: scaleY(-.35); } }
@keyframes flutter { to { transform: scaleX(.2); } }
@keyframes wander { 0% { transform: translate(0, 0); } 50% { transform: translate(12px, -26px); } 100% { transform: translate(-8px, 10px); } }
@keyframes glint { 0%, 100% { opacity: .15; } 50% { opacity: 1; } }
@keyframes blink { 0%, 60% { opacity: 1; } 61%, 100% { opacity: .1; } }
@keyframes flicker { from { transform: scale(1, 1); } to { transform: scale(.88, 1.12); } }
@keyframes bob { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(4px); } }
@keyframes float { 0%, 100% { transform: translate(0, 0); } 50% { transform: translate(30px, -18px); } }
@keyframes wash { 0%, 100% { transform: translateY(0); opacity: .9; } 50% { transform: translateY(5px); opacity: .45; } }
@keyframes mist { from { transform: translateX(-120px); } to { transform: translateX(120px); } }
@keyframes smoke { from { transform: translate(0, 0) scale(.6); opacity: .8; } to { transform: translate(18px, -60px) scale(2.2); opacity: 0; } }
@keyframes fall { from { transform: translate(0, -80px); } to { transform: translate(-90px, 460px); } }
@keyframes water { from { transform: translateY(0); } to { transform: translateY(110px); } }
@keyframes pulse { 0%, 100% { opacity: .4; } 50% { opacity: 1; } }
@keyframes peck { 0%, 80%, 100% { transform: rotate(0); } 86% { transform: rotate(8deg); } 92% { transform: rotate(-2deg); } }
@keyframes drape { from { transform: skewX(-2deg); } to { transform: skewX(2.5deg); } }
@keyframes bubble { from { transform: translateY(0); opacity: 0; } 20% { opacity: 1; } to { transform: translateY(-16px); opacity: 0; } }
@keyframes shimmer { 0%, 100% { opacity: .14; } 50% { opacity: .3; } }
@keyframes ride { from { offset-distance: 0%; } to { offset-distance: 100%; } }
@keyframes shoot { 0% { transform: translate(0, 0); opacity: 0; } 3% { opacity: 1; } 14% { transform: translate(-260px, 140px); opacity: 0; } 100% { transform: translate(-260px, 140px); opacity: 0; } }
@keyframes bokeh { 0%, 100% { transform: translateY(0); opacity: 0; } 30%, 70% { opacity: .5; } 50% { transform: translateY(-40px); } }
@keyframes sweep { from { transform: rotate(-14deg); } to { transform: rotate(14deg); } }
@keyframes lantern { 0% { transform: translate(0, 40px); opacity: 0; } 8% { opacity: 1; } 92% { opacity: 1; } 100% { transform: translate(60px, -380px); opacity: 0; } }

/* Ziarno na scenie: odbiera „płaskość” wektorów. */
.grainy { position: relative; }
.grainy::after { content: ''; position: absolute; inset: 0; background-image: var(--grain, none); pointer-events: none; mix-blend-mode: soft-light; opacity: .45; }

/* Scena poza ekranem albo w miniaturze: bez ruchu. */
.paused .scene *, .scene.paused * { animation-play-state: paused !important; }
.paused .scene .a-rise { animation: none !important; }

@media (prefers-reduced-motion: reduce) {
  .scene * { animation: none !important; }
}
