/* v2.9.56 · lightweight, panel-free world loading scene. */
#app .loading-screen {
  --loading-ink:#f8fcfb;
  --loading-muted:rgba(239,251,248,.82);
  position:fixed;
  z-index:160;
  inset:0;
  display:flex;
  align-items:flex-end;
  justify-content:center;
  padding:max(24px,env(safe-area-inset-top)) max(18px,env(safe-area-inset-right)) max(54px,calc(34px + env(safe-area-inset-bottom))) max(18px,env(safe-area-inset-left));
  overflow:hidden;
  background:#7abed7;
  color:var(--loading-ink);
  isolation:isolate;
}

#app .loading-scene {
  position:absolute;
  z-index:-3;
  inset:-2%;
  background-image:url('/assets/v2.9.56/loading/expedition-valley-v2.jpg');
  background-position:center;
  background-size:cover;
  transform:scale(1.025);
  animation:loading-v2956-drift 16s ease-in-out infinite alternate;
}

#app .loading-screen::before {
  position:absolute;
  z-index:-2;
  inset:0;
  content:'';
  background:
    linear-gradient(180deg,rgba(20,70,88,.02) 22%,rgba(12,50,56,.08) 48%,rgba(5,27,32,.76) 100%),
    radial-gradient(ellipse at 50% 72%,transparent 0 22%,rgba(5,27,32,.08) 60%,rgba(3,22,27,.30) 100%);
}

#app .loading-screen::after {
  position:absolute;
  z-index:-1;
  left:50%;
  bottom:-150px;
  width:min(780px,110vw);
  height:410px;
  content:'';
  transform:translateX(-50%);
  border-radius:50%;
  background:radial-gradient(ellipse,rgba(4,27,32,.46),transparent 70%);
  pointer-events:none;
}

#app .loading-card {
  display:flex;
  width:min(480px,calc(100vw - 36px));
  padding:0;
  flex-direction:column;
  align-items:center;
  border:0;
  border-radius:0;
  background:none;
  box-shadow:none;
  text-align:center;
  backdrop-filter:none;
}

#app .loading-compass {
  position:relative;
  width:62px;
  height:62px;
  margin:0 0 15px;
  border:2px solid rgba(255,255,255,.8);
  border-radius:50%;
  background:linear-gradient(180deg,#205a64 0 45%,#f1c956 45% 55%,#f7f3e7 55% 100%);
  box-shadow:0 13px 32px rgba(0,24,31,.30),inset 0 2px 2px rgba(255,255,255,.42);
  animation:loading-v2956-float 2.4s ease-in-out infinite;
}

#app .loading-compass::before {
  position:absolute;
  z-index:3;
  left:50%;
  top:50%;
  width:17px;
  height:17px;
  content:'';
  transform:translate(-50%,-50%);
  border:4px solid rgba(255,255,255,.92);
  border-radius:50%;
  background:#57b9c3;
  box-shadow:0 0 0 2px rgba(14,68,77,.54),0 4px 10px rgba(0,27,34,.24);
}

#app .loading-compass::after {
  position:absolute;
  left:12px;
  top:8px;
  width:24px;
  height:11px;
  content:'';
  transform:rotate(-24deg);
  border-radius:50%;
  background:rgba(255,255,255,.27);
  filter:blur(.2px);
}

#app .loading-compass i {
  position:absolute;
  inset:-8px;
  border:1px solid rgba(255,255,255,.34);
  border-top-color:rgba(255,255,255,.92);
  border-right-color:transparent;
  border-radius:50%;
  animation:loading-v2956-orbit 1.65s linear infinite;
}

#app .loading-compass span {
  position:absolute;
  z-index:4;
  right:-5px;
  left:auto;
  top:4px;
  width:6px;
  height:6px;
  clip-path:none;
  transform:none;
  border-radius:50%;
  background:#fff7ba;
  box-shadow:0 0 0 5px rgba(255,239,145,.12),0 0 16px rgba(255,239,145,.72);
}

#app .loading-kicker {
  margin:0 0 7px;
  color:#c8f2e7;
  font:850 9px/1.2 "Segoe UI Variable","Segoe UI",Inter,system-ui,sans-serif;
  letter-spacing:.17em;
  text-shadow:0 2px 13px rgba(2,28,34,.64);
}

#app .loading-card > b {
  margin:0;
  max-width:100%;
  color:#fff;
  font:780 clamp(24px,3.2vw,34px)/1.08 "Segoe UI Variable","Segoe UI",Inter,system-ui,sans-serif;
  letter-spacing:-.035em;
  text-wrap:balance;
  text-shadow:0 3px 20px rgba(0,25,31,.62);
}

#app .loading-card > #loadingSubtitle {
  max-width:430px;
  margin:8px 0 17px;
  color:var(--loading-muted);
  font:560 12px/1.45 "Segoe UI Variable","Segoe UI",Inter,system-ui,sans-serif;
  text-wrap:balance;
  text-shadow:0 2px 12px rgba(0,23,29,.72);
}

#app .loading-progress {
  width:min(360px,100%);
  height:4px;
  overflow:hidden;
  border:0;
  border-radius:99px;
  background:rgba(238,252,249,.22);
  box-shadow:0 1px 0 rgba(255,255,255,.09),0 6px 18px rgba(0,22,28,.16);
}

#app .loading-progress i {
  position:relative;
  display:block;
  width:8%;
  height:100%;
  overflow:hidden;
  border-radius:inherit;
  background:linear-gradient(90deg,#5ce1bf,#bde56b 60%,#ffd56b);
  box-shadow:0 0 12px rgba(101,226,190,.35);
  transition:width .35s cubic-bezier(.2,.7,.2,1);
}

#app .loading-progress i::after {
  position:absolute;
  inset:0;
  content:'';
  transform:translateX(-110%);
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.72),transparent);
  animation:loading-v2956-shimmer 1.7s ease-in-out infinite;
}

#app .loading-meta {
  display:flex;
  width:min(360px,100%);
  margin-top:8px;
  justify-content:space-between;
  gap:12px;
  color:rgba(244,255,252,.9);
  font:760 9px/1.2 "Segoe UI Variable","Segoe UI",Inter,system-ui,sans-serif;
  text-shadow:0 2px 9px rgba(0,24,30,.7);
}

#app .loading-meta time { color:rgba(225,243,240,.72); font-variant-numeric:tabular-nums; }

#app .loading-tip {
  min-height:18px;
  max-width:410px;
  margin:11px 0 0;
  color:rgba(225,244,240,.72);
  font:520 10px/1.4 "Segoe UI Variable","Segoe UI",Inter,system-ui,sans-serif;
  text-wrap:balance;
  text-shadow:0 2px 10px rgba(0,23,29,.7);
}

#app .loading-recovery {
  width:min(430px,100%);
  margin-top:15px;
  padding:13px;
  border:1px solid rgba(255,255,255,.20);
  border-radius:17px;
  background:rgba(7,34,40,.66);
  box-shadow:0 14px 34px rgba(0,21,27,.24);
  backdrop-filter:blur(8px);
}

#app .loading-screen.is-error .loading-compass {
  animation:none;
  background:linear-gradient(180deg,#8f493b 0 45%,#f1bd54 45% 55%,#fff0d5 55% 100%);
}
#app .loading-screen.is-error .loading-progress i { background:linear-gradient(90deg,#ffad58,#ffdf6c); }
#app .loading-screen.is-channel-switch { background:#173f46; backdrop-filter:none; }
#app .loading-screen.is-channel-switch .loading-scene { opacity:.62; filter:saturate(.8); }
#app .loading-screen.is-session-conflict .loading-compass { background:linear-gradient(180deg,#745b2d 0 45%,#ffd25c 45% 55%,#fff8df 55% 100%); }

@keyframes loading-v2956-drift {
  to { transform:scale(1.055) translate3d(-.35%,.2%,0); }
}
@keyframes loading-v2956-float {
  0%,100% { transform:translate3d(0,0,0); }
  50% { transform:translate3d(0,-5px,0); }
}
@keyframes loading-v2956-orbit { to { transform:rotate(360deg); } }
@keyframes loading-v2956-shimmer { 55%,100% { transform:translateX(120%); } }

@media (max-width:600px) {
  #app .loading-screen {
    align-items:flex-end;
    padding:20px 18px max(34px,calc(23px + env(safe-area-inset-bottom)));
  }
  #app .loading-scene { inset:-3%; background-position:53% center; }
  #app .loading-screen::before { background:linear-gradient(180deg,rgba(10,53,67,.02) 20%,rgba(7,37,44,.15) 46%,rgba(4,25,30,.85) 100%); }
  #app .loading-card { width:min(100%,390px); }
  #app .loading-compass { width:54px; height:54px; margin-bottom:13px; }
  #app .loading-compass::before { width:15px; height:15px; border-width:3px; }
  #app .loading-card > b { font-size:25px; }
  #app .loading-card > #loadingSubtitle { margin-bottom:15px; font-size:11px; }
  #app .loading-tip { max-width:340px; font-size:9px; }
}

@media (prefers-reduced-motion:reduce) {
  #app .loading-scene,
  #app .loading-compass,
  #app .loading-compass i,
  #app .loading-progress i::after { animation:none; }
}