body {
      margin: 0;
      padding: 0;
      
      height: 100vh;
      width: 100vw;
    }
#unity-container { position: fixed; width: 100%; height: 100%; background-image: url('Loading.png'); /* Replace with your image path */
      background-size: cover;
      background-position: center;
      background-repeat: no-repeat; }
#unity-canvas { width: 100%; height: 100%; }
#unity-loading-bar { position: absolute; left: 50%; bottom: 5%; transform: translate(-50%, -50%); display: none }
/* #unity-logo { width: 556px; height: 289px; background: url('main_logo.png') no-repeat center } */
#unity-progress-bar-empty { margin-left: auto; margin-right: auto; width: 480px; height: 24px; margin-top: 10px; background: url('loading_bg.png') no-repeat center }
#unity-progress-bar-full { width: 0%; height: 24px; margin-left: 4px; margin-top: 10px; background: url('loading_bar.png') no-repeat left }
#unity-warning { position: absolute; left: 50%; top: 5%; transform: translate(-50%); background: white; padding: 10px; display: none }
 
 /* --- Splash Logo Styles --- */
    #splash-screen {
      position: fixed;
      inset: 0;
      background: #000; /* or any background color */
      display: flex;
      justify-content: center;
      align-items: center;
      z-index: 9999;
      opacity: 1;
      transition: opacity 0.8s ease;
    }

    #splash-screen img {
      width: 300px;
      max-width: 60vw;
      opacity: 0;
      transform: scale(0.9);
      animation: fadeInLogo 1.2s forwards;
    }

    @keyframes fadeInLogo {
      to {
        opacity: 1;
        transform: scale(1);
      }
    }

    #splash-screen.hide {
      opacity: 0;
      pointer-events: none;
    }

    Hide Unity loading screen initially
    #unity-container {
       background: #000; 
    }

#unity-loading-text {
      font-size: 20px;
      color: white;
      margin-bottom: 10px;
      text-align: center;
    }