/**
 * Fusée cold-start (CSS pur) — partagée entre login overlay et offline-loading.html.
 * Ne pas réintroduire l'emoji 🚀 : rendu OS incohérent entre plateformes.
 */

/* --- rocket --- */
.rocket-stage {
    position: relative;
    width: 120px;
    height: 200px;
    margin: 0 auto;
    animation: csr-rocket-hover 3.5s ease-in-out infinite;
}
.rocket-body {
    position: absolute;
    left: 50%;
    top: 0;
    transform: translateX(-50%);
    width: 48px;
    height: 120px;
    background: linear-gradient(180deg, #e74c3c 0%, #c0392b 30%, #bdc3c7 30%, #ecf0f1 70%, #bdc3c7 100%);
    border-radius: 24px 24px 8px 8px;
    box-shadow: 0 0 30px rgba(231, 76, 60, 0.25);
}
.rocket-nose {
    position: absolute;
    left: 50%;
    top: -20px;
    transform: translateX(-50%);
    width: 0;
    height: 0;
    border-left: 24px solid transparent;
    border-right: 24px solid transparent;
    border-bottom: 28px solid #e74c3c;
    filter: drop-shadow(0 -4px 8px rgba(231, 76, 60, 0.4));
}
.rocket-window {
    position: absolute;
    left: 50%;
    top: 38px;
    transform: translateX(-50%);
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: radial-gradient(circle at 35% 35%, #85d5ff, #2980b9);
    border: 3px solid #7f8c8d;
    box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
}
.rocket-fin-left,
.rocket-fin-right {
    position: absolute;
    bottom: -4px;
    width: 0;
    height: 0;
    border-top: 30px solid #c0392b;
    border-bottom: 0;
}
.rocket-fin-left {
    left: -8px;
    border-left: 16px solid transparent;
    border-right: 16px solid #c0392b;
    transform: rotate(-5deg);
}
.rocket-fin-right {
    right: -8px;
    border-right: 16px solid transparent;
    border-left: 16px solid #c0392b;
    transform: rotate(5deg);
}

/* --- exhaust flames --- */
.exhaust-wrap {
    position: absolute;
    left: 50%;
    bottom: -56px;
    transform: translateX(-50%);
    width: 54px;
    height: 72px;
    pointer-events: none;
}
.flame-blob {
    position: absolute;
    inset: 0;
    background: radial-gradient(
        ellipse 55% 100% at 50% 0%,
        #fbbf24 0%,
        #f97316 28%,
        #ef4444 58%,
        rgba(185, 28, 28, 0) 100%
    );
    filter: blur(5px);
    border-radius: 40% 40% 50% 50%;
    animation: csr-flame-osc 0.14s ease-in-out infinite alternate;
    transform-origin: 50% 0%;
}
.flame-hot {
    position: absolute;
    top: 0;
    left: calc(50% - 14px);
    width: 28px;
    height: 44px;
    background: radial-gradient(
        ellipse 60% 100% at 50% 0%,
        #fff9c4 0%,
        #fde68a 20%,
        #fbbf24 42%,
        rgba(251, 191, 36, 0) 100%
    );
    filter: blur(3px);
    border-radius: 40% 40% 50% 50%;
    animation: csr-flame-hot-osc 0.1s ease-in-out infinite alternate-reverse;
    transform-origin: 50% 0%;
}

/* --- smoke particles --- */
.smoke-wrap {
    position: absolute;
    left: 50%;
    bottom: -80px;
    transform: translateX(-50%);
    width: 60px;
    height: 40px;
    pointer-events: none;
}
.smoke {
    position: absolute;
    border-radius: 50%;
    background: rgba(200, 200, 200, 0.15);
    animation: csr-smoke-rise 1.5s ease-out infinite;
}

@keyframes csr-rocket-hover {
    0% {
        transform: translateY(8px) rotate(-1deg);
    }
    50% {
        transform: translateY(-12px) rotate(1deg);
    }
    100% {
        transform: translateY(8px) rotate(-1deg);
    }
}
@keyframes csr-flame-osc {
    0% {
        transform: scaleX(0.82) scaleY(0.88);
        opacity: 0.88;
    }
    100% {
        transform: scaleX(1.18) scaleY(1.14);
        opacity: 1;
    }
}
@keyframes csr-flame-hot-osc {
    0% {
        transform: scaleX(0.8) scaleY(0.85);
        opacity: 0.9;
    }
    100% {
        transform: scaleX(1.2) scaleY(1.17);
        opacity: 1;
    }
}
@keyframes csr-smoke-rise {
    0% {
        opacity: 0.3;
        transform: translateY(0) scale(0.5);
    }
    100% {
        opacity: 0;
        transform: translateY(-30px) scale(1.5);
    }
}

@media (prefers-reduced-motion: reduce) {
    .rocket-stage,
    .flame-blob,
    .flame-hot,
    .smoke {
        animation: none !important;
    }
}