@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
  --bg:#071116;
  --surface:#0f1720;
  --surface-strong:rgba(15,23,32,.96);
  --border:rgba(255,255,255,.08);
  --accent:#7c3aed;
  --accent-light:#9d6efd;
  --text:#eef2fb;
  --muted:#8593a0;
  --danger:#f85149;
  --radius:24px;
}
html{min-height:100%}
body{min-height:100vh;font-family:'Inter',system-ui,sans-serif;color:var(--text);background:radial-gradient(circle at top left, rgba(124,58,237,.18), transparent 26%),radial-gradient(circle at bottom right, rgba(56,189,248,.16), transparent 28%),linear-gradient(180deg, #071116 0%, #050a10 100%);display:flex;justify-content:center;align-items:center;overflow-x:hidden}
.auth-bg{position:relative;width:100%;min-height:100vh;padding:24px 24px 120px;display:flex;justify-content:center;align-items:center;}
.blob{position:absolute;border-radius:50%;filter:blur(84px);opacity:.72;pointer-events:none;}
.blob.b1{width:280px;height:280px;top:10%;left:-5%;background:rgba(124,58,237,.22);}
.blob.b2{width:340px;height:340px;bottom:-8%;right:-6%;background:rgba(56,189,248,.18);}
.back-home{position:absolute;top:18px;left:22px;font-size:13px;color:var(--muted);display:inline-flex;align-items:center;gap:8px;text-decoration:none;font-weight:600;z-index:10;transition:color .18s;}
.back-home:hover{color:var(--text)}
.auth-card{position:relative;z-index:2;width:min(100%,460px);padding:40px 36px;display:flex;flex-direction:column;gap:26px;background:rgba(15,23,32,.88);border:1px solid var(--border);border-radius:30px;box-shadow:0 30px 80px rgba(0,0,0,.35);backdrop-filter:blur(22px);}
.auth-card::before{content:'';position:absolute;left:-10px;top:-10px;right:-10px;bottom:-10px;border-radius:34px;background:linear-gradient(135deg, rgba(124,58,237,.14), rgba(56,189,248,.08));z-index:-1;}
.auth-logo{display:flex;align-items:center;gap:14px}
.auth-logo img{width:44px;height:44px;border-radius:16px;object-fit:cover;box-shadow:0 18px 50px rgba(124,58,237,.16)}
.auth-logo span{font-size:18px;font-weight:800;color:var(--text)}
h1{font-size:30px;font-weight:800;letter-spacing:-.45px;line-height:1.05}
.auth-sub{font-size:15px;color:var(--muted);line-height:1.7;max-width:92%}
.alert{padding:14px 16px;border-radius:18px;font-size:13px;line-height:1.5}
.alert.error{background:rgba(248,81,73,.12);border:1px solid rgba(248,81,73,.24);color:#ffb1ae}
.alert.success{background:rgba(63,185,80,.12);border:1px solid rgba(63,185,80,.25);color:#a7f3d0}
.field{display:flex;flex-direction:column;gap:12px}
.field label{font-size:13px;color:var(--muted);font-weight:600}
.field input{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);color:var(--text);padding:14px 14px;border-radius:16px;font-size:14px;font-family:inherit;width:100%;outline:none;transition:border-color .2s,box-shadow .2s;}
.field input:focus{border-color:rgba(124,58,237,.8);box-shadow:0 0 0 8px rgba(124,58,237,.12)}
.field input::placeholder{color:rgba(238,242,251,.45)}
.pw-wrap{position:relative;width:100%;display:flex;align-items:center}
.pw-wrap input{padding-right:54px;width:100%;box-sizing:border-box;border-radius:16px;}
.pw-wrap:focus-within input{border-color:rgba(124,58,237,.85);box-shadow:0 0 0 10px rgba(124,58,237,.12)}
.pw-toggle{position:absolute;right:12px;top:50%;transform:translateY(-50%);background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);border-radius:999px;color:var(--muted);padding:10px;min-width:42px;height:42px;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;font-size:14px;line-height:1;transition:all .18s;}
.pw-toggle:hover{background:rgba(255,255,255,.14);color:var(--text)}
.btn-submit{width:100%;padding:15px 16px;border-radius:18px;border:none;background:linear-gradient(135deg, #7c3aed 0%, #6366f1 100%);color:#fff;font-size:15px;font-weight:700;cursor:pointer;box-shadow:0 20px 44px rgba(124,58,237,.24);transition:transform .18s,box-shadow .18s;}
.btn-submit:hover{transform:translateY(-1px);box-shadow:0 24px 54px rgba(124,58,237,.28)}
.auth-switch{font-size:13px;color:var(--muted);text-align:center;line-height:1.6}
.auth-switch a{color:var(--accent);font-weight:700;text-decoration:none;transition:color .18s}
.auth-switch a:hover{color:var(--accent-light)}
@media(max-width:720px){
  .auth-bg{padding:18px 18px 100px;}
  .blob.b1{width:220px;height:220px;top:6%;left:-12%;}
  .blob.b2{width:260px;height:260px;bottom:-12%;right:-8%;}
  .back-home{top:14px;left:14px;font-size:12px;}
  .auth-card{padding:28px 24px;gap:20px;}
  .auth-logo img{width:38px;height:38px;}
  h1{font-size:26px;}
  .field input{padding:13px 13px;}
  .btn-submit{padding:14px 15px;font-size:14px;}
}