/* 蹴GO Loading UI v1.3.0 — scoped to #kgl1-overlay, no global changes. */
#kgl1-overlay,
#kgl1-overlay * { box-sizing: border-box; }
#kgl1-overlay {
  position: fixed !important; inset: 0 !important; z-index: 2147483600 !important;
  display: grid !important; place-items: center !important;
  margin: 0 !important; padding: max(16px, env(safe-area-inset-top, 0px)) 16px max(16px, env(safe-area-inset-bottom, 0px)) !important;
  background: rgba(5, 31, 21, .42) !important;
  -webkit-backdrop-filter: blur(2px); backdrop-filter: blur(2px);
  font-family: -apple-system, BlinkMacSystemFont, 'Noto Sans JP', 'Hiragino Kaku Gothic ProN', Meiryo, sans-serif !important;
  color: #124d35 !important; text-align: center !important;
  opacity: 0; visibility: hidden; pointer-events: none !important;
  transition: opacity .12s ease-out, visibility .12s ease-out;
}
#kgl1-overlay.kgl1-show { opacity: 1 !important; visibility: visible !important; }
#kgl1-overlay .kgl1-panel {
  position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center;
  width: min(680px, 100%); min-height: 185px; margin: 0 !important;
  padding: 19px 24px 17px; background: #eaf8f1;
  border: 1px solid rgba(255,255,255,.92); border-radius: 21px;
  box-shadow: 0 15px 50px rgba(2,40,19,.18), 0 3px 10px rgba(2,40,19,.06);
  font: inherit; color: #124d35;
}
#kgl1-overlay .kgl1-brand {
  margin: 0 0 5px; color: #176343; font-size: 12px; font-weight: 800;
  line-height: 1.3; letter-spacing: .015em;
}
#kgl1-overlay .kgl1-scene { display: block; width: 250px; max-width: 94%; height: 53px; margin: 0 auto 4px; }
#kgl1-overlay .kgl1-scene svg { display: block; overflow: visible; width: 100%; height: 100%; }
#kgl1-overlay .kgl1-message {
  margin: 1px 0 0; color: #104a32; font-size: clamp(15px, 3.8vw, 18px);
  font-weight: 800; line-height: 1.5; letter-spacing: .02em;
}
#kgl1-overlay .kgl1-dots { display: flex; justify-content: center; gap: 8px; margin: 9px 0 7px; }
#kgl1-overlay .kgl1-dots i { width: 7px; height: 7px; border-radius: 50%; background: #17844b; animation: kgl1-dot 1.15s infinite ease-in-out; }
#kgl1-overlay .kgl1-dots i:nth-child(2) { animation-delay: .16s; }
#kgl1-overlay .kgl1-dots i:nth-child(3) { animation-delay: .32s; }
#kgl1-overlay .kgl1-hint { margin: 0; color: #568b73; font-size: 12px; line-height: 1.5; font-weight: 500; }

/* The runner, kicking leg and ball are independently animated in one 2-second cycle. */
#kgl1-overlay .kgl1-runner { transform-origin: 38px 48px; animation: kgl1-run 2s linear infinite; }
#kgl1-overlay .kgl1-leg { transform-box: fill-box; transform-origin: 24% 8%; animation: kgl1-leg 2s ease-in-out infinite; }
#kgl1-overlay .kgl1-ball { transform-box: fill-box; transform-origin: center; animation: kgl1-ball-flight 2s ease-in-out infinite; }
#kgl1-overlay .kgl1-trail { animation: kgl1-trail 2s linear infinite; }
#kgl1-overlay .kgl1-flag { transform-origin: 208px 41px; animation: kgl1-flag-wave 2s ease-in-out infinite; }
#kgl1-overlay .kgl1-goal { transform-origin: 208px 43px; animation: kgl1-goal 2s ease-out infinite; }
@keyframes kgl1-run {
  0%, 6% { transform: translateX(-15px) translateY(0); }
  12% { transform: translateX(-8px) translateY(-3px); }
  21% { transform: translateX(1px) translateY(0); }
  30%, 43% { transform: translateX(15px) translateY(0); }
  48%, 100% { transform: translateX(15px) translateY(0); }
}
@keyframes kgl1-leg {
  0%, 16% { transform: rotate(-23deg); }
  22%, 30% { transform: rotate(16deg); }
  37%, 46% { transform: rotate(42deg); }
  52%,100% { transform: rotate(-14deg); }
}
@keyframes kgl1-ball-flight {
  0%, 31% { transform: translate(0,0) rotate(0deg) scale(1); opacity:1; }
  40% { transform: translate(23px,-7px) rotate(65deg) scale(.98); opacity:1; }
  68% { transform: translate(90px,-4px) rotate(390deg) scale(.78); opacity:1; }
  82% { transform: translate(116px,2px) rotate(550deg) scale(.60); opacity:1; }
  88%,99% { transform: translate(116px,2px) rotate(550deg) scale(.15); opacity:0; }
  100% { transform: translate(0,0) rotate(0) scale(1); opacity:1; }
}
@keyframes kgl1-trail { 0%,32%,90%,100% { opacity:0; } 45%,67% {opacity:1;} }
@keyframes kgl1-flag-wave { 0%,68%,100% { transform:skewY(0deg); } 76%,84% { transform:skewY(-3deg); } }
@keyframes kgl1-goal { 0%,70% { opacity:0; } 75%,93% { opacity:1; } 100% {opacity:0;} }
@keyframes kgl1-dot {0%,65%,100% {transform:translateY(0);opacity:.5;} 31%{transform:translateY(-3px);opacity:1;}}
@media (max-width:600px) {
  #kgl1-overlay .kgl1-panel { width:min(100%,420px); min-height:190px; padding:19px 18px 17px; border-radius:18px; }
  #kgl1-overlay .kgl1-brand { font-size:12px; }
  #kgl1-overlay .kgl1-scene { width:220px; height:48px; }
  #kgl1-overlay .kgl1-hint {font-size:11px;}
}
@media (prefers-reduced-motion: reduce) {
  #kgl1-overlay,
  #kgl1-overlay .kgl1-runner,
  #kgl1-overlay .kgl1-leg,
  #kgl1-overlay .kgl1-ball,
  #kgl1-overlay .kgl1-trail,
  #kgl1-overlay .kgl1-flag,
  #kgl1-overlay .kgl1-goal,
  #kgl1-overlay .kgl1-dots i { animation:none !important; transition:none !important; }
}
