:root{
  --mvs-pl-void:#0a0908;
  --mvs-pl-violet:#4c1d95;
  --mvs-pl-indigo:#3730a3;
  --mvs-pl-teal:#0d9488;
  --mvs-pl-emerald:#059669;
  --mvs-pl-gold:#D4A84B;
  --mvs-pl-amber:#d97706;
  --mvs-pl-rose:#e11d48;
  --mvs-pl-text-tertiary:rgba(255,255,255,0.55);
  --mvs-pl-ease-out-expo:cubic-bezier(0.16, 1, 0.3, 1);
  --mvs-pl-sp-4:1rem;
  --mvs-pl-sp-6:2rem;
}

.preloader{
  position:fixed; inset:0; z-index:10000;
  background:var(--void, var(--mvs-pl-void));
  display:flex; flex-direction:column;
  align-items:center; justify-content:center;
  transition:opacity 0.8s var(--ease-out-expo, var(--mvs-pl-ease-out-expo)), visibility 0.8s;
}
.preloader.done{ opacity:0; visibility:hidden; pointer-events:none; }

.pl-logo{
  width:96px; height:96px; margin-bottom:var(--sp-6, var(--mvs-pl-sp-6));
  display:block; object-fit:contain;
  filter:drop-shadow(0 0 24px rgba(212,168,75,0.35));
  animation:plLogoPulse 2.4s ease-in-out infinite;
}
@keyframes plLogoPulse{
  0%, 100%{ opacity:0.85; transform:scale(1); }
  50%{ opacity:1;    transform:scale(1.04); }
}

.pl-bar-container{
  width:min(320px, 70vw); height:3px;
  background:rgba(255,255,255,0.06);
  border-radius:4px; overflow:visible;
  position:relative;
}
.pl-bar{
  height:100%; width:0%;
  border-radius:4px;
  background:linear-gradient(90deg,
    var(--violet,  var(--mvs-pl-violet)),
    var(--indigo,  var(--mvs-pl-indigo)),
    var(--teal,    var(--mvs-pl-teal)),
    var(--emerald, var(--mvs-pl-emerald)),
    var(--gold,    var(--mvs-pl-gold)),
    var(--amber,   var(--mvs-pl-amber)),
    var(--rose,    var(--mvs-pl-rose)));
  background-size:200% 100%;
  position:relative;
  transition:width 0.3s linear;
  animation:plBarShift 2s linear infinite;
}
@keyframes plBarShift{
  0%{ background-position:0% 50%; }
  100%{ background-position:200% 50%; }
}
.pl-bar::after{
  content:'';
  position:absolute; right:-4px; top:50%;
  transform:translateY(-50%);
  width:10px; height:10px;
  border-radius:50%;
  background:#fff;
  box-shadow:0 0 16px 4px rgba(255,255,255,0.6), 0 0 40px 8px rgba(212,168,75,0.4);
  animation:plGlow 0.8s ease-in-out infinite alternate;
}
@keyframes plGlow{
  0%{ box-shadow:0 0 12px 3px rgba(255,255,255,0.5), 0 0 30px 6px rgba(212,168,75,0.3); }
  100%{ box-shadow:0 0 20px 6px rgba(255,255,255,0.8), 0 0 50px 12px rgba(212,168,75,0.6); }
}

.pl-pct{
  font-family:'Cormorant Garamond', serif;
  font-size:14px; font-style:italic;
  letter-spacing:0.04em;
  color:var(--text-tertiary, var(--mvs-pl-text-tertiary));
  margin-top:var(--sp-4, var(--mvs-pl-sp-4));
  transition:opacity 0.6s;
}