body {

      margin: 0;

      background-color: #0d1117;

      font-family: sans-serif;

      color: #eee;

      overflow: hidden;

      overflow-y: auto; /* Solo aparece cuando el contenido sobrepasa */

    }



    /* Loader contenedor */

    .periodic-loader {

      position: fixed;

      top: 0;

      left: 0;

      width: 100vw;

      height: 100vh;

      background: #0d1117;

      display: flex;

      justify-content: center;

      align-items: center;

      flex-direction: column;

      z-index: 9999;

      transition: opacity 0.5s ease, visibility 0.5s ease;

    }



    .periodic-loader.hidden {

      opacity: 0;

      visibility: hidden;

    }



    .element-wrapper {

      display: flex;

      flex-wrap: wrap;

      gap: 12px;

      justify-content: center;

      align-items: center;

    }



    .element {

      width: 50px;

      height: 50px;

      background: #161b22;

      color: #00ffff;

      font-weight: bold;

      font-size: 1.2rem;

      display: flex;

      justify-content: center;

      align-items: center;

      border: 2px solid #00ffff55;

      border-radius: 10px;

      animation: float 1.8s infinite ease-in-out;

      box-shadow: 0 0 10px #00ffff33;

    }



    .element:nth-child(1) { animation-delay: 0s; }

    .element:nth-child(2) { animation-delay: 0.2s; }

    .element:nth-child(3) { animation-delay: 0.4s; }

    .element:nth-child(4) { animation-delay: 0.6s; }

    .element:nth-child(5) { animation-delay: 0.8s; }

    .element:nth-child(6) { animation-delay: 1s; }



    .loader-text {

      margin-top: 20px;

      font-size: 1rem;

      color: #ccc;

      font-family: monospace;

      animation: blink 1.2s infinite;

    }



    @keyframes float {

      0%, 100% {

        transform: translateY(0px);

      }

      50% {

        transform: translateY(-12px);

      }

    }



    @keyframes blink {

      0%, 100% {

        opacity: 1;

      }

      50% {

        opacity: 0.4;

      }

    }



    /* Contenido de prueba */

    .main-content {

      display: none;

      padding: 40px;

    }



    .main-content.visible {

      display: block;

    }