html, body {
      margin: 0;
      padding: 0;
      width: 100%;
      height: 100%;
      overflow: hidden;
      background-color: #000; /* Fundo preto padrão */
      background-size: cover;
      background-position: center center;
      background-repeat: no-repeat;
    }

    /* --- Lógica de layout inspirada no seu CSS original --- */
    
    /* Container principal que ocupa a tela toda e centraliza o conteúdo */
    #media-container {
      position: absolute;
      top: 0; left: 0;
      width: 100vw;
      height: 100vh;
      display: flex;
      align-items: center;
      justify-content: center;
    }

    /* Estilo para as mídias (serão mostradas/escondidas pelo script.js) */
    #slideshow-image, #slideshow-video {
      max-width: 95vw;
      max-height: 95vh;
      object-fit: contain;
      border-radius: 12px;
      box-shadow: 0 10px 25px rgba(0,0,0,0.5);
    }

    /* Estilo para a mensagem inicial com QR Code */
    #initial-message-container {
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      text-align: center;
      color: white;
      max-width: 600px;
      padding: 2rem;
    }
    
    #qr-code-image {
      border-radius: 8px;
      box-shadow: 0 0 20px rgba(255, 255, 255, 0.2);
      margin-bottom: 20px;
      width: 250px;
      height: 250px;
    }

    #instruction-text {
      font-size: 1.5rem;
      line-height: 2rem;
      font-weight: 500;
    }

    /* Logo posicionado no canto */
    #logo {
      position: absolute;
      bottom: 20px;
      right: 20px;
      z-index: 1000;
      width: 120px;
      opacity: 0.7;
    }

    /* Modal (sem alterações) */
    .modal-overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.7); display: none; align-items: center; justify-content: center; z-index: 2000; }
    .modal-overlay.active { display: flex; }
    .modal-content { background-color: white; padding: 30px; border-radius: 12px; text-align: center; box-shadow: 0 5px 15px rgba(0,0,0,0.3); max-width: 400px; }
    .modal-title { font-size: 1.5rem; font-weight: 600; color: #333; margin-bottom: 15px; }
    .modal-message { font-size: 1rem; color: #555; margin-bottom: 25px; }
    .modal-button { background-color: #4A90E2; color: white; padding: 10px 20px; border: none; border-radius: 8px; font-size: 1rem; cursor: pointer; }