*{
      margin:0;
      padding:0;
      -webkit-box-sizing:border-box;
              box-sizing:border-box;
    }

    :root{
      --bg-primary:#0a0e1a;
      --bg-secondary:#111827;
      --bg-card:#1e293b;
      --border-color:rgba(255,255,255,0.08);
      --text-primary:#f8fafc;
      --text-secondary:#94a3b8;
      --accent:#6366f1;
      --accent-hover:#4f46e5;
      --success:#10b981;
      --danger:#ef4444;
    }

    body{
      font-family:'Inter',sans-serif;
      background:linear-gradient(135deg,#0a0e1a,#111827);
      min-height:100vh;
      display:-webkit-box;
      display:-ms-flexbox;
      display:flex;
      -webkit-box-align:center;
          -ms-flex-align:center;
              align-items:center;
      -webkit-box-pack:center;
          -ms-flex-pack:center;
              justify-content:center;
      padding:20px;
      color:var(--text-primary);
    }

    .container{
      width:100%;
      max-width:450px;
    }

    .card{
      background:rgba(30,41,59,0.9);
      backdrop-filter:blur(12px);
      border:1px solid var(--border-color);
      border-radius:28px;
      padding:40px 32px;
      -webkit-box-shadow:0 20px 60px rgba(0,0,0,0.45);
              box-shadow:0 20px 60px rgba(0,0,0,0.45);
    }

    .logo{
      width:70px;
      height:70px;
      border-radius:20px;
      background:linear-gradient(135deg,var(--accent),#8b5cf6);
      display:-webkit-box;
      display:-ms-flexbox;
      display:flex;
      -webkit-box-align:center;
          -ms-flex-align:center;
              align-items:center;
      -webkit-box-pack:center;
          -ms-flex-pack:center;
              justify-content:center;
      margin:0 auto 24px;
      font-size:28px;
      font-weight:800;
    }

    h1{
      font-size:30px;
      text-align:center;
      margin-bottom:10px;
      font-weight:800;
    }

    .subtitle{
      text-align:center;
      color:var(--text-secondary);
      margin-bottom:28px;
      line-height:1.6;
      font-size:15px;
    }

    .message{
      padding:14px 18px;
      border-radius:14px;
      margin-bottom:24px;
      font-size:14px;
      font-weight:500;
    }

    .message.success{
      background:rgba(16,185,129,0.15);
      border:1px solid rgba(16,185,129,0.3);
      color:#6ee7b7;
      opacity: 1;
    }

    .message.error{
      background:rgba(239,68,68,0.15);
      border:1px solid rgba(239,68,68,0.3);
      color:#fca5a5;
      opacity: 1;
    }

    .form-group{
      margin-bottom:22px;
    }

    label{
      display:block;
      margin-bottom:10px;
      font-size:14px;
      font-weight:600;
      color:#e2e8f0;
    }

    input{
      width:100%;
      height:56px;
      border:none;
      outline:none;
      border-radius:16px;
      background:#0f172a;
      border:1px solid rgba(255,255,255,0.08);
      padding:0 18px;
      color:white;
      font-size:15px;
      -webkit-transition:0.3s;
      transition:0.3s;
    }

    input:focus{
      border-color:var(--accent);
      -webkit-box-shadow:0 0 0 4px rgba(99,102,241,0.15);
              box-shadow:0 0 0 4px rgba(99,102,241,0.15);
    }

    input::-webkit-input-placeholder{
      color:#64748b;
    }

    input::-moz-placeholder{
      color:#64748b;
    }

    input:-ms-input-placeholder{
      color:#64748b;
    }

    input::-ms-input-placeholder{
      color:#64748b;
    }

    input::placeholder{
      color:#64748b;
    }

    .btn{
      width:100%;
      height:56px;
      border:none;
      border-radius:16px;
      background:linear-gradient(135deg,var(--accent),#8b5cf6);
      color:white;
      font-size:15px;
      font-weight:700;
      cursor:pointer;
      -webkit-transition:0.3s;
      transition:0.3s;
      margin-top:10px;
    }

    .btn:hover{
      -webkit-transform:translateY(-2px);
              transform:translateY(-2px);
      background:linear-gradient(135deg,var(--accent-hover),#7c3aed);
      -webkit-box-shadow:0 12px 30px rgba(99,102,241,0.35);
              box-shadow:0 12px 30px rgba(99,102,241,0.35);
    }

    @media(max-width:500px){
      .card{
        padding:32px 22px;
        border-radius:22px;
      }

      h1{
        font-size:25px;
      }
    }