/* Magical Loading Overlay */
#loading-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(10,10,26,0.97);z-index:9999;display:flex;flex-direction:column;align-items:center;justify-content:center;transition:opacity 0.6s ease}
#loading-overlay.done{opacity:0;pointer-events:none}
.spinner{width:50px;height:50px;border:3px solid rgba(139,92,246,0.15);border-top:3px solid #a78bfa;border-radius:50%;animation:spin 0.8s linear infinite}
@keyframes spin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}
.load-text{color:#c4b5fd;font-family:'Cinzel',serif;font-size:1.1em;margin-top:18px;letter-spacing:3px;animation:pulse 2s ease-in-out infinite}
@keyframes pulse{0%,100%{opacity:.4}50%{opacity:1}}
.sparkle{position:absolute;width:3px;height:3px;background:#a78bfa;border-radius:50%;opacity:0;animation:twinkle 2.5s ease-in-out infinite}
@keyframes twinkle{0%{opacity:0;transform:scale(0)}40%{opacity:1;transform:scale(1)}100%{opacity:0;transform:scale(0)}}
.s1{top:25%;left:15%;animation-delay:0s}
.s2{top:15%;left:75%;animation-delay:.4s}
.s3{top:65%;left:25%;animation-delay:.8s}
.s4{top:75%;left:70%;animation-delay:1.2s}
.s5{top:35%;left:55%;animation-delay:1.6s}
.s6{top:80%;left:45%;animation-delay:2s}