:root{
  --radius-sm:12px;
  --accent:#fe6220;
  --ink:#1c1c1e; --ink2:#3a3a3c; --muted:#6e6e73;
  --glass-strong:rgba(255,255,255,.82);
  --field:rgba(255,255,255,.9);
  --line:rgba(60,60,67,.14);
  --hair:rgba(255,255,255,.6);
  --shadow:0 1px 2px rgba(0,0,0,.08),0 20px 60px rgba(0,0,0,.22);
  --font:-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display","Helvetica Neue",Arial,sans-serif;
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent;}
html,body{margin:0;min-height:100%;}
body{
  font-family:var(--font); color:var(--ink); font-size:15px; line-height:1.45;
  min-height:100vh; display:flex; align-items:center; justify-content:center; padding:24px;
  background:
    radial-gradient(at 80% 18%,#ff8a5b 0,transparent 50%),
    radial-gradient(at 15% 25%,#fe6220 0,transparent 45%),
    radial-gradient(at 50% 95%,#7c3aed 0,transparent 55%),
    linear-gradient(160deg,#ffb347,#c9305f 60%,#3a1b5c);
  background-attachment:fixed;
}
.card{
  width:100%; max-width:400px;
  background:var(--glass-strong);
  backdrop-filter:saturate(180%) blur(30px); -webkit-backdrop-filter:saturate(180%) blur(30px);
  border:.5px solid var(--hair); border-radius:22px;
  box-shadow:var(--shadow); padding:32px 30px;
}
.brand{display:flex;align-items:center;gap:10px;}
.brand .badge{width:12px;height:12px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 4px rgba(254,98,32,.2);}
.brand h1{font-size:20px;margin:0;font-weight:700;letter-spacing:-.02em;}
.sub{color:var(--muted);font-size:13px;font-weight:500;margin:4px 0 22px 22px;}
.field{margin-bottom:14px;}
.field label{display:block;font-size:12px;font-weight:700;color:var(--muted);margin-bottom:6px;text-transform:uppercase;letter-spacing:.03em;}
.field input{width:100%;font-family:inherit;font-size:15px;border:.5px solid var(--line);border-radius:var(--radius-sm);padding:12px 13px;background:var(--field);color:var(--ink);transition:.15s;}
.field input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px rgba(254,98,32,.18);}
.pw-wrap{position:relative;}
.pw-wrap .toggle{position:absolute;right:6px;top:50%;transform:translateY(-50%);background:none;border:none;color:var(--muted);font-size:12px;font-weight:700;cursor:pointer;padding:8px;}
.btn-primary{
  width:100%; display:block; text-align:center; text-decoration:none;
  font-family:inherit; border:none; cursor:pointer;
  background:var(--accent); color:#fff; padding:13px 15px; border-radius:980px;
  font-size:15px; font-weight:700; margin-top:6px;
  box-shadow:0 4px 16px rgba(254,98,32,.4); transition:.15s;
}
.btn-primary:hover{filter:brightness(1.04);}
.btn-primary:active{transform:scale(.98);}
.btn-primary:disabled{opacity:.6;cursor:default;}
.btn-link{margin-top:20px;}
.error{background:rgba(255,69,58,.12);color:#c0271d;border:.5px solid rgba(255,69,58,.3);border-radius:var(--radius-sm);padding:10px 12px;font-size:13px;font-weight:600;margin-bottom:16px;}
.foot{margin-top:18px;text-align:center;font-size:12px;color:var(--muted);}
.hello{font-size:26px;font-weight:800;letter-spacing:-.02em;margin:18px 0 4px;}
.hello-note{color:var(--muted);font-size:13px;margin:0;}
