/* Login follows the same palette as the rest of the club. */
.container[data-v-d4221c84] {
  --login-accent: var(--ds-accent, #e4b525);
  --login-surface: var(--ds-surface, #fff);
  --login-text: var(--ds-text, #20242b);
  --login-muted: var(--ds-muted, #7a808a);
  --login-shadow: rgb(30 27 18 / 16%);
  box-sizing: border-box;
  isolation: isolate;
  overflow: hidden;
  min-height: 100vh;
  min-height: 100dvh;
  padding-bottom: max(32px, env(safe-area-inset-bottom));
  background: var(--ds-bg, #f6f8fb) !important;
  color: var(--login-text);
}
.container[data-v-d4221c84]::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0 0 auto;
  height: min(52vh, 420px);
  background: radial-gradient(ellipse at 50% 8%, var(--ds-glow, #f9eabd), transparent 72%);
  opacity: .58;
  pointer-events: none;
}
.container[data-v-d4221c84] .header-bg { display: none !important; }
.container[data-v-d4221c84] .logo-section .logo-box {
  position: relative;
  box-sizing: border-box;
  width: 94px;
  height: 94px;
  padding: 6px;
  overflow: visible;
  border: 1px solid color-mix(in srgb, var(--login-text) 10%, var(--login-surface));
  border-radius: 26px;
  background: linear-gradient(145deg, color-mix(in srgb, var(--login-surface) 90%, #fff), var(--login-surface));
  box-shadow: 0 18px 36px -10px var(--login-shadow),
    0 5px 12px rgb(0 0 0 / 8%),
    inset 0 1px 0 rgb(255 255 255 / 26%);
  transform: translateY(-3px);
}
.container[data-v-d4221c84] .logo-section .logo-box::before {
  content: "";
  position: absolute;
  z-index: -1;
  left: 14%;
  right: 14%;
  bottom: -12px;
  height: 17px;
  border-radius: 50%;
  background: var(--login-accent);
  opacity: .18;
  filter: blur(12px);
  pointer-events: none;
}
.container[data-v-d4221c84] .logo-section .logo-box uni-image {
  display: block;
  width: 100%;
  height: 100%;
  overflow: hidden;
  border-radius: 19px;
}
.container[data-v-d4221c84] .logo-section .app-name {
  color: var(--login-text) !important;
}
.container[data-v-d4221c84] .agreement-section .agreement-text,
.container[data-v-d4221c84] .agreement-section .agreement-content {
  color: var(--login-muted) !important;
}
.container[data-v-d4221c84] .agreement-section .link {
  color: var(--login-accent) !important;
}
.container[data-v-d4221c84] .agreement-section .checkbox {
  background: var(--login-surface);
  border-color: color-mix(in srgb, var(--login-muted) 58%, transparent);
}
.container[data-v-d4221c84] .agreement-section .checkbox.checked {
  background: var(--login-accent);
  border-color: var(--login-accent);
}
.container[data-v-d4221c84] .agreement-section .checkbox .check-icon {
  color: var(--ds-on-accent, #191b20);
}
.container[data-v-d4221c84] .btn-login {
  color: var(--ds-on-accent, #191b20) !important;
  background: linear-gradient(125deg, color-mix(in srgb, var(--login-accent) 82%, #fff), var(--login-accent)) !important;
  box-shadow: 0 8px 22px -7px color-mix(in srgb, var(--login-accent) 42%, transparent) !important;
}
.container[data-v-d4221c84] .btn-login:active {
  box-shadow: 0 3px 10px -3px color-mix(in srgb, var(--login-accent) 30%, transparent) !important;
}
.container[data-v-d4221c84] .btn-login:disabled { box-shadow: none !important; }
.container[data-v-d4221c84] .loading-spinner {
  border-color: color-mix(in srgb, var(--ds-on-accent, #191b20) 24%, transparent);
  border-top-color: var(--ds-on-accent, #191b20);
}
.container[data-v-d4221c84] .btn-demo {
  background: var(--login-surface) !important;
  color: var(--login-text) !important;
  border-color: color-mix(in srgb, var(--login-muted) 16%, transparent);
  box-shadow: 0 3px 12px rgb(0 0 0 / 5%);
}
.container[data-v-d4221c84] .btn-demo:active {
  background: color-mix(in srgb, var(--login-accent) 7%, var(--login-surface)) !important;
}
.container[data-v-d4221c84] .btn-skip { color: var(--login-muted) !important; }
.container[data-v-d4221c84] .btn-skip:active { color: var(--login-accent) !important; }
html[data-ds-dark="true"] .container[data-v-d4221c84] {
  --login-shadow: rgb(0 0 0 / 58%);
}
html[data-ds-dark="true"] .container[data-v-d4221c84]::before { opacity: .4; }