/* ========================================
   Kadoloko — Styles des animations jeu quotidien
   ======================================== */

/* Grattage : animation du multiplicateur révélé */
@keyframes scratchReveal {
    0%   { transform: scale(1); }
    20%  { transform: scale(1.18); }
    40%  { transform: scale(0.95); }
    60%  { transform: scale(1.1); }
    80%  { transform: scale(0.98); }
    100% { transform: scale(1); }
}
.scratch-pulse {
    animation: scratchReveal 0.6s ease-out;
}

/* Boîtes mystère */
@keyframes vibrer {
    0%,100% { transform: translateX(0) rotate(0deg); }
    15%     { transform: translateX(-5px) rotate(-1.5deg); }
    30%     { transform: translateX(5px) rotate(1.5deg); }
    45%     { transform: translateX(-4px); }
    60%     { transform: translateX(4px); }
    75%     { transform: translateX(-2px); }
    90%     { transform: translateX(2px); }
}
@keyframes ouverture {
    from { transform: scale(0.7) rotate(-5deg); opacity: 0.5; }
    to   { transform: scale(1) rotate(0deg); opacity: 1; }
}
@keyframes boiteGagne {
    0%   { transform: scale(1); }
    25%  { transform: scale(1.25) rotate(3deg); }
    50%  { transform: scale(1.18) rotate(-2deg); }
    75%  { transform: scale(1.22) rotate(1deg); }
    100% { transform: scale(1.15); }
}
@keyframes boitePerd {
    0%   { transform: scale(1); }
    20%  { transform: scale(0.92) rotate(-3deg); }
    40%  { transform: scale(0.96) rotate(2deg); }
    60%  { transform: scale(0.93); }
    100% { transform: scale(0.95); }
}

/* Dé 3D */
@keyframes deWrapGagne {
    0%   { transform: scale(1); }
    30%  { transform: scale(1.28); }
    55%  { transform: scale(1.16); }
    75%  { transform: scale(1.22); }
    100% { transform: scale(1.18); }
}
@keyframes deWrapPerd {
    0%   { transform: scale(1); }
    20%  { transform: scale(0.88); }
    40%  { transform: scale(0.94); }
    60%  { transform: scale(0.9); }
    100% { transform: scale(0.92); }
}

/* Intro boîtes : flash séquentiel */
@keyframes boxIntroFlash {
    0%   { transform: scale(1); box-shadow: 0 4px 14px rgba(0,184,122,0.25); }
    30%  { transform: scale(1.18); box-shadow: 0 8px 28px rgba(245,184,0,0.55); }
    60%  { transform: scale(1.06); box-shadow: 0 6px 20px rgba(245,184,0,0.35); }
    100% { transform: scale(1); box-shadow: 0 4px 14px rgba(0,184,122,0.25); }
}

/* Boîte gagnante : légèrement plus grande (le fond est géré par JS selon gain/perte) */
.box-winner {
    transform: scale(1.12) !important;
    box-shadow: 0 6px 22px rgba(245,184,0,0.45) !important;
}
.box-loser {
    opacity: 0.5;
    transform: scale(0.92);
}

/* Grid boîtes 3×2 */
.boxes-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
    max-width: 250px;
    margin: 0 auto 18px;
}

/* SVG cadeau dans la boîte */
.gift-svg {
    transition: opacity 0.25s;
}
.gift-svg.hidden {
    opacity: 0;
}

/* Label gain dans la boîte ouverte */
.box-reward-label {
    font-family: Sora, sans-serif;
    font-weight: 800;
    font-size: 0.8rem;
    color: white;
    text-shadow: 0 1px 6px rgba(0,0,0,0.15);
    display: none;
    line-height: 1.2;
    text-align: center;
}
.box-reward-label.visible {
    display: block;
}
