* {
      margin: 0;
      padding: 0;
      box-sizing: border-box;
      font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    }

    body {
      display: flex;
      justify-content: center;
      align-items: center;
      min-height: 100vh;
      background: linear-gradient(135deg, #e3f2fd, #bbdefb);
      padding: 20px;
    }

    .login-container {
      width: 100%;
      max-width: 500px;
      background: linear-gradient(135deg, #7adde9, #64c8d5);
      border-radius: 15px;
      padding: 35px 30px;
      box-shadow: 
        0 10px 30px rgba(0, 0, 0, 0.15),
        0 5px 15px rgba(255, 255, 255, 0.3) inset; /* 添加内阴影增强深度感 */
      text-align: center;
      position: relative;
      overflow: hidden;
    }

    .login-container::before {
      content: "";
      position: absolute;
      top: -50px;
      left: -50px;
      width: 120px;
      height: 120px;
      background: rgba(255, 255, 255, 0.2);
      border-radius: 50%;
      z-index: 1;
      opacity: 0.8; /* 提高透明度 */
    }

    .login-container::after {
      content: "";
      position: absolute;
      bottom: -70px;
      right: -70px;
      width: 160px;
      height: 160px;
      background: rgba(255, 255, 255, 0.15);
      border-radius: 50%;
      z-index: 1;
      opacity: 0.8; /* 提高透明度 */
    }

    .logo {
      font-size: 32px;
      font-weight: 700; /* 稍加重字体 */
      color: #333;
      margin-bottom: 35px;
      position: relative;
      z-index: 2;
      letter-spacing: 2px;
      text-shadow: 0 2px 3px rgba(0, 0, 0, 0.1); /* 添加文字阴影增强立体感 */
      padding-bottom: 15px;
      border-bottom: 1px solid rgba(255, 255, 255, 0.4); /* 添加分隔线增强层次 */
    }

    .logo i {
      margin-right: 10px;
      color: #2c3e50;
    }

    .form-container {
      position: relative;
      z-index: 2;
    }

    /* 优化表单对称性 */
    .form-group {
      display: flex;
      align-items: center;
      margin-bottom: 24px; /* 增加间距 */
      position: relative;
    }
    
    .form-label {
      width: 60px;
      text-align: right;
      padding-right: 16px; /* 微调间距 */
      font-weight: 600; /* 加粗字体 */
      color: #2c3e50;
      font-size: 20px;
      letter-spacing: 0.5px; /* 增加字间距 */
    }
    
    /* 修改输入框容器 */
.input-container {
  position: relative;
  flex: 1;
  max-height: 50px; /* 增加最大高度 */
  max-width: 380px; /* 增加输入框宽度 */
  margin: 0 auto; /* 居中显示 */
}



    
    .input-icon {
      position: absolute;
      left: 15px;
      top: 50%;
      transform: translateY(-50%);
      color: #16a085;
      font-size: 20px; /* 增大图标 */
    }
    
    .toggle-password {
      position: absolute;
      right: 15px;
      top: 50%;
      transform: translateY(-50%);
      cursor: pointer;
      color: #95a5a6;
      font-size: 18px; /* 增大图标 */
      transition: color 0.2s;
    }
    
    .toggle-password:hover {
      color: #16a085; /* 悬停效果 */
    }

    input {
      width: 100%;
      padding: 16px 15px 16px 45px; /* 增加垂直内边距 */
      border: none;
      border-radius: 30px;
      background-color: rgba(255, 255, 255, 0.95); /* 略微透明 */
      font-size: 16px;
      transition: all 0.3s ease;
      box-shadow: 
        0 4px 10px rgba(0, 0, 0, 0.08),
        0 1px 2px rgba(0, 0, 0, 0.05) inset; /* 内阴影增强深度 */
      color: #2c3e50;
    }

    input:focus {
      outline: none;
      box-shadow: 
        0 4px 15px rgba(0, 0, 0, 0.12),
        0 0 0 2px #7adde9;
    }

    #password {
      padding-right: 45px;
    }

    .forgot-password {
      text-align: right;
      margin: -8px 0 20px; /* 调整间距 */
      padding-right: 8px;
    }

    .forgot-password a {
      color: #2c3e50;
      text-decoration: none;
      font-size: 14px;
      transition: all 0.3s;
      position: relative;
      display: inline-block;
    }

    .forgot-password a:hover {
      color: #e74c3c;
      transform: translateX(3px);
    }

    .forgot-password a::after {
      content: '';
      position: absolute;
      bottom: -2px;
      left: 0;
      width: 0;
      height: 1px;
      background: #e74c3c;
      transition: width 0.3s;
    }

    .forgot-password a:hover::after {
      width: 100%;
    }

    .btn {
      width:100%;
      padding: 17px; /* 增加按钮高度 */
      border: none;
      border-radius: 30px;
      background: linear-gradient(to right, #8bc34a, #7cb342); /* 添加渐变 */
      color: white;
      font-size: 18px;
      font-weight: 600;
      cursor: pointer;
      transition: all 0.3s ease;
      box-shadow: 
        0 4px 12px rgba(139, 195, 74, 0.4),
        0 3px 5px rgba(0, 0, 0, 0.1) inset; /* 添加内阴影增强深度 */
      letter-spacing: 1px;
      position: relative;
      overflow: hidden;
      z-index: 1;
    }

    .btn::before {
      content: '';
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background: linear-gradient(to right, #7cb342, #6ea03a);
      opacity: 0;
      transition: opacity 0.3s;
      z-index: -1;
    }
    
    .btn:hover {
      transform: translateY(-3px); /* 增强悬浮效果 */
      box-shadow: 
        0 6px 15px rgba(139, 195, 74, 0.5),
        0 2px 4px rgba(0, 0, 0, 0.1) inset;
    }
    
    .btn:hover::before {
      opacity: 1;
    }

    .btn:active {
      transform: translateY(2px);
      box-shadow: 0 2px 5px rgba(139, 195, 74, 0.3);
    }

    .footer {
      margin-top: 35px; /* 增加页脚上方空间 */
      font-size: 14px;
      color: rgba(255, 255, 255, 0.9); /* 调整为白色文字 */
      text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3); /* 添加文字阴影 */
      line-height: 1.5;
    }

    .footer p {
      letter-spacing: 0.3px;
    }

    @media (max-width: 480px) {
      .login-container {
        padding: 25px 20px;
      }
      
      input {
        padding: 14px 15px 14px 42px;
        font-size: 15px;
      }
      
      .btn {
        padding: 16px;
        font-size: 17px;
      }
      
      .footer {
        font-size: 13px;
      }
    }