.gate-overlay{
  position:fixed; inset:0; background:rgba(6,20,27,0.75);
  display:flex; align-items:center; justify-content:center;
  z-index:1000; padding:20px;
}
.gate-modal{
  width:100%; max-width:440px; max-height:90vh; overflow-y:auto;
  background:linear-gradient(180deg, #123B4D 0%, #0A2530 100%);
  border:1px solid rgba(255,200,0,0.28);
  border-radius:4px;
  padding:30px 28px 26px;
  font-family:'Poppins',sans-serif;
  color:#FFFEEA;
  position:relative;
}
.gate-modal h2{ font-family:'Lora',serif; font-weight:600; font-size:21px; margin-bottom:8px; }
.gate-modal .gate-sub{ font-size:13px; color:#8FC3C9; line-height:1.5; margin-bottom:20px; }
.gate-field{ margin-bottom:13px; }
.gate-field label{ display:block; font-size:11.5px; color:#8FC3C9; margin-bottom:6px; letter-spacing:0.02em; }
.gate-field input{
  width:100%; background:rgba(255,255,255,0.04); border:1px solid rgba(183,232,235,0.25);
  border-radius:2px; padding:10px 12px; color:#FFFEEA; font-size:14px; font-family:inherit;
}
.gate-field input:focus{ outline:none; border-color:#FFC800; }
.gate-consent{ display:flex; gap:10px; align-items:flex-start; margin:16px 0 18px; font-size:11.5px; color:#8FC3C9; line-height:1.5; }
.gate-consent input{ margin-top:3px; flex:none; }
.gate-consent a{ color:#FFC800; text-decoration:none; }
.gate-error{ color:#FF9B7A; font-size:12px; margin-bottom:12px; display:none; }
.gate-hint{ color:#8FC3C9; font-size:12px; margin-bottom:14px; }
.gate-actions{ display:flex; gap:12px; align-items:center; flex-wrap:wrap; }
.gate-submit{
  background:#FFC800; color:#0A2530; border:none; border-radius:2px;
  padding:11px 22px; font-family:inherit; font-weight:600; font-size:14px; cursor:pointer;
}
.gate-submit:disabled{ opacity:0.6; cursor:default; }
.gate-cancel, .gate-resend{ background:transparent; border:none; color:#8FC3C9; font-size:12.5px; cursor:pointer; font-family:inherit; }
.gate-resend:disabled{ opacity:0.5; cursor:default; }
.gate-close{ position:absolute; top:12px; right:14px; background:none; border:none; color:#8FC3C9; font-size:20px; cursor:pointer; line-height:1; padding:4px; }
.gate-otp-input{ letter-spacing:6px; font-size:20px; text-align:center; }

@media (max-width: 480px){
  .gate-overlay{ padding:12px; align-items:flex-end; }
  .gate-modal{ max-width:100%; border-radius:8px 8px 0 0; max-height:85vh; padding:24px 20px 20px; }
}

/* ---- privacy notice step (scroll-to-consent) ---- */
.gate-modal.gate-wide{ max-width:640px; }

.gate-notice{
  height:min(320px, 42vh); overflow-y:auto;
  border:1px solid rgba(183,232,235,0.25); border-radius:2px;
  background:rgba(255,255,255,0.03);
  padding:2px 16px 6px; margin-bottom:8px;
  font-size:13px; line-height:1.65; color:#FFFEEA;
}
.gate-notice:focus{ outline:none; border-color:#FFC800; }
.gate-modal .gate-notice h2{
  font-family:'Lora',serif; font-weight:500; font-size:15px;
  margin:18px 0 8px; padding-bottom:6px; border-bottom:1px solid rgba(183,232,235,0.18);
}
.gate-notice p, .gate-notice ul{ margin-bottom:12px; }
.gate-notice ul{ padding-left:1.2rem; }
.gate-notice li{ margin-bottom:6px; }
.gate-notice strong{ color:#B7E8EB; font-weight:600; }
.gate-notice a{ color:#FFC800; text-decoration:none; }
.gate-notice-status{ color:#8FC3C9; margin-top:14px; }

.gate-scroll-hint{ font-size:12px; color:#8FC3C9; margin-bottom:14px; }
.gate-scroll-hint.done{ color:#8FE3B0; }

.gate-consents .gate-consent{ margin:0 0 12px; }
.gate-consent.is-locked{ opacity:0.5; }
.gate-consent input:disabled{ cursor:not-allowed; }
.gate-tag{ color:#8FC3C9; font-style:italic; white-space:nowrap; }
.gate-tag-req{ color:#FFC800; }

.gate-full-link{ margin-left:auto; color:#8FC3C9; font-size:12px; text-decoration:none; }
.gate-full-link:hover{ color:#FFC800; }