:root{
  --text:#ffffff;
  --muted:#aaa;
  --line: #353535;
  --focus: #12af71; /* заменил фиолетовый на тёмно-серый */
  --accent: #0cac00;
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  color:var(--text);
  font-family: 'Montserrat', sans-serif;
  display:flex;
  flex-direction:column;
  align-items:center;
  padding:20px;
}

.page-header{
  text-align:center;
  margin-bottom:20px;
}

.page-header h1{
  margin:0;
  font-size:22px;
  font-weight:700;
}

.page-header p{
  margin:4px 0 0;
  font-size:14px;
  color:var(--muted);
}

.form{
  width:100%;
  max-width:360px;
  display:flex;
  flex-direction:column;
  gap:16px;
    position: relative;
    top: 60px;
}

.field{display:flex;flex-direction:column;gap:6px}

.label{font-size:13px;color:var(--muted)}

.input{
  height:44px;
  padding:0 12px;
  border:1px solid var(--line);
  border-radius:8px;
  background: #2b2b2b;
  color:var(--text);
  font-size:15px;
}

.input:focus{
  border-color:var(--focus);
  outline:none;
}

.error{
  color:#ff6b6b;
  font-size:12px;
}

.hint{
  font-size:12px;
  color:var(--muted);
}

.dropzone{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:8px;
  min-height:100px;
  border:1px dashed var(--line);
  border-radius:8px;
  background:#2b2b2b;
  cursor:pointer;
}

.dropzone.dragover{
  border-color:var(--focus);
  background:#1e1e24;
}

.dz-text{font-size:14px;color:var(--muted)}

.avatar{
  display:none;
  width:72px;
  height:72px;
  border-radius:50%;
  object-fit:cover;
  border:2px solid var(--line);
}

.file{display:none}

.captcha-wrapper{
  display:flex;
  justify-content:center;
}

.btnn{
  height:44px;
  border:none;
  border-radius:8px;
  background:var(--focus);
  color: #ffffff;
  font-weight:600;
  font-size:15px;
  cursor:pointer;
  transition: background .2s;
}

.btnn:hover{background:var(--accent)}

.links{
  text-align:center;
  font-size:14px;
}

.links a{
  color: #b8b8b8;
  text-decoration:none;
}

.links a:hover{text-decoration:none}

@media (max-width:480px){
  body{padding:12px}
  .form{max-width:100%}
}