body{
    margin:0;
    padding:0;
    background: radial-gradient(circle at center, #1a0000 0%, #000 80%);
    font-family: Arial, Helvetica, sans-serif;
    color:white;
    text-align:center;
    overflow-x:hidden;
}

.game-container{
    padding:20px;
}

/* ===== PROGRESS BAR ===== */

.progress-bar{
    position:relative;
    width:90%;
    margin:50px auto;
    height:8px;
    background:#330000;
    border-radius:20px;
    overflow:visible;
}

/* RED SHINING TRAIL */
.progress-fill{
    position:absolute;
    height:100%;
    width:0%;
    background:linear-gradient(90deg,#ff0000,#ff4d4d,#ff0000);
    box-shadow:0 0 12px #ff0000, 0 0 25px #ff0000;
    border-radius:20px;
    transition:0.5s ease;
}

/* PLAYER IMAGE */
.player{
    position:absolute;
    top:-55px;
    left:0%;
    width:85px;
    height:85px;
    border-radius:50%;
    object-fit:cover;
    object-position: 50% 0%;   /* 🔥 FACE FIX */
    border:3px solid #ff0000;
    box-shadow:0 0 15px #ff0000, 0 0 30px #ff0000;
    transition:0.5s ease;
}

/* FINISH LINE */
.finish-line{
    position:absolute;
    right:0;
    top:-30px;
    width:6px;
    height:65px;
    background:white;
    box-shadow:0 0 12px white;
}

/* TIMER */
.timer{
    margin-top:40px;
    font-size:30px;
    font-weight:bold;
    color:#ff3333;
}

/* QUESTION */
.question-box{
    margin-top:30px;
}

.answer-btn{
    display:block;
    width:85%;
    margin:14px auto;
    padding:15px;
    background:#660000;
    border:none;
    color:white;
    font-size:17px;
    font-weight:bold;
    border-radius:30px;
    cursor:pointer;
    transition:0.3s;
}

.answer-btn:hover{
    background:#ff0000;
}