@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@800&family=Fredoka+One&display=swap');

body {
    margin: 0; background: #05000a; color: white;
    font-family: 'Poppins', sans-serif; text-align: center; overflow: hidden;
}

.tela-oculta { display: none !important; }
.tela-ativa { display: block !important; }

#tela-inicial {
    height: 100vh; background: #05000a url('1.jpg') no-repeat center bottom;
    background-size: cover; position: relative;
}

#tela-show.tela-ativa {
    display: flex !important; flex-direction: column; align-items: center; padding: 10px; height: 100vh;
}

/* AGENTE MASCOTE */
.mascote-neon {
    width: 140px; height: 110px; background: #1a0033;
    border: 5px solid #b300ff; border-radius: 40px;
    box-shadow: 0 0 30px #b300ff, inset 0 0 20px #b300ff;
    display: flex; justify-content: center; align-items: center;
}

.olho { width: 18px; height: 10px; background: #00ffff; border-radius: 10px; }
.boca-neon { width: 30px; height: 6px; background: #00ffff; border-radius: 10px; transition: 0.2s; }

/* ESTADOS DO AGENTE */
.falando .boca-neon { animation: bocaFala 0.2s infinite alternate; }
.pensando .olho { height: 4px; background: yellow; box-shadow: 0 0 10px yellow; }

@keyframes bocaFala { from { height: 6px; } to { height: 18px; width: 20px; border-radius: 50%; } }
.anim-flutuar { animation: flutuar 2.5s infinite ease-in-out; }
@keyframes flutuar { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-12px); } }

/* ELEMENTOS DO SHOW */
#playerYT { width: 95%; max-width: 800px; aspect-ratio: 16/9; border: 3px solid #00ffcc; border-radius: 20px; }
.vergonha-bar { width: 90%; max-width: 800px; height: 25px; background: #222; border-radius: 15px; border: 2px solid white; margin: 15px 0; overflow: hidden; }
.vergonha-fill { height: 100%; width: 0%; background: linear-gradient(90deg, #00ff00, #ff0000); transition: width 0.8s; }
.jurado-painel-central { display: flex; align-items: center; gap: 20px; background: rgba(0,0,0,0.85); padding: 20px; border-radius: 25px; border: 2px solid #ff00ff; }
.balao-fala-novo, #balao-mini { background: white; color: black; padding: 12px 24px; border-radius: 20px; font-weight: bold; font-size: 1.1rem; }