/* LOGIN */
 :root { --glass: rgba(255,255,255,.75); }

    body{
      min-height:100vh;
      background:
        radial-gradient(1200px 600px at 10% 10%, rgba(13,110,253,.18), transparent 60%),
        radial-gradient(900px 500px at 90% 20%, rgba(25,135,84,.16), transparent 55%),
        radial-gradient(900px 500px at 70% 90%, rgba(220,53,69,.12), transparent 55%),
        linear-gradient(180deg, #0b1220 0%, #0f172a 100%);
    }

    .auth-shell{
      min-height:100vh;
      display:flex;
      align-items:center;
      justify-content:center;
      padding:24px;
    }

    .auth-card{
      width: min(980px, 100%);
      border: 1px solid rgba(255,255,255,.08);
      background: rgba(255,255,255,.06);
      backdrop-filter: blur(10px);
      -webkit-backdrop-filter: blur(10px);
      box-shadow: 0 30px 80px rgba(0,0,0,.35);
      border-radius: 18px;
      overflow:hidden;
    }

    .brand-pane{
      color:#e5e7eb;
      padding:38px;
      background:
        linear-gradient(135deg, rgba(13,110,253,.20), rgba(25,135,84,.10)),
        radial-gradient(700px 400px at 30% 30%, rgba(255,255,255,.12), transparent 60%);
    }

    .brand-badge{
      width:52px;height:52px;
      border-radius:14px;
      display:inline-flex;
      align-items:center;
      justify-content:center;
      background: rgba(255,255,255,.10);
      border: 1px solid rgba(255,255,255,.12);
    }

    .form-pane{
      background: rgba(255,255,255,.90);
      padding:38px;
    }

    .form-control, .form-select{
      border-radius: 12px;
      padding: 12px 14px;
    }

    .btn{
      border-radius: 12px;
      padding: 12px 14px;
    }

    .muted{
      color: rgba(255,255,255,.75);
    }

    @media (max-width: 991.98px){
      .brand-pane{ padding:28px; }
      .form-pane{ padding:28px; }
    }
    
    body{
      min-height:100vh;
      background:
        radial-gradient(1200px 600px at 10% 10%, rgba(13,110,253,.18), transparent 60%),
        radial-gradient(900px 500px at 90% 20%, rgba(25,135,84,.16), transparent 55%),
        radial-gradient(900px 500px at 70% 90%, rgba(220,53,69,.12), transparent 55%),
        linear-gradient(180deg, #0b1220 0%, #0f172a 100%);
    }
    .auth-shell{ min-height:100vh; display:flex; align-items:center; justify-content:center; padding:24px; }
    
    .auth-card{
      width:min(980px,100%);
      border:1px solid rgba(255,255,255,.08);
      background:rgba(255,255,255,.06);
      backdrop-filter: blur(10px);
      -webkit-backdrop-filter: blur(10px);
      box-shadow:0 30px 80px rgba(0,0,0,.35);
      border-radius:18px;
      overflow:hidden;
    }
    .brand-pane{
      color:#e5e7eb;
      padding:38px;
      background:
        linear-gradient(135deg, rgba(13,110,253,.20), rgba(25,135,84,.10)),
        radial-gradient(700px 400px at 30% 30%, rgba(255,255,255,.12), transparent 60%);
    }
    .brand-badge{
      width:52px;height:52px;border-radius:14px;
      display:inline-flex;align-items:center;justify-content:center;
      background:rgba(255,255,255,.10);
      border:1px solid rgba(255,255,255,.12);
    }
    .muted{ color: rgba(255,255,255,.75); }
    .form-pane{ background: rgba(255,255,255,.90); padding:38px; }
    .form-control, .form-select{ border-radius:12px; padding:12px 14px; }
    .btn{ border-radius:12px; padding:12px 14px; }

    /* 2-step slider */
    .step-wrap{ overflow:hidden; }
    .step-track{
      display:flex;
      width:200%;
      transition: transform .35s ease;
    }
    .step-pane{ width:50%; }
    .step-track.is-step2{ transform: translateX(-50%); }

    @media (max-width: 991.98px){
      .brand-pane{ padding:28px; }
      .form-pane{ padding:28px; }
    }