/* Vue 3 登录页样式（独立于 app.css，避免与原有样式冲突） */
#vue-login-root .login-bg {
  min-height: 100vh; display: flex; align-items: center; justify-content: center;
  background: linear-gradient(135deg, #1a1c2e 0%, #16213e 40%, #0f3460 70%, #e94560 100%);
  position: relative; overflow: hidden;
}
#vue-login-root .login-bg::before {
  content: ''; position: absolute; width: 600px; height: 600px;
  background: radial-gradient(circle, rgba(233,69,96,.15) 0%, transparent 70%);
  top: -200px; right: -200px; border-radius: 50%;
}
#vue-login-root .login-bg::after {
  content: ''; position: absolute; width: 400px; height: 400px;
  background: radial-gradient(circle, rgba(15,52,96,.3) 0%, transparent 70%);
  bottom: -100px; left: -100px; border-radius: 50%;
}
#vue-login-root .login-card {
  background: rgba(255,255,255,.96); backdrop-filter: blur(20px);
  border-radius: 16px; padding: 48px 40px; width: 440px; max-width: 95vw;
  box-shadow: 0 20px 60px rgba(0,0,0,.25); position: relative; z-index: 1;
}
#vue-login-root .login-logo { text-align: center; margin-bottom: 32px; }
#vue-login-root .logo-icon { font-size: 48px; margin-bottom: 12px; }
#vue-login-root .login-logo h1 { font-size: 22px; color: #1e293b; font-weight: 700; margin-bottom: 6px; }
#vue-login-root .login-logo p { font-size: 12px; color: #94a3b8; letter-spacing: 1px; }
#vue-login-root .role-tabs {
  display: flex; gap: 8px; margin-bottom: 24px; background: #f5f5f5;
  padding: 4px; border-radius: 8px;
}
#vue-login-root .role-tab {
  flex: 1; padding: 8px 4px; border-radius: 8px; background: transparent;
  font-size: 13px; color: #64748b; border: none; cursor: pointer;
  transition: all .2s; font-family: inherit;
}
#vue-login-root .role-tab.active {
  background: #fff; color: #0f3460; font-weight: 600;
  box-shadow: 0 1px 3px rgba(0,0,0,.06);
}
#vue-login-root .role-tab:hover:not(.active) { color: #0f3460; }
#vue-login-root .form-group { margin-bottom: 16px; }
#vue-login-root .form-group label { display: block; font-size: 12px; color: #475569; margin-bottom: 6px; font-weight: 600; }
#vue-login-root .form-group input,
#vue-login-root .form-group select {
  width: 100%; padding: 9px 12px; border: 1.5px solid #e0e0e0;
  border-radius: 8px; font-size: 13px; transition: all .2s;
  background: #fafafa; color: #1e293b; font-family: inherit; outline: none;
}
#vue-login-root .form-group input:focus,
#vue-login-root .form-group select:focus {
  border-color: #0f3460; background: #fff;
  box-shadow: 0 0 0 3px rgba(15,52,96,.1);
}
#vue-login-root .login-tip { font-size: 12px; margin-bottom: 8px; min-height: 18px; }
#vue-login-root .btn-login {
  width: 100%; padding: 12px;
  background: linear-gradient(135deg, #0f3460, #0c2a4e);
  color: #fff; border: none; border-radius: 8px; font-size: 16px;
  font-weight: 600; cursor: pointer; transition: all .3s;
  letter-spacing: 4px; margin-top: 8px;
}
#vue-login-root .btn-login:hover {
  background: linear-gradient(135deg, #e94560, #d13850);
  transform: translateY(-1px); box-shadow: 0 4px 15px rgba(233,69,96,.4);
}
#vue-login-root .btn-login:disabled {
  opacity: .5; cursor: not-allowed; transform: none; box-shadow: none;
}