body {
    font-family: Arial, sans-serif;
    background: #1F1F1F;
    color: #FFF;
}

/* Grille Euromillions */
.eu-grid {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px;
    margin: 5px 0;
}
.eu-number {
    width: 50px; height: 50px;
    display: flex; justify-content: center; align-items: center;
    background: #1F1F1F; color: #FFF; border-radius: 8px; cursor: pointer;
    font-weight: bold; transition: transform 0.2s;
}
.eu-number.selected { background: #1E90FF; transform: scale(1.1); }

.eu-star {
    width: 50px; height: 50px;
    display: flex;
    flex-direction: column;   /* étoile au-dessus, numéro en dessous */
    justify-content: center;
    align-items: center;
    cursor: pointer;
    user-select: none;
    transition: transform 0.2s, color 0.2s;
}

.eu-star .star-symbol {
    font-size: 2em;
    color: #1E90FF;  /* bleu pour vide */
}

.eu-star.selected .star-symbol {
    color: gold;     /* or pour sélection */
}

.eu-star .star-number {
    font-size: 0.8em;
    color: #FFF;
}

.eu-number.drawn {
    background-color: #FFD700; /* doré pour tiré */
    color: #000;
    border-radius: 50%;
    transform: scale(1.2);
    transition: all 0.3s;
}

.eu-star.drawn .star-symbol {
    color: gold;
    transform: scale(1.2);
}

/* Numéro tiré mais non choisi */
.eu-number.drawn {
    background: #FFD700; /* doré */
    color: #000;
}

/* Numéro tiré ET choisi */
.eu-number.match {
    background: #32CD32; /* vert */
    color: #000;
    box-shadow: 0 0 10px #32CD32;
    transform: scale(1.25);
}

/* Étoile tirée */
.eu-star.drawn .star-symbol {
    color: gold;
}

/* Étoile tirée ET choisie */
.eu-star.match .star-symbol {
    color: #32CD32;
    text-shadow: 0 0 10px #32CD32;
}

/* Messages */
.cluedo-result-ok, .cluedo-result-no { margin:10px auto; padding:10px; max-width:600px; text-align:center; font-weight:bold; border-radius:10px;display: none;}
.cluedo-result-ok { border: dashed lightgreen; color:lightgreen; }
.cluedo-result-no { border: dashed lightcoral; color:lightcoral; }

/* Overlay Jackpot */
#euromillions-win-overlay {
    position: fixed; top:0; left:0; width:100%; height:100%;
    background: rgba(0,0,0,0.85); display:flex; justify-content:center; align-items:center;
    z-index:9999; opacity:0; pointer-events:none; transition: opacity 0.5s;
}
#euromillions-win-overlay.show { opacity:1; pointer-events:all; }
#euromillions-win-overlay h1 { font-size:5rem; color:gold; text-shadow:0 0 20px #fff,0 0 40px gold; animation: scalePulse 1s infinite alternate; }
@keyframes scalePulse { 0%{transform:scale(1);}100%{transform:scale(1.3);} }

.my-million-container {
    text-align: center;
    margin-top: 10px;
}

.second-chance {
    font-size: 14px;
    color: #ff9800;
    font-weight: bold;
    margin: 20px 0 0 0;
}

.second-chance span {
    color: #ffffff;
}

.my-million-number {
    margin: 8px 0 15px 0;
    font-weight: 700;
    color: #ffd700;
    text-align: center;
    font-size: 18px;
    animation: glow 1.5s infinite alternate;
}

@keyframes glow {
    0% { text-shadow: 0 0 5px gold; }
    100% { text-shadow: 0 0 15px gold; }
}

/* Overlay My Million */
#my-million-overlay {
    position: fixed;
    top:0;
    left:0;
    width:100%;
    height:100%;
    background: rgba(0,0,0,0.85);
    display:flex;
    justify-content:center;
    align-items:center;
    z-index:9999;
    opacity:0;
    pointer-events:none;
    transition: opacity 0.5s;
}
#my-million-overlay.show {
    opacity:1;
    pointer-events:all;
}
#my-million-overlay h1 {
    font-size:4rem;
    color:#ffd700;
    text-shadow:0 0 20px #fff,0 0 40px gold;
    animation: scalePulse 1s infinite alternate;
}

/* Container principal : cartes côte à côte */
.eu-ranking {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    justify-content: center;
}

/* Chaque type de classement */
.eu-ranking-level {
    flex: 1 1 250px;
    background: #1F1F1F;
    color: #FFF;
    border-radius: 12px;
    padding: 15px;
    box-shadow: 0 0 10px rgba(0,0,0,0.5);
}

/* Titre */
.label-titre-span {
    display: block;
    font-weight: bold;
    font-size: 1.2em;
    margin-bottom: 10px;
    text-align: center;
    color: #1E90FF;
}

.eu-ranking {
    display: inline-flex;
    gap: 15px;
}

/* Chaque partie */
.eu-ranking-entry {
    background: #1F1F1F;
    padding: 12px 15px;
    border-radius: 12px;
    box-shadow: 0 0 8px rgba(0,0,0,0.5);
    display: flex;
    flex-direction: column;
    gap: 5px;
    transition: transform 0.2s;
}

.eu-ranking-entry:hover {
    transform: scale(1.02);
}

.eu-highlight {
    border: 2px solid #32CD32;
}

.eu-rank {
    font-weight: bold;
    color: #FFD700;
}

.eu-player {
    font-size: 1em;
    font-weight: bold;
    color: #1E90FF;
}

.eu-values {
    font-weight: bold;
    font-size: 0.95em;
    color: #FFD700;
}

.eu-numbers {
    font-size: 0.85em;
    color: #AAA;
}

@media(max-width:600px){
#euromillions-win-overlay h1, #my-million-overlay h1 {
font-size:2.4rem;
}	
}


