/* dineshpant.com — access gate (index.html only) */
*,*::before,*::after{ box-sizing:border-box; }
html,body{ height:100%; }
body{
  margin:0;
  display:flex; align-items:center; justify-content:center;
  padding:28px;
  background:#101520;
  color:#f5f1e8;
  font-family:"IBM Plex Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  font-size:16px; line-height:1.6;
  -webkit-font-smoothing:antialiased;
  -webkit-text-size-adjust:100%;
}
.gate{ width:100%; max-width:392px; }
.gate__label{
  display:block;
  font-family:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  font-size:.68rem; letter-spacing:.24em; text-transform:uppercase;
  color:#bd7742; margin:0 0 20px;
}
.gate__field{ position:relative; }
.gate__input{
  width:100%; display:block;
  background:transparent; color:#f5f1e8;
  border:0; border-bottom:1px solid rgba(245,241,232,.34);
  padding:14px 2px; min-height:52px;
  font-family:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  font-size:1.06rem; letter-spacing:.34em;
  border-radius:0; -webkit-appearance:none; appearance:none;
  transition:border-color .25s ease;
}
.gate__input::placeholder{ color:rgba(168,173,184,.55); letter-spacing:.3em; }
.gate__input:focus{ outline:none; border-bottom-color:#bd7742; }
.gate__input:focus-visible{ outline:2px solid #bd7742; outline-offset:4px; }
.gate.is-error .gate__input{ border-bottom-color:#e0785c; }

.gate__btn{
  margin-top:26px; width:100%;
  display:inline-flex; align-items:center; justify-content:space-between; gap:12px;
  background:#f5f1e8; color:#101520; border:1px solid #f5f1e8;
  padding:16px 22px; min-height:52px; cursor:pointer; border-radius:0;
  font-family:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  font-size:.7rem; font-weight:500; letter-spacing:.2em; text-transform:uppercase;
  transition:background .24s ease,color .24s ease,border-color .24s ease;
}
.gate__btn:hover{ background:#bd7742; border-color:#bd7742; color:#101520; }
.gate__btn:focus-visible{ outline:2px solid #bd7742; outline-offset:3px; }

.gate__msg{
  margin:16px 0 0; min-height:1.5em;
  font-family:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  font-size:.68rem; letter-spacing:.13em; text-transform:uppercase;
  color:#f0a08a;
}
.gate__msg:empty{ min-height:1.5em; }

@media (max-width:400px){
  body{ padding:22px; }
  .gate__input{ font-size:1rem; letter-spacing:.26em; }
  .gate__btn{ font-size:.64rem; letter-spacing:.16em; padding:15px 16px; }
}
@media (prefers-reduced-motion: reduce){
  *{ transition-duration:.001ms !important; animation-duration:.001ms !important; }
}