/* Login-only two-second welcome. Native server authentication still owns acceptance. */
.login-loading[hidden],
.login-loading [hidden] {
  display: none !important;
}

.login-loading {
  position: fixed;
  inset: 0;
  z-index: 10050;
  overflow-y: auto;
  overscroll-behavior: contain;
  display: grid;
  align-items: center;
  justify-items: center;
  padding: 28px 20px;
  color: #f6eee0;
  background:
    radial-gradient(ellipse at 50% 38%, rgba(115, 70, 19, .2), transparent 53%),
    radial-gradient(ellipse at 8% 10%, rgba(16, 40, 79, .3), transparent 58%),
    #060b15;
  font-family: "Leelawadee UI", "Noto Sans Thai", "Segoe UI", Tahoma, system-ui, sans-serif;
}

.login-loading__panel {
  width: min(100%, 760px);
  position: relative;
  text-align: center;
  outline: none;
}

.login-loading__panel::before {
  content: "";
  position: absolute;
  top: -14px;
  left: 50%;
  width: 150px;
  height: 1px;
  transform: translateX(-50%);
  background: linear-gradient(90deg, transparent, #d5a650, transparent);
}

.login-loading__eyebrow {
  margin: 0 0 4px;
  color: #c8ac76;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .25em;
  line-height: 1.8;
}

.login-loading__copy {
  position: relative;
  margin: -8px auto 0;
  max-width: 570px;
}

.login-loading .vh-dragon-scene {
  width: min(420px, 74vw, 56vh);
  margin: 0 auto 12px;
}
.login-loading .vh-dragon-flow { animation-duration: 2s; }
.login-loading .vh-dragon-flow--ice { animation-delay: -1s; }

.login-loading__kicker {
  margin: 0 0 9px;
  color: #ad8950;
  font-size: 10px;
  letter-spacing: .3em;
  font-weight: 600;
}

.login-loading h1 {
  margin: 0 0 18px;
  font-size: clamp(23px, 3.2vw, 36px);
  line-height: 1.4;
  font-weight: 600;
  color: #f9ebca;
  text-shadow: 0 0 35px rgba(206, 149, 44, .24);
}

.login-loading__status {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  margin: 0;
  font-size: 16px;
  line-height: 1.7;
  color: #e5edf7;
}

.login-loading__status::before {
  content: "";
  flex: 0 0 6px;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #e3b75e;
  box-shadow: 0 0 12px rgba(227, 183, 94, .7);
}

.login-loading__detail,
.login-loading__slow {
  margin: 9px 0 0;
  color: #9eabbc;
  font-size: 15px;
  line-height: 1.8;
}

.login-loading__slow {
  color: #eed196;
}

.login-loading__footnote {
  margin: 22px 0 0;
  color: #627188;
  font-size: 9px;
  letter-spacing: .3em;
}

@media (max-width: 480px) {
  .login-loading { padding: 25px 18px; }
  .login-loading__eyebrow { font-size: 9px; letter-spacing: .17em; }
  .login-loading__copy { margin-top: 12px; }
  .login-loading h1 { margin-bottom: 15px; }
  .login-loading__status { font-size: 16px; }
  .login-loading__detail, .login-loading__slow { font-size: 14px; }
}

@media (max-height: 650px) and (min-width: 700px) {
  .login-loading { padding-top: 24px; padding-bottom: 18px; }
  .login-loading h1 { margin-bottom: 9px; font-size: 27px; }
  .login-loading__footnote { margin-top: 12px; }
}
