/* ===== AUTH MODAL ===== */
.modal-overlay{
  position:fixed;inset:0;z-index:100;
  background:rgba(7,19,7,.55);backdrop-filter:blur(6px);
  display:none;align-items:center;justify-content:center;padding:20px;
}
.modal-overlay.open{display:flex}

.modal{
  width:100%;max-width:400px;background:#fff;border-radius:24px;
  padding:34px 32px 30px;position:relative;
  box-shadow:0 24px 70px rgba(7,19,7,.18);
}
.modal-close{
  position:absolute;top:16px;right:16px;width:30px;height:30px;
  display:flex;align-items:center;justify-content:center;
  border:none;background:transparent;cursor:pointer;border-radius:8px;transition:.2s;
}
.modal-close:hover{background:rgba(7,19,7,.05)}
.modal-close svg{width:15px;height:15px;stroke:var(--dark);stroke-width:1.6;stroke-linecap:round}

.modal h3{font-family:'Unbounded',sans-serif;font-size:21px;font-weight:600;line-height:1.2}
.modal .sub{margin-top:9px;font-size:12.5px;line-height:1.6;color:var(--muted)}

.field{margin-top:18px}
.field label{display:block;font-size:11.5px;font-weight:600;color:var(--muted);margin-bottom:7px}
.field input{
  width:100%;height:46px;padding:0 14px;
  font-family:'Montserrat',sans-serif;font-size:14px;color:var(--dark);
  background:#fff;border:1px solid var(--line);border-radius:12px;outline:none;transition:.2s;
}
.field input::placeholder{color:#A9B3A9}
.field input:focus{border-color:var(--dark)}
.field input:disabled{background:#F6F7F6;color:#A9B3A9;cursor:not-allowed}

.code-row{display:flex;gap:8px}
.code-row input{flex:1}
.code-row .btn{height:46px;padding:0 18px;font-size:13px;border-radius:12px;flex:none}

.modal .btn-submit{width:100%;height:48px;margin-top:22px;font-size:14px}
.btn:disabled,.btn[disabled]{opacity:.42;cursor:not-allowed;pointer-events:none}

.modal-alt{display:flex;align-items:center;gap:12px;margin:20px 0 4px}
.modal-alt::before,.modal-alt::after{content:'';flex:1;height:1px;background:var(--line)}
.modal-alt span{font-size:11px;color:var(--muted)}

.btn-tg{width:100%;height:48px;display:flex;align-items:center;justify-content:center;gap:9px;background:var(--dark);color:#fff;border-radius:14px;font-weight:600;font-size:14px}
.btn-tg svg{width:17px;height:17px;stroke:#fff;fill:none;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}

.modal .agree{margin-top:16px;font-size:10.5px;line-height:1.55;color:var(--muted);text-align:center}
.modal .agree a{text-decoration:underline}
.modal .swap{margin-top:18px;font-size:12px;color:var(--muted);text-align:center}
.modal .swap a{color:var(--dark);font-weight:600}

@media(max-width:480px){
  .modal{padding:28px 20px 24px;border-radius:20px}
  .modal h3{font-size:18px}
}