@import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@400;700;900&display=swap');

html, body { background:#000!important; }

:root {
    --bgImg:url("../loading/background.jpg");
    --relayImg:url("../loading/relaybig.png");
}

body {
    margin:0;
    padding:0;
    overflow:hidden;
}

#lm { background:transparent!important; }

#indicator {
    position:fixed;
    top:50%;
    left:50%;
    transform:translate(-50%,-50%);
    z-index:10;
}

#indicator .loading-text,
#indicator .loading-percent {
    opacity:0;
    display:block;
}

#indicator:before {
    content:"";
    position:absolute;
    width:1px;
    height:1px;
    opacity:0;
}

.iccsentinel {
    width:1px;
    height:1px;
    opacity:0;
    display:block;
}

/* Loader wrapper */
#relay-wrapper {
    position:fixed;
    inset:0;
    z-index:99999999;
    pointer-events:none;
    opacity:1;
}

/* Background */
.bg {
    position:fixed;
    width:1920px;
    height:1080px;
    left:50%;
    top:50%;
    transform:translate(-50%,-50%);
    background-image:var(--bgImg);
    background-size:1920px 1080px;
    background-repeat:no-repeat;
    background-position:center;
    z-index:0;
}

/* COMPACTED: .relay */
.relay{width:900px;height:900px;background-image:var(--relayImg);background-repeat:no-repeat;background-size:900px 900px;background-position:center;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);z-index:1;}

/* COMPACTED: .orb */
.orb{width:140px;height:140px;border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,1)0%,rgba(200,240,255,1)22%,rgba(150,220,255,.55)45%,rgba(120,200,255,.25)65%,rgba(0,0,0,0)85%);animation:orbPulse 2.2s ease-in-out infinite;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);z-index:2;}

/* COMPACTED: .ring */
.ring{width:120px;height:120px;border-radius:50%;border:3px solid #4a4a4a;background:conic-gradient(from 0deg,#8a8a8a 0deg,#b0b0b0 12deg,#707070 12deg,#9a9a9a 24deg,#7c7c7c 24deg,#b8b8b8 36deg,#686868 36deg,#a2a2a2 48deg,#8a8a8a 48deg,#b0b0b0 60deg,#707070 60deg,#9a9a9a 72deg,#7c7c7c 72deg,#b8b8b8 84deg,#686868 84deg,#a2a2a2 96deg,#8a8a8a 96deg,#b0b0b0 108deg,#707070 108deg,#9a9a9a 120deg,#7c7c7c 120deg,#b8b8b8 132deg,#686868 132deg,#a2a2a2 144deg,#8a8a8a 144deg,#b0b0b0 156deg,#707070 156deg,#9a9a9a 168deg,#7c7c7c 168deg,#b8b8b8 180deg,#686868 180deg,#a2a2a2 192deg,#8a8a8a 192deg,#b0b0b0 204deg,#707070 204deg,#9a9a9a 216deg,#7c7c7c 216deg,#b8b8b8 228deg,#686868 228deg,#a2a2a2 240deg,#8a8a8a 240deg,#b0b0b0 252deg,#707070 252deg,#9a9a9a 264deg,#7c7c7c 264deg,#b8b8b8 276deg,#686868 276deg,#a2a2a2 288deg,#8a8a8a 288deg,#b0b0b0 300deg,#707070 300deg,#9a9a9a 312deg,#7c7c7c 312deg,#b8b8b8 324deg,#686868 324deg,#a2a2a2 336deg,#8a8a8a 336deg,#b0b0b0 348deg,#707070 348deg,#9a9a9a 360deg);mask:radial-gradient(circle,transparent 55%,black 56%);animation:spinring 1.8s linear infinite;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);z-index:3;}

/* COMPACTED: orbPulse */
@keyframes orbPulse{0%{transform:translate(-50%,-50%) scale(1);opacity:1;}12%{transform:translate(-50%,-50%) scale(1.18);opacity:.85;}25%{transform:translate(-50%,-50%) scale(1.05);opacity:.95;}38%{transform:translate(-50%,-50%) scale(1.22);opacity:.75;}52%{transform:translate(-50%,-50%) scale(1.10);opacity:.9;}67%{transform:translate(-50%,-50%) scale(1.25);opacity:.7;}82%{transform:translate(-50%,-50%) scale(1.08);opacity:.92;}100%{transform:translate(-50%,-50%) scale(1);opacity:1;}}

/* COMPACTED: .electric */
.electric{width:160px;height:160px;border-radius:50%;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);pointer-events:none;z-index:4;background:radial-gradient(circle at 20% 30%,rgba(0,180,255,1)0%,transparent 18%),radial-gradient(circle at 75% 25%,rgba(0,220,255,1)0%,transparent 20%),radial-gradient(circle at 30% 80%,rgba(0,200,255,1)0%,transparent 15%),radial-gradient(circle at 70% 75%,rgba(0,240,255,1)0%,transparent 17%);mix-blend-mode:screen;opacity:.9;animation:electricFlicker .07s infinite steps(2);}

/* COMPACTED: electricFlicker */
@keyframes electricFlicker{0%{transform:translate(-50%,-50%) scale(1.05) rotate(0deg);opacity:.55;}25%{transform:translate(-50%,-50%) scale(1.22) rotate(18deg);opacity:1;}50%{transform:translate(-50%,-50%) scale(.97) rotate(-12deg);opacity:.7;}75%{transform:translate(-50%,-50%) scale(1.18) rotate(32deg);opacity:1;}100%{transform:translate(-50%,-50%) scale(1) rotate(-20deg);opacity:.6;}}

/* loading text */
.loadtext {
    position:fixed;
    top:calc(50% + 110px);
    left:50%;
    transform:translateX(-50%);
    font-family:'Orbitron',Eurostile,'Square 721',Impact,'Segoe UI',sans-serif;
    font-size:38px;
    font-weight:900;
    letter-spacing:2px;
    color:#c8e8ff;

    /* COMPACTED: text-shadow */
    text-shadow:-2px -2px 0 #000,2px -2px 0 #000,-2px 2px 0 #000,2px 2px 0 #000,-3px 0 0 #000,3px 0 0 #000,0 -3px 0 #000,0 3px 0 #000,0 0 8px rgba(80,140,200,0.4);

    z-index:5;
    pointer-events:none;
    white-space:nowrap;
    overflow:hidden;

    animation:shimmer 3.2s linear infinite,holoShift 6s ease-in-out infinite,diagFlicker .12s steps(2) infinite;
}

/* holographic + shimmer + flicker remain unchanged */

@keyframes shimmer {
    0%{opacity:.75;filter:brightness(.9) drop-shadow(0 0 4px rgba(80,140,200,.4));}
    40%{opacity:1;filter:brightness(1.05) drop-shadow(0 0 10px rgba(60,120,200,.9));}
    60%{opacity:1;filter:brightness(1.05) drop-shadow(0 0 10px rgba(60,120,200,.9));}
    100%{opacity:.75;filter:brightness(.9) drop-shadow(0 0 4px rgba(80,140,200,.4));}
}

@keyframes holoShift {
    0%{transform:translateX(-50%) skewX(0deg);}
    20%{transform:translateX(-50%) skewX(1.2deg);}
    40%{transform:translateX(-50%) skewX(-.8deg);}
    60%{transform:translateX(-50%) skewX(1deg);}
    80%{transform:translateX(-50%) skewX(-1.4deg);}
    100%{transform:translateX(-50%) skewX(0deg);}
}

@keyframes diagFlicker {
    0%{filter:brightness(1);}
    50%{filter:brightness(.92);}
    100%{filter:brightness(1);}
}

/* COMPACTED: dotmask */
@keyframes dotmask{0%{clip-path:inset(0 100% 0 0);}25%{clip-path:inset(0 66% 0 0);}50%{clip-path:inset(0 33% 0 0);}75%{clip-path:inset(0 0% 0 0);}100%{clip-path:inset(0 100% 0 0);}}

@keyframes dotsCycle{0%{content:"";}25%{content:".";}50%{content:"..";}75%{content:"...";}100%{content:"";}}
.dots{display:inline-block;width:1.2em;text-align:left;overflow:hidden;animation:dotsCycle 1s steps(4) infinite;line-height:1em;vertical-align:-0.15em;}
.dots::after{content:"";animation:inherit;}





