body {
       font-family: 'Inter', sans-serif;
       background: linear-gradient(135deg, #f8f9fa, #f1f3f6);
       height: 100vh;
       display: flex;
       align-items: center;
       justify-content: center;
   }

   .login-card {
       max-width: 420px;
       width: 100%;
       border-radius: 20px;
       box-shadow: 0 8px 25px rgba(0, 0, 0, 0.08);
       padding: 35px;
       background: #fff;
   }

   .logo {
       width: 64px;
       height: 64px;
       margin-bottom: 15px;
       border-radius: 16px;
       display: flex;
       align-items: center;
       justify-content: center;
       background: #6c63ff;
       color: #fff;
       font-size: 28px;
   }

   .btn-primary {
       background-color: #6c63ff;
       border: none;
       font-weight: 500;
   }

   .btn-primary:hover {
       background-color: #574bdb;
   }

   .btn-outline-secondary {
       font-weight: 500;
   }

   .or-divider {
       display: flex;
       align-items: center;
       text-align: center;
       margin: 25px 0 20px;
       color: #6c757d;
       font-size: 13px;
       font-weight: 500;
   }

   .or-divider::before,
   .or-divider::after {
       content: '';
       flex: 1;
       border-bottom: 1px solid #e5e5e5;
   }

   .or-divider:not(:empty)::before {
       margin-right: .75em;
   }

   .or-divider:not(:empty)::after {
       margin-left: .75em;
   }

   .form-label {
       font-size: 14px;
       font-weight: 500;
   }

   .form-control {
       border-radius: 10px;
       padding: 12px;
   }

   h3 {
       font-weight: 700;
       margin-top: 10px;
   }

   h5 {
       font-weight: 600;
   }

   .text-muted {
       font-size: 14px;
   }