#plansza { /* ← CAŁA scena w środku #scaled */
  width:  calc(var(--design-w) * 1px);
  height: calc(var(--design-h) * 1px);
  background: radial-gradient(circle at center, #002b5c, #001830);
  font-family: Arial, sans-serif;
  color: black;
  overflow: hidden;
  position: relative; /* baza do absolutów */
}

/* warstwy tła muszą być W SCENIE, nie na body */
.bg, .bg2, .bg3{
  animation: slide 16s ease-in-out infinite alternate;
  background-image: linear-gradient(60deg, #002b5c 50%, #001830 50%);
  position: absolute;  /* było fixed – musi być absolute */
  top: 0; bottom: 0; left: -50%; right: -50%;
  opacity: .5;
  z-index: -1;
}
.bg2 { animation-direction: alternate-reverse; animation-duration: 6s; }
.bg3 { animation-duration: 9s; }

.content{
  /* jeżeli to ekran startowy – nadal absolut w #plansza */
  position: absolute;
  left:50%; top:50%;
  transform: translate(-50%,-50%);
  background-color: rgba(255,255,255,.8);
  border-radius:.25em;
  box-shadow:0 0 .25em rgba(0,0,0,.25);
  box-sizing: border-box;
  padding: 10vmin;
}

h1 {
  font-family:monospace;
}

@keyframes slide {
  0% {
    transform:translateX(-25%);
  }
  100% {
    transform:translateX(25%);
  }
}