/* Keep long presses and double taps on mobile from selecting the game page. */
body {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

#status {
  position: fixed; inset: 0; z-index: 1000; visibility: visible;
  background: white; color: #193451; font-family: ui-rounded, 'Trebuchet MS', sans-serif;
  overflow: hidden; transition: opacity .35s ease;
}
#status.with-art { background: var(--kworld-loading-backdrop, #123e4b); }
#loading-title { position: absolute; top: 40%; left: 5%; right: 5%; text-align: center; font-size: clamp(28px, 5vw, 56px); }
#status-splash { display: none; position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; margin: auto; }
#status-splash-fill { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: blur(24px) saturate(1.1); transform: scale(1.12); }
#loading-card {
  position: absolute; bottom: max(4%, env(safe-area-inset-bottom)); left: 50%; transform: translateX(-50%);
  box-sizing: border-box; width: min(420px, calc(100% - 40px)); padding: 16px 22px 20px;
  border: 2px solid #b4c7c4; border-radius: 20px; background: #fff9ed;
  box-shadow: 0 5px 0 #173f4c66, 0 8px 28px #08293444; color: #193451; text-align: center;
}
#loading-label { margin: 0 0 12px; font-size: clamp(16px, 2.2vw, 20px); font-weight: 800; }
#status-progress {
  position: static; display: block; box-sizing: border-box; appearance: none;
  width: 100%; height: 20px; margin: 0; border: 2px solid #bdcdd1; border-radius: 20px;
  background: #dbe3e6; padding: 2px; overflow: hidden;
}
#status-progress::-webkit-progress-bar { background: #dbe3e6; border-radius: 20px; }
#status-progress::-webkit-progress-value { background: var(--kworld-loading-accent, linear-gradient(#81c6cd,#46929f)); border-radius: 20px; }
#status-progress::-moz-progress-bar { background: var(--kworld-loading-accent, linear-gradient(#81c6cd,#46929f)); border-radius: 20px; }
#status-notice { position: relative; margin: 12px 0; padding: 0; background: none; border: 0; color: #193451; font: inherit; }
#loading-retry { margin-top: 10px; border: 2px solid #3c7785; border-radius: 12px; padding: 10px 26px; color: #173451; background: #bbe3e4; box-shadow: 0 3px 0 #81adb2; font: inherit; font-weight: 800; cursor: pointer; }
#status.leaving { opacity: 0; pointer-events: none; }
@media (prefers-reduced-motion: reduce) { #status { transition: none; } }