:root{
  --st-bg:#eef2f6;
  --st-card:#ffffff;
  --st-text:#111827;
  --st-muted:#6b7280;
  --st-border:#dbe3ee;
  --st-btn:#20242b;
  --st-btn-text:#ffffff;
  --st-radius:24px;
  --st-shadow:0 18px 45px rgba(0,0,0,.12);
  --st-danger-bg:#fee2e2;
  --st-danger:#991b1b;
}
*{box-sizing:border-box}
html,body{min-height:100%}
body{
  font-family:Arial,sans-serif;
  background:var(--st-bg)!important;
  color:var(--st-text)!important;
  margin:0;
  min-height:100vh;
  min-height:100dvh;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:14px;
}
.box{
  background:var(--st-card)!important;
  color:var(--st-text)!important;
  border:1px solid var(--st-border)!important;
  padding:24px;
  border-radius:var(--st-radius);
  max-width:430px;
  width:100%;
  box-shadow:var(--st-shadow);
}
.logo{
  font-size:30px;
  font-weight:1000;
  letter-spacing:-.04em;
  margin-bottom:8px;
}
.logo span{color:#ea580c}
.logo sup{font-size:12px}
h1{margin:0 0 8px;font-size:28px;color:var(--st-text)!important}
p{color:var(--st-muted)!important;line-height:1.45;margin:0 0 16px}
input{
  width:100%;
  min-height:52px;
  padding:14px;
  border:1px solid var(--st-border)!important;
  border-radius:16px;
  margin:8px 0;
  font-size:16px;
  background:var(--st-card)!important;
  color:var(--st-text)!important;
  outline:none;
}
input:focus{
  border-color:#111827!important;
  box-shadow:0 0 0 4px rgba(17,24,39,.08);
}
.pass-wrap{position:relative}
.pass-wrap input{padding-right:58px}
.eye{
  position:absolute;
  right:7px;
  top:15px;
  width:42px;
  height:38px;
  border:0;
  border-radius:999px;
  background:color-mix(in srgb, var(--st-card) 70%, var(--st-bg));
  color:var(--st-text)!important;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  font-weight:1000;
}
button,.btn{
  border:0;
  border-radius:999px;
  background:var(--st-btn)!important;
  color:var(--st-btn-text)!important;
  padding:13px 18px;
  font-weight:1000;
  text-decoration:none;
  display:inline-flex;
  justify-content:center;
  align-items:center;
  cursor:pointer;
  min-height:46px;
}
.submit{width:100%;margin-top:4px}
.err{
  background:var(--st-danger-bg);
  color:var(--st-danger);
  padding:11px;
  border-radius:16px;
  margin-bottom:12px;
  font-weight:900;
}
.captcha-box{margin:14px 0;display:flex;justify-content:center;min-height:78px;overflow:auto}
.top-actions{
  position:fixed;
  left:14px;
  top:14px;
  right:14px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:8px;
  pointer-events:none;
}
.top-actions a,.top-actions button{pointer-events:auto}
.secondary{
  background:var(--st-card)!important;
  color:var(--st-text)!important;
  border:1px solid var(--st-border)!important;
}
.security-note{
  margin-top:14px;
  text-align:center;
  font-size:12px;
  color:var(--st-muted);
  line-height:1.45;
}
@media(max-width:700px){
  body{align-items:flex-start;padding-top:76px}
  .top-actions{top:10px;left:10px;right:10px}
  .box{padding:20px;border-radius:22px}
  .btn{padding:12px 14px}
}
