#automan-loading {
  position: absolute; inset: 0 0 38px; z-index: 4;
  display: grid; place-items: center; overflow: hidden;
  background: #e1f0ce url("loading-background.png") center / cover; opacity: 1; transition: opacity .4s ease;
  font-family: "Microsoft YaHei", "PingFang SC", Arial, sans-serif;
}
#automan-loading::before { content: ""; position: absolute; inset: 0; background: #143d3455; backdrop-filter: blur(12px); }
.unity-mobile #automan-loading { bottom: 0; }
#automan-loading.is-complete { opacity: 0; pointer-events: none; }
.loading-scene { position: relative; width: 100%; aspect-ratio: 1672 / 941; container-type: inline-size; }
.loading-art { display: block; width: 100%; height: auto; }
/* Match the reference artwork's inner slot, covering its painted fixed fill. */
.loading-track {
  position: absolute; left: 28.55%; top: 81.1%; width: 42.95%; height: 4.6%;
  box-sizing: border-box; overflow: hidden; border: 2px solid #663e20;
  border-radius: 12px; background: linear-gradient(#553720, #755031);
  box-shadow: inset 0 3px 7px #2d170d99;
}
.loading-fill {
  position: relative; width: 0%; height: 100%; border-radius: 9px;
  background: repeating-linear-gradient(135deg, #37df34 0 18px, #76f84d 18px 36px);
  box-shadow: inset 0 3px 0 #d5ff9a, inset 0 -3px 0 #189e25;
  transition: width .32s ease-out; animation: loading-stripes 1.6s linear infinite;
}
.loading-fill::after {
  content: ""; position: absolute; inset: 0; width: 40%;
  background: linear-gradient(90deg, transparent, #fff8, transparent);
  animation: loading-shine 2.5s ease-in-out infinite;
}
.loading-label {
  position: absolute; left: 44.6%; top: 88.2%; width: 11.2%; height: 3.8%;
  display: flex; gap: .25em; justify-content: center; align-items: center;
  background: #ffe0ac; color: #653516; border-radius: 3px;
  font-size: clamp(4px, 1.25cqw, 21px); font-weight: 800; white-space: nowrap;
}
.loading-dots { animation: loading-dots 1.4s steps(3) infinite; }
#loading-status {
  position: absolute; left: 34%; top: 93.7%; width: 32%; text-align: center;
  color: #194d29; background: #fff6daed; padding: .25em .6em; border-radius: 20px;
  box-sizing: border-box; font-size: clamp(10px, 1.15cqw, 19px); font-weight: 600;
}
#loading-retry {
  position: absolute; left: 41%; top: 93%; width: 18%; padding: .45em;
  border: 2px solid #f0d1a4; border-radius: 8px; background: #296c35; color: #fff6dc;
  font: inherit; font-size: clamp(11px, 1.25cqw, 21px); cursor: pointer;
}
#loading-retry[hidden] { display: none; }
#automan-loading.is-error #loading-status { top: 86%; left: 20%; width: 60%; color: #812a1c; }
#automan-loading.is-error .loading-label { visibility: hidden; }
#automan-loading.is-error .loading-fill { animation: none; }
.loading-leaf { position: absolute; width: 1.1%; height: 1.8%; border-radius: 90% 0 90% 0; background: #afd936; box-shadow: inset -2px -2px #78a71b; pointer-events: none; opacity: 0; animation: loading-leaf 7s linear infinite; }
.leaf-one { left: 48%; top: 36%; }
.leaf-two { left: 78%; top: 24%; animation-delay: 3.4s; }
@keyframes loading-stripes { to { background-position: 51px 0; } }
@keyframes loading-shine { from { transform: translateX(-120%); } to { transform: translateX(350%); } }
@keyframes loading-dots { 0% { opacity: .25; } 100% { opacity: 1; } }
@keyframes loading-leaf { 10% { opacity: .9; } 90% { opacity: .9; } 100% { transform: translate(-12cqw, 22cqw) rotate(270deg); opacity: 0; } }
@media (prefers-reduced-motion: reduce) {
  #automan-loading, .loading-fill { transition: none; }
  .loading-fill, .loading-fill::after, .loading-dots, .loading-leaf { animation: none; }
}