/* Écran de démarrage affiché avant le chargement de React (fichier séparé : la CSP interdit les styles inline).
   Même animation que .splash dans app.css : le logo arrive en glissant, sa traînée floue s'efface. */
html, body { margin: 0; background: #0a0908; }
.boot {
  min-height: 100vh; min-height: 100dvh; overflow: hidden;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 24px;
}
.boot .logo { position: relative; width: 132px; height: 82px; }
.boot .logo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; }
.boot .trail { opacity: 0; filter: blur(2px); animation: boot-trail 1.1s cubic-bezier(0.16, 1, 0.3, 1) forwards; }
.boot .mark { opacity: 0; filter: blur(10px); transform: translateX(-14px);
  animation: boot-arrive 0.9s 0.15s cubic-bezier(0.16, 1, 0.3, 1) forwards, boot-breathe 2.8s 1.2s ease-in-out infinite; }
.boot i {
  display: block; width: 92px; height: 2px; border-radius: 2px; opacity: 0;
  background: linear-gradient(90deg, transparent, #d9b56f, transparent) -92px 0 / 92px 2px no-repeat, rgba(217, 181, 111, 0.14);
  animation: boot-fade 0.4s 0.6s forwards, boot-sweep 1.3s cubic-bezier(0.4, 0, 0.2, 1) infinite;
}
@keyframes boot-trail { 0% { opacity: 0; transform: translateX(-60%) scaleX(1.4); } 35% { opacity: 0.55; } 100% { opacity: 0; transform: none; } }
@keyframes boot-arrive { to { opacity: 1; filter: blur(0); transform: none; } }
@keyframes boot-breathe { 50% { opacity: 0.78; } }
@keyframes boot-fade { to { opacity: 1; } }
@keyframes boot-sweep { to { background-position: 92px 0, 0 0; } }
@media (prefers-reduced-motion: reduce) {
  .boot .trail { display: none; }
  .boot .mark, .boot i { animation: none; opacity: 1; filter: none; transform: none; }
}