#ilot-chargement{position:fixed;inset:0;box-sizing:border-box;z-index:2147483646;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:32px;overflow:hidden;background:#06436f url("../images/FondPlateauSombre.jpg?v=240") center center / 100% 100% no-repeat;color:#fff;font-family:"Trebuchet MS",sans-serif;text-align:center;padding:24px;cursor:wait}
#ilot-chargement .charge-scene{position:relative;width:min(700px,90vw);padding-top:70px;isolation:isolate}
#ilot-chargement .charge-soleil{position:absolute;z-index:-1;top:0;left:50%;transform:translateX(-50%);width:clamp(140px,26vh,240px);aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 40% 35%,#fffac3,#ffc857 65%,#ff9c35);box-shadow:0 0 45px 12px #ffd36966,0 0 100px #ffd36933}
#ilot-chargement .charge-zors{display:flex;align-items:flex-end;justify-content:center;gap:clamp(8px,2vw,28px);width:100%;position:relative}
#ilot-chargement .charge-element{position:relative;width:14.28%;height:clamp(79.8px,19.32vh,151.2px);transform-origin:center bottom;animation:ilot-zor-saut .5s ease-in-out infinite;animation-delay:calc(var(--ordre)*-.09s)}
#ilot-chargement .charge-element>img:not(.charge-etoile){width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 7px 3px #001b3655)}

#ilot-chargement .charge-element>.charge-etoile{position:absolute;display:block;width:36%;height:30%;object-fit:contain;filter:drop-shadow(0 0 2px #fff)}
#ilot-chargement .charge-etoile[data-etoile="0"]{left:-9%;top:20%}
#ilot-chargement .charge-etoile[data-etoile="1"]{left:13%;top:-2%}
#ilot-chargement .charge-etoile[data-etoile="2"]{left:50%;top:-2%}
#ilot-chargement .charge-etoile[data-etoile="3"]{left:76%;top:20%}
#ilot-chargement .charge-message{font-size:clamp(25px,5vw,42px);font-weight:900;color:#e7fcff;line-height:1.3;text-shadow:0 3px 10px #001b36}
@keyframes ilot-zor-saut{0%,100%{transform:translateY(0) rotate(-7deg)}30%{transform:translateY(-22px) rotate(8deg)}65%{transform:translateY(-5px) rotate(-5deg)}}
@media(max-height:450px){#ilot-chargement{gap:20px;padding:12px}#ilot-chargement .charge-element{height:71.4px}#ilot-chargement .charge-scene{padding-top:45px}#ilot-chargement .charge-message{font-size:26px}}
@media(prefers-reduced-motion:reduce){#ilot-chargement *{animation:none!important}}

#ilot-chargement .charge-progression {position:relative;width:min(540px,80vw);height:32px;border:3px solid #ffe385;border-radius:20px;overflow:hidden;background:#042c46;box-shadow:inset 0 3px 5px #0006,0 4px 0 #012032,0 7px 14px #001a3544;}
#ilot-chargement .charge-barre {width:0;height:100%;border-radius:16px;background:linear-gradient(#fff090,#ffc12f 50%,#f29219);transition:width .12s linear;}
#ilot-chargement .charge-pourcentage {position:absolute;inset:0;display:flex;justify-content:center;align-items:center;color:white;font:bold 20px "Trebuchet MS",sans-serif;text-shadow:0 1px 3px #000,1px 0 2px #000;}

#ilot-chargement .charge-parchemin-jaune>img{filter:url(#charge-parchemin-jaune) drop-shadow(0 7px 3px #001b3655)}