#asset-loading[hidden] { display: none; }
#asset-loading { position: fixed; inset: 0; z-index: 10000001; display: grid; place-items: center; padding: 20px; box-sizing: border-box; background: #000; color: #eefaff; font-family: monospace; }
#asset-loading { grid-template-columns: minmax(0, 1fr); }
.asset-loading-content { width: 420px; max-width: 100%; min-width: 0; }
.asset-loading-title { margin: 0 0 12px; font-size: 22px; color: #75f5ff; text-shadow: 2px 2px #ad256a; letter-spacing: 0; }
#asset-loading-status { min-height: 20px; font-size: 13px; }
.asset-loading-track { height: 24px; margin: 18px 0; padding: 4px; border: 1px solid #ff58ad; box-shadow: 0 0 14px #ff58ad44, inset 0 0 8px #ff58ad22; overflow: hidden; }
#asset-loading-fill { width: 0; height: 100%; background: repeating-linear-gradient(90deg,#75f5ff 0 9px,transparent 9px 12px); filter: drop-shadow(0 0 4px #75f5ff); transition: width .15s linear; }
#asset-loading[data-indeterminate='true'] #asset-loading-fill { width: 30%; animation: asset-loading-scan 1.4s ease-in-out infinite alternate; }
#asset-loading-details { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 10px; font-size: 12px; color: #ff86c1; }
#asset-loading-retry { margin-top: 20px; min-height: 44px; padding: 8px 20px; background: #17202b; border: 1px solid #75f5ff; color: #fff; cursor: pointer; }
@keyframes asset-loading-scan { to { transform: translateX(233%); } }
@media(prefers-reduced-motion:reduce) { #asset-loading-fill { animation: none !important; transition: none; } }