:root{
  --wad:#20baa9;
  --wad-dark:#149c8d;
  --ink:#14212b;
  --muted:#70808c;
  --border:#e2e8eb;
  --bg:#f4f7f7;
  --card:#fff;
}
*{box-sizing:border-box}
html,body{min-height:100%}
body{
  margin:0;
  font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  font-size:14px;
  line-height:1.5;
  color:var(--ink);
  background:var(--bg);
  overflow-x:hidden;
}
.bg{position:fixed;inset:0;pointer-events:none;overflow:hidden}
.bg:before{
  content:"";
  position:absolute;
  width:520px;height:520px;
  border-radius:50%;
  top:-270px;right:-130px;
  background:rgba(32,186,169,.08);
}
.bg:after{
  content:"";
  position:absolute;
  width:420px;height:420px;
  border-radius:50%;
  bottom:-260px;left:-150px;
  background:rgba(32,186,169,.055);
}
.grain,.orb{display:none}
.wrap{
  min-height:100dvh;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  padding:24px 16px;
  position:relative;
  z-index:1;
}
.card{
  width:100%;max-width:410px;
  background:var(--card);
  border:1px solid var(--border);
  border-radius:14px;
  box-shadow:0 12px 36px rgba(15,23,42,.07);
  padding:22px;
}
.brand{display:flex;gap:11px;align-items:center;margin-bottom:20px}
.logo{
  width:42px;height:42px;flex:0 0 42px;
  display:flex;align-items:center;justify-content:center;
  border-radius:10px;
  background:rgba(32,186,169,.08);
  border:1px solid rgba(32,186,169,.16);
}
.logo img{width:27px!important;height:27px!important}
.brand-title{font-size:17px;font-weight:700;letter-spacing:-.02em;color:var(--ink)}
.form{margin-top:0}
.field{display:block;margin:0 0 14px}
.label{display:block;font-size:11px;font-weight:600;color:var(--muted);margin:0 0 5px}
.input{
  width:100%;height:42px;
  border-radius:8px;
  border:1px solid #d9e1e4;
  background:#fff;
  color:var(--ink);
  padding:0 11px;
  outline:none;
  font:inherit;
  transition:border-color .15s ease,box-shadow .15s ease;
}
.input::placeholder{color:#a5b0b7}
.input:focus{border-color:rgba(32,186,169,.65);box-shadow:0 0 0 3px rgba(32,186,169,.11)}
.pw{display:flex;gap:7px;align-items:center}.pw .input{flex:1;min-width:0}
.pw-toggle{
  height:42px;padding:0 10px;
  border:1px solid #d9e1e4;
  background:#f8fafb;
  color:#40515c;
  border-radius:8px;
  cursor:pointer;font-size:11px;font-weight:600;
}
.pw-toggle:hover{background:#f3f7f7}
.btn{
  width:100%;min-height:42px;
  border:1px solid var(--wad);
  background:var(--wad);
  color:#fff;
  font-size:13px;font-weight:650;
  padding:9px 13px;
  border-radius:8px;
  cursor:pointer;
  display:flex;align-items:center;justify-content:center;gap:8px;
  box-shadow:none;
  transition:background .15s ease,border-color .15s ease;
}
.btn:hover{background:var(--wad-dark);border-color:var(--wad-dark)}
.foot{margin-top:13px;font-size:11px;color:var(--muted);display:flex;align-items:center;justify-content:center;gap:8px}
.foot .dot{opacity:.6}.link{color:#47706d;text-decoration:none;font-weight:600}.link:hover{color:var(--wad-dark)}
@media(max-width:480px){.wrap{padding:14px 10px}.card{padding:18px 16px;border-radius:12px}.pw{gap:5px}.pw-toggle{padding:0 8px}}