[v-cloak] {
    display: none;
}

#Loading {
    width: 100vw;
    height: 100vh;
    background: linear-gradient(135deg, #85e3ff, #fff);
    position: fixed;
    top: 0;
    left: 0;
    z-index: 100;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

@-webkit-keyframes ball-beat {
    50% {
        opacity: 0.2;
        -webkit-transform: scale(0.75);
        transform: scale(0.75);
    }
    100% {
        opacity: 1;
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}

@keyframes ball-beat {
    50% {
        opacity: 0.2;
        -webkit-transform: scale(0.75);
        transform: scale(0.75);
    }
    100% {
        opacity: 1;
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}

.ball-beat {
    display: flex; /* Flexbox 布局 */
    align-items: flex-end; /* 让球体底部对齐 */
}

.ball-beat > div {
    background-color: #4999ff;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    margin: 4px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.2); /* 添加阴影 */
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    display: inline-block;
    -webkit-animation: ball-beat 0.7s 0s infinite linear;
    animation: ball-beat 0.7s 0s infinite linear;
}

.ball-beat > div:nth-child(2n-1) {
    -webkit-animation-delay: 0.35s !important;
    animation-delay: 0.35s !important;
}

.loading-text {
    margin-top: 20px;
    font-size: 16px;
    color: #333;
    text-align: center;
}

*{  margin: 0;  padding: 0;  box-sizing: border-box;  font-family:'poppins', sans-serif;}
body{  display: flex;  justify-content: center;  align-items: center;  min-height: 100vh;  background: #1f293a;}
.container {  position: relative;  width: 256px;  height: 256px;  display: flex;  justify-content: center;  align-items: center;}
.container span {  position: absolute;  left: 0;  width: 32px;  height: 6px;  background: #2c4766;  border-radius: 8px;  transform-origin: 128px;  transform: scale(2.2) rotate(calc(var(--i) * (360deg / 50)));  animation: animateBlik 3s linear infinite;  animation-delay: calc(var(--i) * (3s / 50));}
@keyframes animateBlik {  0% {    background: #0ef;  }    25% {    background: #2c4766;  }}
.login-box{  position: absolute;  width: 400px;  /* background: red; */}
.login-box form{  width: 100%;  padding: 0 50px;}
h2 {  font-size: 2em;  color: #0ef;  text-align: center;}
.input-box{  position: relative;  margin: 25px 0;}
.input-box input{  width: 100%;  height: 50px;  background: transparent  border:2px solid  #2c4766;  outline: none;  border-radius: 40px;  font-size: 1em;  color: #626a78;  padding: 0 20px;  transform: .5s ease;}
.input-box input:focus,.input-box input:valid,{  border-color: #0ef;  }
.input-box input:focus~label,.input-box input:valid~label,{  top: 1px;  font-size: .8em;  background: #1f29a;  padding: 0 6px;  color: #0ef;}
.forgot-pass{  margin: -15px 0 10px;  text-align: center;}
.forgot-pass a{  font-size: .85em;  color: #fff;  text-decoration: none;}
.forgot-pass a:hover {  text-decoration: underline;}
.btn{  width: 100%;  height: 45px;  background: #0ef;  border: none;  outline: none;  border-radius: 40px;  cursor: pointer;  font-size: 1em;  color: #1f293a;  font-weight: 600;}
.signup-link {  margin: 20px 0 10px;  text-align: center;}
.signup-link a {  font-size: 1em;  color: #0ef;  text-decoration: none;  font-weight: 600;}
.signup-link a:hover {  text-decoration: underline;}
.language-switcher {position: fixed;top: 20px;right: 20px;z-index: 1000;animation: none;animation: none !important;}
button {font-family: 'Poppins', sans-serif;font-size: 14px;padding: 8px 16px;background-color: #0ef;color: #1f293a;border: none;border-radius: 30px;cursor: pointer;transition: all 0.3s ease;text-align: center;text-transform: uppercase;letter-spacing: 1px;}
button:hover {background-color: #0cd6e2;transform: scale(1.05);}
button:active {background-color: #009ba3;transform: scale(0.98);}
.footer {display: flex;justify-content: center;align-items: center;position: fixed;bottom: 0;width: 100%;padding: 5px 0;text-align: center;box-shadow: 0 -2px 3px rgba(0, 0, 0, 0.1);}
.footer a {font-size: 14px;text-decoration: none;color: #78807e;}