/* Animasi logo A (cincin cahaya + bintang) — dipakai di layar loading #load
   (saat buka website & setelah login/daftar). Semua class diawali .lgx supaya tidak bentrok. */
.lgx{position:relative;width:min(72vw,300px);aspect-ratio:1;margin:0 auto;background:#000;overflow:hidden;isolation:isolate}
.lgx .layer{position:absolute;inset:0;width:100%;height:100%;display:block}
.lgx .img-base{background:url(/image/logo-base.png) center/contain no-repeat}
.lgx .img-ring{background:url(/image/logo-ring.png) center/contain no-repeat}
.lgx .img-star{background:url(/image/logo-star.png) center/contain no-repeat}
.lgx .fx{position:absolute;inset:0;overflow:hidden;isolation:isolate;mix-blend-mode:screen;background:#000}
.lgx .fx.soft{filter:blur(9px) brightness(1.4)}
.lgx .sweep{position:absolute;left:-50%;top:-51.4%;width:200%;height:200%;mix-blend-mode:multiply;
 background:conic-gradient(from 0deg at 50% 50%,#0a5fd0 0deg,#0a5fd0 200deg,#2f90ff 280deg,#a5deff 335deg,#fff 357deg,#0a5fd0 360deg);
 animation:lgx-spin 3s linear infinite}
.lgx .star{transform-origin:91.1% 24.6%;animation:lgx-twinkle 2.2s ease-in-out infinite}
.lgx .halo{position:absolute;left:91.1%;top:24.6%;width:22%;aspect-ratio:1;translate:-50% -50%;border-radius:50%;
 background:radial-gradient(circle,rgba(255,255,255,.55),rgba(255,255,255,.12) 40%,rgba(255,255,255,0) 70%);
 animation:lgx-halo 2.2s ease-in-out infinite}
@keyframes lgx-spin{to{transform:rotate(360deg)}}
@keyframes lgx-twinkle{0%,100%{opacity:.75;transform:scale(.92)}45%{opacity:1;transform:scale(1.1)}}
@keyframes lgx-halo{0%,100%{opacity:.35;scale:.8}45%{opacity:1;scale:1.15}}
@media(prefers-reduced-motion:reduce){.lgx .sweep{animation-duration:9s}.lgx .star,.lgx .halo{animation-duration:6s}}
/* logo lama di layar loading diganti logo baru */
.load .lg2{display:none}