@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;600;700&display=swap');

/* glass-auth.css – glass look for signin.html (and signup.html if it has the same layout).
   Link it AFTER the page's own <style> block. Delete the <link> to go back to the old look. */

body{
  background:linear-gradient(160deg,#EAF3FF,#D6E8FF) fixed;
  color:#0F1B33;
}
body::before{
  content:"";
  position:fixed;
  inset:0;
  z-index:-1;
  pointer-events:none;
  background:
    radial-gradient(520px circle at 6% 6%, rgba(90,176,255,.65), transparent 70%),
    radial-gradient(600px circle at 96% 42%, rgba(30,111,235,.35), transparent 70%),
    radial-gradient(480px circle at 40% 105%, rgba(191,224,255,.95), transparent 70%);
}
body *{
  font-family:Poppins,Arial,sans-serif;
}

body .container{
  position:relative;
  padding:44px 40px;
  background:rgba(255,255,255,.45);
  -webkit-backdrop-filter:blur(22px) saturate(170%);
  backdrop-filter:blur(22px) saturate(170%);
  border:1px solid rgba(255,255,255,.85);
  border-radius:32px;
  box-shadow:0 10px 40px rgba(30,80,170,.16),inset 0 1px 0 rgba(255,255,255,.85),inset 0 -1px 0 rgba(255,255,255,.35);
}
body .container::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  pointer-events:none;
  background:linear-gradient(115deg,rgba(255,255,255,.4) 0%,rgba(255,255,255,0) 34%);
}
body .container > *{
  position:relative;
}
body .container h2{
  font-weight:700;
  color:#0F1B33;
}
body .container input{
  background:rgba(255,255,255,.65);
  border:1px solid rgba(255,255,255,.85);
  border-radius:14px;
  padding:13px 16px;
  color:#0F1B33;
  outline:0;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.85);
}
body .container input::placeholder{
  color:#4F6286;
}
body .container input:focus{
  border-color:#5AB0FF;
  box-shadow:0 0 0 3px rgba(90,176,255,.3);
}
body .container button{
  padding:13px;
  background:linear-gradient(180deg,#4B93FF,#1E6FEB);
  border:1px solid rgba(255,255,255,.45);
  border-radius:999px;
  font-weight:600;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.55),0 6px 18px rgba(30,111,235,.4);
}
body .container button:hover{
  background:linear-gradient(180deg,#2F7BF0,#0B3D91);
}
body .container p{
  color:#4F6286;
}
body .container a{
  color:#1E6FEB;
  font-weight:600;
}
:focus-visible{
  outline:3px solid #5AB0FF;
  outline-offset:2px;
}