/* LBTChat - layar loading naga hitam China (+ mode VIP) */
#dl{position:fixed;inset:0;z-index:2147483000;display:flex;align-items:center;justify-content:center;overflow:hidden;color:#f5e6c4;
  font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif;background:radial-gradient(ellipse at 50% 42%,#2a0608 0%,#120305 45%,#050203 100%);
  --g1:#ffd76a;--g2:#c8860d;--rd:#e0242b;--gl:rgba(255,190,60,.55);transition:opacity .75s ease,transform .75s ease,filter .75s ease}
#dl.vip1{--g1:#f4f7fb;--g2:#9aa6b5;--gl:rgba(200,212,228,.55)}
#dl.vip2{--g1:#ffe259;--g2:#ff9f0a;--gl:rgba(255,184,0,.6)}
#dl.vip3{--g1:#8fe9ff;--g2:#2f8cff;--rd:#6a4bff;--gl:rgba(79,180,255,.7);
  background:radial-gradient(ellipse at 50% 42%,#0b1c4a 0%,#060b22 48%,#02030a 100%)}
#dl.out{opacity:0;transform:scale(1.12);filter:blur(6px);pointer-events:none}
#dl canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
#dl .dl-vig{position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at center,transparent 45%,rgba(0,0,0,.75) 100%)}
#dl .dl-mid{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;text-align:center;padding:0 24px;width:min(86vw,360px)}

/* mutiara naga */
#dl .dl-orb{position:relative;width:104px;height:104px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  background:radial-gradient(circle at 36% 30%,#fff3c4 0%,var(--g1) 18%,var(--g2) 55%,#3a0d05 100%);
  box-shadow:0 0 28px var(--gl),0 0 80px var(--gl),inset 0 0 22px rgba(0,0,0,.45);animation:dlpulse 2.2s ease-in-out infinite}
#dl .dl-orb::before,#dl .dl-orb::after{content:"";position:absolute;inset:-10px;border-radius:50%;border:1.5px solid var(--g1);opacity:.55;animation:dlring 2.4s ease-out infinite}
#dl .dl-orb::after{animation-delay:1.2s}
#dl .dl-orb b{font:700 52px/1 "Noto Serif SC","Songti SC","STSong","SimSun","Ma Shan Zheng",serif;color:#2a0608;text-shadow:0 1px 0 rgba(255,255,255,.35)}
@keyframes dlpulse{50%{transform:scale(1.07);filter:brightness(1.18)}}
@keyframes dlring{0%{transform:scale(.9);opacity:.7}100%{transform:scale(1.7);opacity:0}}

#dl h1{margin:20px 0 2px;font-size:30px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;
  background:linear-gradient(100deg,var(--g2) 0%,var(--g1) 35%,#fff 50%,var(--g1) 65%,var(--g2) 100%);background-size:250% 100%;
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;animation:dlsheen 3.2s linear infinite;filter:drop-shadow(0 0 10px var(--gl))}
@keyframes dlsheen{to{background-position:-250% 0}}
#dl .dl-cn{font:600 13px/1 "Noto Serif SC","Songti SC","SimSun",serif;letter-spacing:.5em;color:var(--g1);opacity:.75;margin-bottom:22px;padding-left:.5em}

#dl .dl-bar{position:relative;width:100%;height:8px;border-radius:99px;background:rgba(255,255,255,.09);border:1px solid rgba(255,215,106,.25);overflow:hidden}
#dl .dl-bar i{position:absolute;left:0;top:0;bottom:0;width:0;border-radius:inherit;background:linear-gradient(90deg,var(--rd),var(--g2) 55%,var(--g1));box-shadow:0 0 14px var(--gl);transition:width .2s linear}
#dl .dl-bar i::after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.55) 50%,transparent 70%);background-size:200% 100%;animation:dlsheen 1.3s linear infinite}
#dl .dl-st{display:flex;justify-content:space-between;width:100%;margin-top:10px;font-size:12.5px;letter-spacing:.04em;color:#e9d9b4;opacity:.9}
#dl .dl-st span:last-child{font-weight:700;color:var(--g1);font-variant-numeric:tabular-nums}
#dl .dl-st .dots::after{content:"";animation:dldots 1.2s steps(4,end) infinite}
@keyframes dldots{0%{content:""}25%{content:"."}50%{content:".."}75%,100%{content:"..."}}

/* banner VIP */
#dl .dl-vip{display:none;margin-top:20px;padding:9px 18px;border-radius:99px;font-size:12.5px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:#1a1200;
  background:linear-gradient(135deg,var(--g1),var(--g2));box-shadow:0 4px 22px var(--gl);position:relative;overflow:hidden;animation:dlvipin .9s cubic-bezier(.2,1.4,.4,1) .3s both}
#dl.vip1 .dl-vip,#dl.vip2 .dl-vip,#dl.vip3 .dl-vip{display:inline-flex;align-items:center;gap:8px}
#dl.vip3 .dl-vip{color:#fff}
#dl .dl-vip::after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.65) 50%,transparent 70%);background-size:250% 100%;animation:dlsheen 2.2s linear infinite}
#dl .dl-vip i{font-style:normal;animation:dlcrown 1.6s ease-in-out infinite;display:inline-block}
@keyframes dlvipin{from{opacity:0;transform:translateY(14px) scale(.6)}to{opacity:1;transform:none}}
@keyframes dlcrown{50%{transform:translateY(-3px) rotate(-8deg) scale(1.15)}}

@media (prefers-reduced-motion:reduce){#dl .dl-orb,#dl h1,#dl .dl-vip i{animation:none}#dl .dl-orb::before,#dl .dl-orb::after{display:none}}
